A sales analysis dashboard designed for sportswear sales executives

wifi

Sales by product, city, and store

Get an overview of total sales by product, city and store

wifi

Breakdown of sales of products across different cities and stores

It is usually helpful to understand sales breakdown of products across different stores and cities

wifi

Sales trend of products by city and store

Envision the future based on current sales performance of products by city and store

wifi

Achievements of sales associates

Get insight into how sales associates are selling the products

wifi

Real-time remaining inventory per product per store

Keep an eye on product inventory to guide future ordering

Learn more design story about this dashboard

Background

This is a design challenge that is asking me to design a sales analysis dashboard for sales executives at a sportswear company.

With this dashboard, sales executives and managers will be able to get a deeper insight into sales performance of products and employees with easy-to-understand data visualizations and reports.

What I did

wifi

UX Design

Wireframe Prototyping
Sketch Prototyping
Invision Prototyping

wifi

UX Research

User Interview
User Testing

wifi

Research and preparation

In this challenge, the client has explicitly expressed the functionality requirements and features needed to be accomplished. Therefore, I used given requirements from the client as a baseline for my design. At the same time, I researched on the user interface and interaction flow of building and presenting dashboards on Microstrategy desktop (Mac) in order to get familiar with the design language and pattern Microstrategy used.

Persona

Based on what i learned from the research and client requirements, I created the persona of my client.

wifi

Current Solutions

I compared three popular business analytics tools in terms of their features.

wifi
Microstrategy
wifi
Tableau
wifi
Klipfolio
Built-in gallery for beginners wifi wifi wifi
Customizable data dashboard wifi wifi wifi
Sharing data visualizations wifi wifi wifi

Conclusion

wifi

Allow users to view data in different chart formats

To make use of the built-in gallery feature, it will be helpful to allow users to change data visualizations into different layouts to fulfill various purposes

wifi

Easy to organize layout on data dashboards

Due to the amount of various data visualizations, organizing the layout of dashboards should be simple and intuitive

wifi

Exportable charts and reports

The dashboard should allow users to export and present charts and reports on dashboards

Ideation

wifi

Cross-chart Update on the fly

Considering the client wants to see multiple interdependent data visualizations on the dashboard, update on one chart should reflect the change on other related charts on the fly

Customizable dashboard layout

Since there are various kinds of charts and tables, users should have the full control of dashboard layout to fit their reading needs

wifi
ƒ
wifi

Exportable interactive data assets

Exporting data assets and maintaining their interactivity can help users convey information more efficiently

Low-fi Prototype

Sales overview

wifi
wifi

Sales distribution across stores and cities

wifi

Sales trend across stores and cities

wifi

Sales associate performance

wifi

Product inventory

wifi

Color Scheme

I referred to the design guidance used by Microstrategy desktop for UI design to give users a familiar user interface so they can have a shorter learning time


wifi

#1 - primary tab bar

#B4B2B2

#2 - toolbar

#f8f8f8

#3 - Background

#f5f5f5

Typography

Chart title 18px Semibold

Toolbar / tab bar title 16px Medium

Chart legend / data label 16px

Content text 12px

Design Specs

View the full design specs here.

High-fi Prototype

Sales overview

wifi
wifi

Sales distribution across stores and cities

wifi
wifi

Sales trend across stores and cities

wifi
wifi

Sales associate performance

wifi
wifi

Product inventory

wifi

Grid-based data summary

wifi

User Testing

wifi
wifi

Design Iterations

wifi
wifi

Final Design

Sales overview

wifi
wifi

Sales distribution across stores and cities

wifi
wifi

Sales trend across stores and cities

wifi
wifi

Sales associate performance

wifi
wifi

Product inventory

wifi

Grid-based data summary

wifi

Exporting data assets

wifi
wifi