PrimeTrust is a banking product that allows users to create custodial accounts - bank accounts that can hold cash, stocks (holdings), as well as crypto currency.
The goal of this project was to create an Android and iOS app for PrimeTrust's banking product.
The team consisted of 4 product designers (including myself) and a PM.
Because the scope of this project was incredibly large, I'm going to specifically highlight our iOS flow for US individual account creation, our navigation and deposit interaction for Android, and our account pages for iOS and Android.
US Individual Account Creation A/B Test (iOS):
PrimeTrust has four main user types (US individual, US Corporation, International Individual, and International Corporation). The US Individual user type was the primary user so my goal was to optimize that flow to have the highest acquisition rate as possible. I needed to figure out how to chunk the information in a way that would lead to the lowest bounce rate. I eventually landed on two main flows to test.
Flow A would split the information we needed to collect from the user into four main buckets: contact info, tax info, identification info, and agreement. The reason for this was to give the user small rewards along the way (completing smaller flows) to keep them from bouncing.
Flow B:Flow B would only have two main buckets - contact information (which would contain contact, tax, and identification information) and signing agreement. This would create a longer first step and would let the user move through the information flows a little quicker, but without rewards along the way to keep the user engaged.
As shown below, it turned out that Flow B had a much higher acquisition rate. The comments that we received during testing were that the four bucket solution "seemed intimidating" and that users "didn't like returning to the same screen to see progress".
After showing the results and insights of the test to our PM, Flow B was approved.
Navigation and IA with Deposit Action (Android):
Our first challenge when entering the Android phase of this project was restructuring our IA and navigation to meet Google's material design guidelines. After doing a round of research, we began sketching out different solutions that fit the guidelines. The reason for this was to find a solution that would fit into patterns that Android users were already familiar with, instead of reinventing the wheel.
After exploring our solutions, we eventually decided on using a bottom navigation with tabs - similar to what we used in our iOS design. The main difference would be our decision to take the deposit action out of the bottom nav, and instead put it as an icon in the top nav. This was a growth-based design decision so that the "deposit" action would be the primary action throughout the app, instead of it being on the same hierarchy as the other actions in the nav bar. We also decided to consolidate the "alerts" section of the app into the "more" tab.
Originally, we were just using an icon for "deposit" in the top right of the nav, as supported by the contextual action bar in material design.
However, after a round of comprehension testing, we found that users didn't completely understand the icon's meaning. After experimenting with numerous different icons, we found that users were most successful when we turned the nondescript icon into a labeled button.
Because we had made the "deposit" action the primary action, we needed to make that interaction the "hook" of the app. The user needed to be able to easily choose which account they wanted to deposit into, and what type of currency they wanted to deposit ("cash, crypto, other" was the specific verbiage our PM gave us to use). After researching other Android interactions, I sketched through a bottom sheet solution.
Once this interaction was approved by our head of design, I took the entire deposit flow to hi-fi.
Then I prototyped the interactions.
Account Pages (iOS and Android):
For our account page for iOS, we knew we would need to use some sort of data-visualization with an expandable design solution to display a user's currency breakdown between "Cash, Crypto, and Holdings (Other)". We also wanted to throw in a "deposit" button as a primary action. My solution involved the use of a donut chart and accordions, which is shown below.
Both our PM and Head of Design liked this solution. It would allow for expansion on both the business and user side. Next I made a lo-fi version to figure out the arrangement of the deposit button with the other actions a user would want to take from the account page (such as viewing statements, transaction history, etc.).
Once all of the nuts and bolts of the account page were in place, I treated it with some love and care and brought it into hi-fi.
Our next challenge was to turn our account page into something that was optimized for material design for Android users. After much research on material design guidelines, and many iterations, we eventually came to a finalized Android account page using material components.
I grew so much as a designer from this project. From learning growth-based design decisions to material design guidelines, this project was incredibly challenging and rewarding. It forced me to dig deep into the major differences in designing for iOS versus designing for Android. More importantly though, it helped me understand navigation and UI components that both operating systems have in common - which will help me in the future as mobile product design seems to be moving toward a hybrid of both iOS and material elements.