Feb–Mar 2019

An online charting platform to create, save and share charts. A complete UI/UX re-design for Meta Chart.

Feb–Mar 2019

An online charting platform to create, save and share charts. A complete UI/UX re-design for Meta Chart.

Logotype

Meta Chart logotype tells one chart creation story.

Preloaders

Various content preloaders based on the logotype and the platform core feature. These preloaders accompany users across the website, building up for a consistent brand feel.

Website

The website UI/UX has been completely revamped and improved. The new Meta Chart website features brand storytelling via Sign Up and On-Boarding flows, re-worked Chart Designer flow, pixel-perfect icons, promotional images and Live Preview.

Home

The home page provides a clear CTA, shows a set of Meta Chart core features, explains Pricing Plans and allows the user to try out Meta Chart in action right away.

Sign Up

We demonstrate the Product beyond the Home page, right there at Sign Up flow. Reason being getting early user engagement and familiarizing the user with the platform features.

The Product demos are animated, using a fallback static image for browsers that doesn’t support background video playback.

Dashboard
Live Preview
Protected Charts
Chart Wizard

Sign In

Account creation flow features static Product images since we expect user being familiar with Product features already.

On-Boarding: Basic KYC

Meta Charts opts into knowing their customers better, by asking them their name and a few simple questions before they start their journey (like, for example, their intended usage for Meta Chart, their current occupation, etc).

On-Boarding: Features

Platform core feature are explained at the On-Boarding flow for the first-time users. We educate users on the main feature along with the ones included with Meta Chart Premium Subscription.

On-Boarding flow is introduced to minimize users bounce rate and increase their overall satisfaction with the platform.

On-Boarding: Free Trial

A very special case is processing user’s Free Trial. In this case, Meta Chart have a few prompts designed to notify the user whether he’s near his Free Trial term.

Dashboard

Meta Chart Dashboard allows the user to navigate Saved Charts, manage Charts Folders, go to editing charts and manage chart Share Options.

The Dashboard also provides useful insights into user’s Charts Quota and ways to increase it, helping with converting users into paying customers.

Chart Wizard

Meta Chart Wizard allows users to pick from 12 different Chart Types and design a chart with their own data.

The Wizard provides Colors Themes, 2D/3D representations, Live Preview and a professional data input.

Chart Wizard: Live Preview

Live Preview is a Premium feature that allows tweaking the charts on the fly.

Themes

Meta Charts offers 9 designer themes: Original, Original Dark, Original Mono, Finance, Blueprint, Blueprint Inverted, Sci-Fi, Metro, Dreamy.

UI Kit

The exclusive and extensively detailed Meta Chart UI Kit.

Share Images

Images and video background for social networks and advertising campaigns.

Creative Direction, Product Design

Pavel Pekanov

© 2004–2019

Copied!