AppX is a B2C digital identity wallet. Part of a broader suite of digital identity products, AppX allows consumers to consolidated their personal information into one reusable credential, giving them full control and ownership of who they are online.
Product has been renamed to comply with an active NDA, but the outcomes and my passion for creating human-centered experiences are both very real.
Product: B2C digital identity wallet
Objective: UX/UI overhaul of an MVP
Key discoveries and takeaways:
- 62% of users preferred a longer onboarding experience because it helped them build trust
- 61% of users opted to skip reading terms and conditions, but 83% stated they would read them if the presentation was changed
- 50% of all users tested chose biometrics over passcodes as their primary method of authentication
- Older users (50+) had low risk tolerance for failure, while younger users (18-34) had very high risk tolerance and were willing to accept failure as part of learning
- Users have pre-conceived expectations for what an onboarding flow should look like – if you want to deviate, do it with a clearly defined purpose
- The more transparent an experience is about the why, the greater the trust with their users and the more willing they are to comply
The before:
The after:
UX Audit
Low-hanging fruit
Our first task was to review the product MVP and document opportunities for improvement across the user experience, the interface, copywriting and messaging, and brand implementation.
Identified areas for improvement:
- An unnecessary user profile that did nothing but allow people to optionally add their name, phone number, and upload a photo
- Onboarding hurdles, such as asking users to set up a PIN code, even thought it was not necessary for authentication into the app
- Overly-technical language that end user could not understand, such as “Self Sovereign Identity”
- Redundant messaging throughout the experience, resulting in unnecessary modals, buttons, and screens with high cognitive load
- UI elements that were not complying with user mental models, such as icons that looked like radio selectors and QR scan targets that were impossible to hit
- Improper canvas movements and functions paired with confusing labels such as “back”, “exit”, and “close”
Above is an exploration map of how credentials in the wallet could be categorized. Since many credentials had overlapping attributes, it was possible that a credential could live in more than one category.
User Journeys
Who’s this for?
In order for the team to truly understand the purpose of AppX, we needed to take a step back and understand who would be using it.
At a high level, we identified two journeys:
Introduced – Users who were seeking to complete a specific task and they were introduced to AppX as a faster and safer solution, possibly mid-way through said task. They may have been initially unaware of AppX and were open to trying it out.
Discovered – Users who desired safer and more secure products than what they’re already using and who actively seek out and try new offerings. They were early adopters who love sharing their findings with others and weren’t afraid to take risks.
Identifying these users proved to be incredibly valuable as we were able to produce journeys for each that outlined the various phases and touch points they had, resulting in us discovering a variety of pain points and opportunities. It also helped us identify the most important phase(s) within each journey – information we would use to focus our efforts and give us a starting point for producing solutions.
User Flows
Get in the flow
With our journeys in place, we then mapped out user flows so that we could see all of the decision-making points that each user would be required to navigate. For our introduced user, it was important that we focused on their time-to-value. As opposed to our discovered user, where a more delightful and intentional experience was desired.
One of my favourite aspects of building out user flows is that they very quickly uncover feature bloat within a product – all of the unnecessary steps and decisions that have the potential to slow users down or distract them from the task completely. By identifying these bumps and resolving them, we were able to slim down the flows considerably, creating a cleaner and more intuitive user experience.
Although we better understood the time to value offering, that didn’t mean the paths were correct. We were still making assumptions at this point and our solutions needed to be put in front of real people. It was time to perform some tests.
Research & User Testing
Research
With our journeys and user flows in place, we conducted a competitive analysis to see what competing products were offering in terms of experiences and UI solutions. What we discovered in our analysis excited us: they were displaying the same issues we had identified in our UX audit.
What this meant was that we were in a position to step ahead of the competition and put a product in market that offered a better, more accessible user experience.
User Testing
During our evaluation, one of the flows we identified as wanting to test against was onboarding. We ended up creating three tests that helped inform our decision-making so that we could rework our new user onboarding experience. Within each test, we devised questions that would help us better understand the following:
Expectations – What elements of an onboarding experience are users already familiar with, what are they looking for, and what assumptions are they making?
Emotions – How do users feel about onboarding to a new app? Do they understand each step? Are they building trust with us along the way?
Effectiveness– Are we effectively communicating the purpose of each step and ensuring that users see value from start to finish?
Below is a summary of the three onboarding tests we conducted.
Length of the experience
Evaluate the length of the onboarding experience to determine whether various stages were put into question by users.
When testing a longer experience, we gave the users preference options such as selecting their own method of authentication or offering personal information such as name and phone number, compared to setting default selections and not asking for personal information.
Results
Shorter isn’t always better. 61.9% of users preferred the longer experience that presented them with preference options because it helped them build trust.
There was an even split between authentication choices across all age groups (50% Face ID, 50% Passcode).
Highly visible buttons and CTAs resulted in users missing additional content, such as slides within a carousel.
When presented with the Terms of Use, users liked having the option to skip – it gave them a sense of power and control over what to do next.
No users questioned being asked for personal information, stating that is commonplace.
Takeaways
Expectation vs Reality – Users have assumptions about onboarding flows based on past experiences, so when we deviate from that expectation, we need to be explicit about why.
Data sharing – Many users have come to expect that an application will ask for personal information up front (name, email address, phone number) and are not concerned with sharing it. But the request must still be intentional and have purpose.
Human-centered design – Users desire constant affirmation that the process is going smoothly, so we need to make sure we’re including appropriate messaging that supports tasks and actions.
“I like when I’m given options, like Face ID vs Passcode. It makes me feel like you have my interests at heart and are not just looking out for yourself – you’re looking out for the customer.”–Female, 46
Steps and actions
Evaluate how users interacted with and felt about our desired onboarding experience.
Using results from the first test, we created the second which sought to identify further pain points and improvements. We also tested our users’ knowledge of the industry in which Appx was targeted.
Results
When viewing the welcome carousel, 62% of users did not know what a digital credential was.
77.8% of subjects confirmed that they read welcome screen messaging while 22.2% stated that if presented with the option to, they will skip.
When asked how they felt about using an app that required biometric security instead of a username and password, a majority leaned towards the more positive end of comfort.
People assume that the Terms & Conditions are the same across all apps.
Takeaways
Less is more – We need to ensure that each screen has just the right amount of direction and that cognitive loads are kept relatively small. Young users move quickly and are willing to fail, so we need to support them with the appropriate UX.
Education is key – SSID and biometrics are still quite new for a lot of people. Many users questioned the lack of 2FA and missed the digital identity messaging early on. There is an opportunity for us to build trust and meaningful relationships with our users through transparent communication.
Honest communication – There is an assumption that a digital wallet is meant for finance/crypto, so we need to make sure we’re clearly communicating the purpose and value of our wallet – digital identity now, everything else later.
“I believe this is pretty standard for something like a digital wallet and I feel more comfortable using an app that requires it [biometrics].”—Male, 26
Legal terms presentations
Evaluate users’ interpretations, thoughts, and feelings towards multiple presentation styles of the terms of use.
One of the biggest pain points that came out of test 2 was the terms and conditions section, so for our third test, we wanted to determine the best approach to present the mobile app agreement. The three presentation styles were Full, Progressive, and Doorway.
Results
61% of users opted to skip the terms in the Full presentation.
44.4% of users felt unhappy about the Full presentation style.
83.3% of users said ‘Yes, I would read it” when shown the Progressive presentation, with 94% of all users stating that this was their preferred experience.
Nearly 90% of all users said they would opt to skip the terms in the Doorway presentation and additionally, 50% of all users felt that this presentation style was “untrustworthy” and “suspicious”.
It was apparent that older users (50-65+) required more intuitive UI, while younger users (18-34) had no trouble navigating a broader range of UI.
Overall complexity of an experience is of no concern to users who are receiving value along the way.
Takeaways
Transparency builds trust – There is a strong desire for companies to better communicate with users how their relationship with an app will be monetized. Presenting terms and agreements in an accessible way is one step towards creating and delivering value.
Accessible design creates transparency – Small fonts and large, run-on paragraphs create an immediate lack of trust and suspicion. Putting more effort into translation and presentation will give users more comfort in the relationship.
Effort where it matters – Putting effort into building positive relationships with our users will go a long way. They’re smart and can tell when we’re cutting corners and there is a lack of effort. We have an opportunity to differentiate ourselves through these efforts.
“I have more trust towards apps that show me all of the terms and allow me the option to skip. Put the power into my hands to make those decisions – don’t make them for me.”—Male, 39
To our surprise, we discovered that while onboarding experiences are expected by users, many interpret them as necessary hurdles, which meant that they were not always happy about it. With that outcome, we had an opportunity to build trust and value early by simply adjusting the experience to either eliminate or help resolve those hurdles that many users have trained themselves to robotically endure.
Design Systems & Accessibility
Speak my language
AppX had a brand and the MVP was, for the most part, somewhat showcasing that brand. However, the UI was not scalable and there was no component foundation to build on. It also had no tone of voice and was very technical with its language and messaging.
Since we wanted to have a system that supported an idea through all stages of our innovation funnel, we developed a standard design framework that could be used for AppX, but also for our POCs, prototypes, and idea generation. That way when our next product idea makes it all the way to MVP, we could then simply layer on a branded theme to the new existing system.
With AppX being the first candidate for a product theme, we built out brand styles and extrapolated the base design system to ensure we had all elements covered that would be present in the experience.
Below are lifecycle examples of the credential detail screen.
AppX utilizes biometrics as the primary method of user authentication and although we solved for the initial new user setup, we also needed to solve for all other scenarios that someone could presumably be presented with at some point in their relationship with the product, such as:
- If the user has already set up biometrics and later changes them, how do they authenticate?
- If a user removes a biometric profile or changes devices, is there a fallback method?
- If the users fails their biometrics a set number of times, what happens?
In addition to building out components that supported the various contextual states of the product, we also defined both a light and dark colour palette using the Material Design surface overlay methodology. The methodology, which seeks to “reduce the luminance emitted by device screens, while still meeting minimum colour contrast ratios” allowed us to implement a modern and accessible UI structure that we could customize. We also made sure that every colour combination met WCAG 2.1 Level A and Level AA success criteria.
Then there was the iconography, an output that many designers love to create from scratch. For this project, it was important for us to ensure our icon family was scaleable and easy to implement, so we opted to utilize the Material Design font library due to it’s robustness and scaleability. It was a work smarter, not harder decision that saved us a lot of time.
Product Launch
When our engineers achieved 60% build completion, the business underwent a major shift in priority and ultimately, the AppX overhaul project was put on indefinite hold.
Its never easy as a designer to see our hard work shelved. We all want to see it in the hands of the people we’ve been designing for. But that outcome is never guaranteed. For me, I’ve learned to love the process and understand that it’s the relationships we build, the knowledge we absorb, and the small wins and achievements we acknowledge that have the most impact. It’s what carries us forward and makes us better designers, better leaders.
All designs outlined above are the exclusive intellectual property of ATB Financial and may not be saved, copied, shared, or reproduced in any form.
