FLIT Invest
Mobile App Design for Investing Portfolio
Management
I collaborated with five designers and interns to develop mobile prototypes for FLIT’s in-app experiences, aiming to assist users in managing their customized investing portfolios and promote financial literacy.
My Team
3 UI/UX Designers,
3 UI/UX Design Interns
My Role
UI/UX Design Intern
Timeframe
12 Weeks (2022)


Introduction
What is FLIT Invest?
FLIT Invest - FLIT - is a digital sustainable investing application designed to grow people’s wealth while making a positive impact. It curates a customized portfolio that matches people’s financial goals and causes of interest. Its automated impact investing platform is dedicated to making a smooth, easy, and rewarding investment experience for its users.
What is sustainable investing?
Sustainable investing is about investment that takes environmental, social, and governance (ESG) criteria into consideration. Three sub-categories of sustainable investing include:
-
Socially Responsible Investing (SRI) - Avoid harmful investments (e.g., Fossil fuels)
-
ESG Investing - Environmental, social and governance related investment
-
Impact Investing - Investment that brings positive social and environmental impact
Project Overview
Our guiding problem
How can we make it easy and simple for our users to track critical statistics and metrics (e.g., investment values, impact metrics) in their investment portfolio?
Through our user research, we found out that many individuals are foreign to the concept of sustainable investing. Given that most of our target users are also new to investment, our challenge was to find an optimal way to display informative data. At the same time, we try to minimize our users' potential cognitive burden and mental load.
Who are FLIT targeting?
FLIT Invest’s target users are college students (Gen Z) and millennials (Gen Y) passionate about social impact and sustainability while having the desire to begin their investment journey.


Credit to FLIT’s amazing UX Researcher, Nick Reedy, who provided us immense insights into our users with those personas.
Objectives
Demonstrate investment should not be complex
Show credibility as a new application
Create an intuitive and engaging platform that provides transparent and informative statistics
Make sustainable investment at FLIT an easy and rewarding journey
Promote financial literacy
The In-app Experience
What are some main sections of FLIT's app?
Portfolio
It displays users' investment values and exclusions selected during the sign-up flow. Users can manage those values on this page.
It allows users to make money transfers within the application. Users can also access their transaction history through
this page.
Transfer
It showcases users’ social and environmental impact generated through their investment choice.
Impact
My role & contribution to this project
Responsible for designing the Impact section and its relevant subpages
Consolidated the user flow between the Impact page and other pages in the application
Generated the information architecture of various collections of statistics and metrics
Managed FLIT's design system by creating components, assets, and organizing the component library
Critiqued and brainstormed with the design team to refine other sections of the application
Selected High-fidelity Prototypes Overview
or jump to A Detailed Walk-through
Environmental and social impact metrics
One feature that makes FLIT stand out among other investment applications is that it provides environmental and social impact metrics to inform users of their investment impact. Those impact metrics measure how users’ portfolios contribute to environmental and social causes. FLIT keeps track of 7 impact metrics:







Impact - Investment detail page
The investment detail page provides users a comprehensive view of their impact on one of the seven specific investment impact metrics. It uses measurable statistics to make it easier for users to understand their impact.
I was in charge of redesigning the investment detail screen. My goal was to make the screen more intuitive, engaging, and aesthetically appealing.


Redesign overview




Performance & impact
The final design was well-received among the team and was submitted to the developers for development. The design team will use the layout design and information architecture of this investment detail screen across all seven impact metrics of the FLIT application.
A Walk-through from Low-fi to Hi-fi
or back to Hi-fi Prototype Overview
What are we trying to achieve?
The goal is to display critical statistics and metrics simply and intuitively for our users. For every page, I want users to have easy access to different pages of the applications as they navigate and explore individual screens.
Brainstorm & sketches
I found sketching to be a simple and efficient approach to brainstorming different design iterations. It is also helpful for me and others to visualize my ideas on paper for future iterations and critiques.
My goal in doing sketches is to try out different ideas and layouts for the SDG statistics and figure out the most plausible information architecture.



I further iterate on my ideas through wire-framing. Wire-framing helps me refine my sketches and serves as the transition toward high-fi prototypes. I can better sense sizing relationships, ratios, and overall impressions.
I presented my wire-frames to my teams and managers and improved my designs based on their feedback.

Low-fi wire-framing
High-fidelity prototype example - SDG screen
Default
Selected
Pop-up



The SDG detail screen consists of two main sections:
-
Details of SDG and access to the SDG website
-
The contribution percentages of that SDG to users’ top three investment values, from highest to lowest
Throughout iterations, our goal is to ensure we minimize the amount of information we show to our users without leaving them in confusion. We emphasized the SDG first, and its connection to users’ sustainable impact follows.
User flow & future iterations
We as a team mapped out user flow for the screen to better understand the information hierarchy and users’ navigation scenarios. We constantly refer to this flow during iteration to ensure our understanding and make potential updates and adjustments when needed.

Impacts & reflections
Compared to the original prototype designs, the newly designed prototypes received 100% positive feedback from users in our user research. They were also endorsed by our internal teams and would be the final mockup that 3000+ waitlist users would use within FLIT’s mobile application.
​
One of the biggest challenges of this project was determining the best strategy to leverage the amount of technical information in the design. After thoroughly analyzing our user research and feedback, we minimized technical jargon in our explanations and generated measurable real-life examples to help users understand their investment metrics. I learned and practiced balancing user needs and business goals in my prototype design process. Additionally, I understood that maintaining consistent and transparent communication among business teams and stakeholders is key to the success of a project.