Simplii Financial Native App Home Page Redesign and left drawer Menu
re-architecture
Background
Modernizing Simplii Financial's native apps home page and reorganizing the left drawer menu for effortless banking.
TIMELINE
Jan 2023 - Jul 2023
my role
Solo Sr. UX designer
issue
Clients struggled with a cluttered interface with no information hierarchy and a a left drawer menu lacking organization or logic.
Product team initiated the Platform Modernization project, to get aligned with Simplii’s tagline (The Bank of Now). Therefore, enhancing the visual design of the homepage.
Project Goals
- Defining new Typography Styles and Color Roles: Establishing a system token mapping to ensure a cohesive and consistent visual language for developers framework
- Align the homepage and hamburger menu redesign with CIBC’s design standards, considering the shared codebase and collaboration of CIBC developers on the Simplii app.
Before
After
Design Concept
Since the code base are shared between CIBC and Simplii, I had to create a similar redesign for the Simplii homepage. Using their existing UI design framework, I began by incorporating Simplii’s brand colors, icons, logos, and visual assets.
Then, I customized the functionalities—removing those irrelevant to Simplii and adding necessary features to meet specific requirements. During the design phase, I worked closely with the accessibility team, content writer, and developers to ensure a user-friendly product.
The Challenge I faced
I faced limitations in creative ownership, being restricted to follow strictly to CIBC's design concept and style for the Simplii app. This constraint significantly shaped the redesign process.
Simplii has it’s own unique brand, which is point to younger demographics as opposed to CIBC which is a classical financial institution. But in terms of saving money and being efficient with resources, we had to move forward with it.
User testing
1. After the first release, clients expressed a need to see their total account balance, which lead me to the add the total balance component in the UI design. (add component)
2. Additionally, our research team conducted a survey on the security icon, to ensure it’s clear.
A survey on Feedback Loop with 6 questions about 2 icons ran from Oct 31 to Nov 1, 2023. It had 144 participants aged 18-50 who used their banking app within the last 90 days.
UXR Goal
Evaluate effectiveness and clarity of simplii security icon. to ensure users understand what the security icon represents to interact with the app effectively.
Key Findings
- Participants found the clarity of the icons varied, with most interpreting them as related to security.
- Icon 1 was generally perceived as indicating security, while Icon 2 also suggested security but with more uncertainty.
- Participants liked the design and simplicity of the icons but disliked the ambiguity in their meanings.
- The most common suggestion was to add text to both icons to clarify their purpose.
assumptions revisited
- Interpretations of the icons' meanings varied, with Icon 1 more consistently seen as representing security than Icon 2.
- Due to the varied understanding and as a best practice, text labels should be added to enhance comprehension.
results
- Cleaner, more intuitive design with simplified navigation menu increased user engagement and satisfaction by 35%.
- The placement of promotional offers for ghost accounts, spiked conversion rates by 30% for new credit card sign ups.