Goals
Modernize outdated user experience
The original UI/UX missed some essential features and was inconsistent, to it hindered affordances and accessibility. Our goal is to build a user-friendly experience with a comprehensive design system.
Before
After
Find Issues
Discover the problems and define objectives
Scrutinize all UI/UX of products and analyze what is not working. Our team also creates a customer journey which includes interactions with different departments. And we collect user feedback to support the decisions.
Investigate UX Issues
Customer Journey
Build Foundation
Build consistent standards and guidelines
Before I joined, we didn't have a design system, so my top priority to redesign the new UI and build a design system simultaneously.
- Foundations — colors, typogrophy and grid system
- Components and layout patterns
- React.js component library
Admin Experience
Clarify the functions and task flows for data management
The original UI lack of clear indications and task flows, so users sometimes feel overwhelmed and lost. We break down the pain points and rebuild the information hierarchy and user interface.
Navigation
Main Navigation
Add blue highlight indicator to mark current section.
Title / Toolbar
Use breadcrumbs to show location and centralize the global functions.
Secondary Navigation
Reorganize and separate the content with clearer side navigation.
List / Table
Search / Toolbar
Put search function for all lists.
Filters
Redesign filters to easier to find results.
Data Rows
Implement sorting, partially section and dropdown menu of each row.
Pagination
Refine pagination with “Go to the page” / “Rows per page” features.
Dashboard / Data Visualization
Collect deals from services and organize them into categories, which are easily navigated.
End User Experience
Keep the experience simple and intuitive
For an app used by a variety of different people every day, our priority is to reduce the unnecessary visual burden and to focus on keeping the task flow as simple as possible.
Portal
Access all the company and personal apps with keyboard-friendly controls.
Portal Mobile App
The mobile portal which is redesigned for an "on-the-go" experience.
Protect
An authentication app is designed for extra security and a clean notification system.
