Global Logistic Data Dashboard

Designing a centralised data dashboard for the management of a global logistics company to accelerate decision-making

Design

The timeframe was limited and the developers were eager to begin development as soon as possible. Following is the key questions for rolling out the design:

What should we do first?
Should we design our own chart components from scratch?
How can we ensure the components are viable with minimum resources and time?

Understand

Empathise

Stage 1

What should we do first?

Action

Information Architecture Diagram - Analysed the insight from the user, I designed the Information Architecture Diagram.

Reasoning

Provide the foundation for development team to start to work on dashboard foundation and the Restful APIs
Allows Project Manager to estimate lead time.

Stage 2

Should we develop our own design of chart components from scratch?

Action

Chart Components - Due to the schedule and communication with the developer, we decided to adopt the existing JS library to modify it for more efficient of implementation.
UI Design System - Design the rest of UI Design System, like grid system, navigation, filtering and sorting

Reasoning

Allows frontend developers to work efficiently.
Builds a consistent, reusable and extensible product.

Stage 3

How can we ensure the components are viable with minimum resources and time?

Action

Pilot Run Usability Study - Designed an interactive prototype with Asia-Pacific region to demonstrate the data comparison flow.

Reasoning

By components-based design with openAPI, it can adopt any region team to demonstrate the user story of comparison

Layout and Components

Information Architecture

Contents

The timeframe was limited and the developers were eager to begin development as soon as possible. Following is the key questions for rolling out the design:

What should we do first?
Should we design our own chart components from scratch?
How can we ensure the components are viable with minimum resources and time?

Understand

Empathise

Stage 1

What should we do first?

Action

Information Architecture Diagram - Analysed the insight from the user, I designed the Information Architecture Diagram.

Reasoning

Provide the foundation for development team to start to work on dashboard foundation and the Restful APIs
Allows Project Manager to estimate lead time.

Stage 2

Should we develop our own design of chart components from scratch?

Action

Chart Components - Due to the schedule and communication with the developer, we decided to adopt the existing JS library to modify it for more efficient of implementation.
UI Design System - Design the rest of UI Design System, like grid system, navigation, filtering and sorting

Reasoning

Allows frontend developers to work efficiently.
Builds a consistent, reusable and extensible product.

Stage 3

How can we ensure the components are viable with minimum resources and time?

Action

Pilot Run Usability Study - Designed an interactive prototype with Asia-Pacific region to demonstrate the data comparison flow.

Reasoning

By components-based design with openAPI, it can adopt any region team to demonstrate the user story of comparison

Layout and Components

Information Architecture