Industrial and Commercial Bank of China (Asia) Limited
ICBC Smart Funds
In order to optimize product functions and improve user experience, the overall optimization of electronic channels is basically carried out, and the frontline business process, product recommendation and optimization of transaction process interaction are integrated through MorningStar data and back-end capabilities.
To comply with my confidentiality agreement I have omitted and appropriated confidential information. These designs are a reinterpretation of the original.
My Role
I was sole for the designer part in the team and responsible for advising the experience strategy, frontend programming and interface design. I mainly analyzed user scenarios and evaluated the interface elements with the brand identity and design guidelines. I worked alongside frontline user department and software development team.
Screen flow with advising remarks were used to communicate with the users and developers.
The Background
Redesigning another UI style and enriching the functions
The requirement proposal from users mentioned that a new layout and user interface style were planned to devise in the second stage.
The investment research from Schroeders and blackRock showed that there was the rise of the risk investor and the younger generation were willing to get into the marketplace. Futu HK also found that there was 73% individual investors came from 80s and 90s. Thus, the function, operation and interface design should be more simple and up-to-date.
The Discovery
Analysing similar products already existed
To start with the research, I analysed 7 competitive banks about the funds services that providing in their mobile banking.
The findings:
1. Users are able to get inspired by the popular fund choices in the unit trust investment transactions or explore from the list of funds based on the selected preferences.
2. Standard Chartered divides the investors into 4 groups, professional investors, newbies of investment funds, generation X and Y, and golden-agers, which is well-covered service.
3. Global investment market news is provided for users.
Design Requirements
Make it Simple
All of the investors wanted the feature to be simple, efficient and fast. They are less willing to spend extra time to learn and use the feature.
Build a trust
Provide detailed information about each funds, which covers fund overview, portfolio analysis, portfolio breakdown, holdings, risk and ratings from Morningstar Category.
Keep it Competitive
Always improve the user experience and update the user interface with the trend and industry. Avoid running off clients by annoying and complex workflow.
The Discovery
Understanding different type of user requirements
The discovery phase allowed us to ensure project direction, review the existing work, understand our client's vision, and achieve research into user requirements, behaviours and pain‐points.
After identifying persona types, we were able to prioritise what functions we should implement and refine in the application.
The Prototyping & Features
I started designing high fidelity prototypes by creating a style guide for the user interface and determining major screens of the app. We used Adobe Xd for UI design and mockuping.
Screen 01
Landing page composition and sticky bottom navigation
The Features
-
Top Performing Funds
-
High Dividend Paying Funds
Each of the tabs includes three types of funds, equity funds, bond funds and balanced funds.
Screen 02
Allow user to highlight their interested funds for further observation
The Features
-
Bookmark the interested funds
-
Allow editing and sorting in Bookmarks
-
For long-term observation and manage investment portfolio
Screen 03
General Overview and Simple Trading Process
The Features
-
Profit growth chart
-
Past performance
-
Fund information by categories
Screen 04
Overview Personal Portfolio
The Features
-
Overall assets division
-
Track trading history
Screen 05
Investment Information
The Features
-
Provide up-to-date news
-
Add tag function to well organised all the information