- Date: 04.2014
- Platform: Web
- My Role: User Research, Persona, Visual Design
Overview
Upgrade the User Interface of a successful flagship web app, designed by engineers, and used by 100s of 1000s of customers.
Objective
Upgrade to Modern UI, Make it more Usable.
Tools
User Interviews, Sketch, Invision Freehand for wireframes, Visual Design.
Steps
Understand the current perception of customers, measure the current state, make a ux strategy and execute it, measure the impact.
UX Process
- The whole project took more than a year.
- First thing we did was measured the NPS (Net Promotor score) which came to be 37.
- Figured what are some the key chanllenges we had, including large scale Enterprise application, multiple technologies, real-time upgrade.
- We started with a set of assumptions, then we created the top list of UI/UX upgrade
- We validated from user in User interviews.
- Then we executed on the list one feature at a time, the results were Upgraded UI, a Design System with reusable design patterns, Personas, and a consistent font icons and style guide.
The first step was creatign a set of assumptions on what are the top things we need to do.
In our annual Mobile First conference, we validated our assumptions with customers. We did a user survey along with multiple User Interviews to understnad the pain point of customers.
One of the things which came out of the User Interviews were 8 different kind of Personas, for the different kind of features we were building.
One big feature which need a UI upgrade was Settings page which was 50 page long and needed a usability and UI uplift. The settings also needed a Search. This feature took couple of months with designer and engineering team. The auto-suggest search was also a big hit. When we showed this to Custoemrss they were delighted.
Even the dashboard needed a UI uplift. We created a design without impacting the functionality.
The new dashboard was much more modern.
We also upgraded the data table and may other pages for UI uplift.
The new data table.
Conclusion
The complete UI upgrade project was big but we did one feature at a time. Having a roadmap with keeping the consistency in mind, we were able to not only upgrade the UI but also create reusable assets, like FontIcons, UX Lab as well as a design pattern library, which became our UX Design System. And the NPS score went up to 59 (from 37)! Woo hoo!