
Super-advisor
Project Period
January - May 2022
Role
UI/UX Designer
Performance
-
Research & Ideation
-
Sitemap
-
Paper Wireframe
-
Lo-fi & Hi-fi Prototype
-
Takeaway
Mission
I was asked to create the market data and match the client list analytic tool. This tool can potentially benefit investment advisors who need to manage their clients and analyse market data and portfolios.
Challenge
Even though there are some wealth management platforms in overseas countries, such as Addepar, Purpose and FINCAD, the media needs to be localised to meet the demands of clients primarily in Hong Kong.
Goal
Ideating and designing the new dashboard visualised the market data and table of matched client lists and admin function.

Design Process
-
UI/UX industry Research: Table and data visualisation
-
Research on web based fund analytic programs
-
Problem statement
-
Sitemap
-
Paper wireframe
-
Low-fidelity prototype
01
Discover
02
Define
-
Final Design
-
Take-away
-
Ket solutions
-
High-fidelity prototype
03
Develop
04
Deliver
Industry Research
We focused on researching the table design and dashboard and visualising the data more effectively so that users could understand the information easily and quickly.




Problem Statement
Time-consuming to select the signal types and filter.
Complex market data and matched client list.
The heavy data to display in the limited table space.
Sitemap

Paper & Digital Wireframe






Low-fidelity Prototype
As the initial design phase continued, we made sure to base screen designs on feedback from the problem statement and findings from the industry research.




High-fidelity Prototype
We allocated the navigation bar on the left side of the screen that can be foldable and developed a new design system with high contrast with colours. We transferred the list of filter types into the hidden box that helps users access the filter type when needed.
Before

After

We changed the signal type selection to a scrollable carousel with a bigger size than other charts because the users and investment advisors found that selecting the signal type on this page is the most crucial. A scrollable carousel helps them to establish more accessibility.
Before

After

High-fidelity Prototpe: User Flow
We made the user flow a similar feature to an actual product that can be useful for the pre-sale purpose to clients. However, the number of pages was too many, and it had some risks when we delivered these big pages to engineers, so we tried to reduce the number of pages and reconnect the flow.


Final Design




Design System

Take-away
Impact
Super-advisor demo can help investment advisors manage their clients more efficiently and provide practical and customised service with this data aggregated and analytic tool.
What I learned
I learned how to build a web-based demo from scratch based on the needs of target users. The agile design process gave me the confidence to understand UI design and advance my Figma skills thoroughly.