Home Icon

Finance Made Easy. From Research Insights To Elegant UI

A native mobile app to make finding financial advice easy and accessible for millennials. This project was part of my CareerFoundry boot camp and helped develop my UX/UI and Researcher skills.

Role:

My Team:

Stakeholder

Project Scale:

Tools used:


Product Designer - research | design | copywriting

Just me!

SET (CareerFoundry)

January 2022 - July 2022

Figma, Miro, Optimal Sort, Lucid chart, Loom, UsabilityHub, Zoom

The Backstory

As part of the CareerFoundry bootcamp I was tasked with researching and designing an app that enabled anyone, anywhere to instantly chat with an expert.


The app would be free to use, but would require payment for any video calls done over the platform. This was a very vague brief but allowed me the chance to focus on trying to fix a problem myself and many of my friends struggled with...

Financial

Frustration!

Millennials (like myself and my friends) frequently become frustrated when trying to get financial advice on topics ranging from mortgages to investing to retirement.

3 key issues are...

Quality Guarantee Icon

quality & quantity

They’re overloaded with non-specific, non-verified information from social media, online articles and friends and family.


73% of adults aged 18 - 30 turn to family and friends for financial advice while 30% get advice from Reddit, TikTok, Instagram and Facebook.

[1]

Access Granted Lock

Accessibility

They’re not wealthy enough for financial advisors to want to work with them, meaning they simply can’t access the quality advice they need.


In 2017 a study by Schroders, an asset management company, found that 50% of IFS’s (Independent financial advisors) turned away clients with less than £50,000 to invest.

Human

Human Touch

They’re the focus of ‘Robo-Advisors’ which lack the 'human touch'. Something that millennials still desire when discussing financial matters.


A study conducted in 2019 by Legg Mason found that 61% of 18-24s and 69% of 25-34s said the human touch can never be replaced by a machine.

Problem

Statement

Quote Box Frame Quotation Bubble Line Illustration

A Millennial looking for financial advice needs a way to speak with a certified financial expert, in an affordable and personable way, because they need specific advice about investing their money, and find forums and blogs confusing and unhelpful.


We will know this to be true when we see users connecting with experts and following the given financial advice. This will be measured via user reviews and feedback.


`

SWOT Analysis

I conducted a SWOT analysis of the largest and closest competitor currently on the market, Unbiased and Vouchedfor. The full analysis can be viewed here and the analysis for Unbiased detailed below.

Strengths

  • Age, size & market presence
  • Directory search is very user friendly, can filter and view results on a map
  • If using the matched service, response in minutes (if enquiry deemed valuable)
  • Advisors are given a response rating out of 10
  • All advisors are FCA regulated and must offer unbiased advice
  • SEO strategy and blog
  • Recent investment, allows them to spend heavily on advertising and marketing

Weaknesses

  • Consumers can't see fees
  • Directory service is hard to find on site
  • Not a transparent business model - results are driven by how much advisors pay
  • Lack of customer reviews
  • Strong focus on geographical matching, not so relevant these days
  • Quantity over quality
  • Contact details passed onto the 'matched advisor' without the consumer approving the match first


Opportunities

  • A transparent business model that isn't driven by how much the advisors pay
  • More trust - give the consumers 2-3 matches to choose from and include user reviews
  • A mobile app version
  • in-app video/voice calling feature so consumer isn't hounded by their 'match'
  • Less business development and more customer service


Threats

  • Threats
  • Robo-advisors such as Nutmeg & eToro - who are making financial advice and investing accessible for customers deemed 'low value' by Unbiased
  • Vouchedfor which is a similar service, however advisors display their fees and their profiles feature user reviews
  • Money Saving Expert offers a degree of the 'human touch' with Martin Lewis being a reputable and trusted name with UK consumers, however this is a non responsive website.


Generating

Ideas...

Consolidating all the strengths and opportunities I’d uncovered during the analysis I was able to compile a list of ideas for SET

Decorative Washi Tape
Paper with Ripped Edge

video/voice calling/messaging tool

Blog articles written by highest rated Advisors

Video focused content

Searchable database of advisors

Geographical search of advisors

Expertise search of advisors

Response speed search of advisors

User profile/account

Tailored content for users needs

Verified user reviews

Verified advisors

In app booking tool

Payment option - fees or subscription

Flexible booking platform

Advisor profiles - fees, experience & rev

Favourite (articles, advisors)

Upload documents tool

App suggests, users chooses


User Survey

I conducted a user survey to try to answer these research goals:

1) Learn more about the demographic of people who will, or already do seek paid financial advice, and hence fine tune my target audience


2) Better understand the user's mindset towards seeking financial advice


3) Learn more about the user's habits regarding technology and feelings about combining technology and finance

User Profile Picture

28 Participants

calendar outline icon

February 2022

Software Development Icon

Google Forms

Check Marks - Green Tick Icon Simple - Vector

Initial problem

statement verifified

Red Flag Pin

Potential issue for the project. Use interviews to dig deeper.

User Interviews

With 4 potential users were conducted to delve deeper into the problem space, in particular the red flag insights uncovered from the survey. The following research goals were set:


1) Gain a deeper understanding of how much the target audience know about financial advice and how accessible they think it is for their demographic.


2) Learn about experiences users had accessing expert advice, financial or otherwise. What barriers they faced, what frustrations they experienced and what was positive?


3) Learn about users experiences with financial apps and websites, or lack of and why. Learn about users experiences booking appointments and video calling via apps and websites.


4) Consumer habits when it comes to purchasing products and services. How relevant are reviews and what factors are important to them.

“ Too many people pay for 5 star reviews. I like to read the one star reviews! "

Gender


Age


Lives


Profession


Interview


Male


31


London


IT project lead


Face to face

“ I don't know much about financial advice because I haven't ever had much of a need for it "

Gender


Age


Lives


Profession


Interview


Female


31


Greater Manchester


Teacher


Phone call

“" We probably wouldn't look outside our city for an expert. Our lives are concentrated in this city “

Gender


Age


Lives


Profession


Interview


Female


36


Newcastle


Policy officer


Video call

“I used an app to find a mortgage broker and ended up about 10 calling me which was annoying"

Gender


Age


Lives


Profession


Interview


Male


29


Manchester


Train Engineer


Video call

The interview data was organised and analysed using affinity mapping in order to identify trends and patterns. I started by grouping my data with a focus on users general behaviours, feelings, needs and goals.

Likes

Attitudes/Feelings

Behaviour

Frustrations/Dislikes

Needs/Goals

I then compiled a list of key insights/user issues uncovered and generated a list of potential solutions

Insights Uncovered

Proposed Solutions

The majority of users favoured face to face or video calls as these established trust, however those that didn't like meeting face to face felt very strongly about it and preferred phone calls

A range of communication options are needed, not just video calling

Speed of communication and keeping user in the loop are important.

Include a tracking/notification function to track status of their enquiry

Price not such a driving factor if robust solutions or value added can be demonstrated

Free short consultation or appointment - Try before you buy

Users wouldn't pay for the most expensive or the cheapest expert

Offering a fixed price across all experts could solve this problem

Users that live rural or in small cities prefer to keep things local

Include an option to filter advisors geographically

The functions users like in zoom aren't needed for 1-1 meetings

Functionality of the video calling feature should be kept simple

There's a nervousness and lack of clarity around 'Robo-Advisors', users fear they're making financial advice TOO accessible but it's non-specific and could create worse financial problems

Providing simple yet informative, free information users can educate themselves on topics and risks before speaking with an Advisor

Users favour referrals and recommendations over customer reviews

Include a referral/recommendation feature

Users prefer to pay a fixed fee and subscription services cause friction

A clear payment structure is important

User

Personas

From the affinity mapping I was able to identify certain characteristics and traits within the groupings, which enabled me to create my personas.


The key insights from the affinity mapping became Dan and Liv's goals and needs.

Black Man

Dan

Primary persona

Child painting with mum

Liv

Secondary persona

Black Man

32

London

Recruiter




Dan

The busy city slicker


Dan moved to London from Auckland 4 years ago, works as a Recruiter. He earns a good salary and has until recently stuck to the mantra of 'living in the moment', spending his money on experiences and having a good time rather than saving.


Time is money, and Dan hates waiting and being strung along, which happens all too often as a Recruiter! His work days are varied, but always include a lot of talking to clients and candidates, either in person, via video calls or on the phone, which is a great as Dan's an extrovert and loves people and social situations.


Dan's moving back to New Zealand next year and needs financial advice across a range of topics including investing, saving and pensions. His friends and family can't recommend anyone, so he's turning to technology to find the help he needs.

Calendar Days

A way to see the proposed solution before paying


Easy and quick to navigate app that requires minimal information to book an appointment


To communicate face to face to establish trust


To be able to view an Advisors credentials and experience


Appointment reminders and to be kept in the loop


Short term financial help

Gym

Commuting by bus

Business Meetings

Phone calls

Browsing LinkedIn

Socialising after work

Every day activities

Aim at Target

Needs and Likes

Applicant

A bit about Dan...

Wants to understand about moving pensions from the UK to New Zealand


Wants a financial plan that helps him save yet enables him to still have fun in London and Europe


Wants to invest and grow his savings so when he moves back to New Zealand he can put down a deposit on a house



Peace hand sign

Websites that allow companies to pay for 5 star reviews


Apps and websites that sneakily sign you up to a subscription and make it hard to cancel


Robo-Advisor apps making it easy to invest, but taking away the need for any kind of knowledge, resulting in people making quick and uneducated decisions


When experts are slow and don't keep him in the loop

Goals & Motivations

Worried Person

Frustrations

Most commonly used social media apps

Quote Box Frame

"I want to start saving and investing, so when I move back to New Zealand I have enough to put a deposit down on a house"

"If an app isn't easy and quick to use I'll find a competitor one that is"

Desktop

Mobile

Social Media

Tech know how

#aussieinlondon

#cityslicker

#workhardplayhard

#extrovert

#alwaysonthego

#chatty

#loosesinterestfast

#impatient

#spontaneous

#distrusting

LinkedIn
Twitter Logo
Instagram Official Social Media Logo
Child painting with mum


Liv

The multi-tasking mum


37

St Ives, Cornwall

Mum & part time Copywriter



Liv lives in Cornwall with her husband, 2 kids and their pet dog Lola. They own their 3 bedroom house through a mortgage and have a joint income of £55,000 per year.


Liv is sensible, methodical and likes to know all the facts before making a decision. She's big on saving, reducing household waste and is active in the local community. She has a fear of phones and isn't a fan of social media, so catching up with people in person is her favourite way to connect- like they did in the old days!


She uses a banking app regularly and MoneySuperMarket.com is her first stop when she has a financial question. She's previously used a Financial Advisor that was recommended to her by a friend, but he has recently retired.


Calendar Days

Experts to be vetted and regularly audited


Quantity of quality reviews


To be in control and make the final decision


Transparency, accuracy and clarity


Long term financial help


6am yoga/'me time'

Looking after the kids

Household chores and admin

Copywriting 3 hours a day

Volunteering

Every day activities

Aim at Target

Needs and Likes

Applicant

A bit about Liv...

Will be remortgaging soon and wants to find the best deal possible


Relationship and community focused. Likes to support local businesses


Previous Financial Advisor has retired so she needs a new one


Peace hand sign

Phone calls


When products/services are advertised but aren't actually available


When you think you've booked an appointment but don't receive a confirmation


Lack of quality control/auditing of products & services

Goals & Motivations

Worried Person

Frustrations

Quote Box Frame

"Relationships are important and having a personal relationship with your Financial Advisor makes a big difference"

"It's my job to make sure everything is accurate and clear. I want the same from my Financial Advisor"

Desktop

Mobile

Social Media

Tech know how

#mumlife

#jugglingact

#communityfocused

#factchecker

#methodical

#oldfashioned

#fearofphones

#calm

#relationships

#assertive

Most commonly used social media apps

Facebook Logo Vector
Pinterest

User

Journeys

I was able to envision how Dan and Liv would use 'SET' for certain scenarios, and what feelings and emotions they would encounter when carrying out tasks.


These tasks were tracked with user journey maps, and enabled me to see new frustrations and pain points I hadn't previously thought of, which created new opportunities that would eliminate or reduce these frustrations.

Black Man
Letter Icon
Aim at Target

Needs and Goals

Scenario

Minimal information needed to book an appointment


Appointment reminders and to be kept in the loop


A way to see the solution before paying


A quick answer

Dan is moving back to New Zealand next month and wants to understand if he can transfer his pension from the UK, and if so how to do it. He's found an Advisor on SET that based on a user review looks like they've assisted with this before, but he's not 100% sure. He wants to book a call asap, but also ensure they're able to help. He doesn't like wasting his time and likes to see the proposed solution before paying money.

Phase

Task

Thoughts

Feelings

Check the Advisors availability

Book and pay for a call

Confirmation and reminder

  • Opens his chosen Advisors profile
  • Selects the 'book a call' feature
  • Reads about how the call feature works
  • Views Advisors calendar
  • Selects a date and time that works for him
  • Chooses the length of the call needed
  • Submits a brief description of his requirement
  • If Dan hasn't already set up an account/profile he's prompted to - using Google, Apple etc...
  • Given payment method options
  • Would you like the call to be added to your calendar once accepted Y/N
  • Would you like to be sent a reminder an hour before your call? Y/N
  • Email/notification sent when call accepted


Speech Bubble Vector

I like apps that don't collect too much information straight away, not because of privacy but purely effort.

Speech Bubble Vector

I like to see the proposed solution before paying so I can see the value of the expert advice.

Speech Bubble Vector

I lIke a confirmation email once my appointment has been booked and to be kept in the loop with any changes.

beaming face with smiling eyes
slightly smiling face
slightly smiling face
neutral face
neutral face
slightly frowning face

Satisfied - He receives a notification confirming his chosen Advisor is able to assist with his enquiry and the call is locked in


Dan

The busy city slicker


32

London

Recruiter



tired face

Happy - he has control when choosing a suitable appointment time

Reassured - He won't miss the call because he's requested the calendar add and a reminder

Indifferent - bored of onboarding screens but knows it's important to understand the feature

Appeased - If the Advisor can't help, he gets his money back

Deflated - Always feels a little deflated when paying money

Frustrated - he wants to see the solution before paying money

  • Keyword search feature
  • Most commonly asked questions section regarding specific topics
  • No need to create an account to access the database and research Advisors, guest access option
  • Search/filter by availability and response time
  • Submitting an overview of his requirement when booking a call will help an advisor know in advance if they can help. If they can, they accept the call and the fee is paid, If not the fee is reimbursed.
  • If a profile has already been set up, the data fields should be automatically populated when booking a call or implement the autofill feature
  • Option to change preferences in profile/account admin page
  • Sync app with calendar automatically
  • Feature to manage booked calls - change dates/times once booked

Opps

User Flows

User flows enabled me to see which pages of the application our personas would interact with when carrying out specific tasks.


Dan is impatient and doesn't like entering information upfront, so would access the app as a guest, skip the onboarding process and take the quickest route possible.


Liv, on the other hand, wants to know as much about the application as possible. Upon opening the app she would sign up to create an account and would venture down the path that takes her via the FAQ page before anything else.

Child painting with mum


Liv

The multi-tasking mum


37

St Ives, Cornwall

Mum & part time Copywriter



Key

Sitemap

Development

Site, Map, Architecture, Hierarchy Icon

Initial sitemap

I crafted a site map, incorporating features from the initial brief and insights gained from competitive analysis, user surveys, and interviews.

Card Sorting

Card sort

I conducted a closed card sort using OptimalSort to validate my initial sitemap's categories and card labels. Testers from the UK, America, and Germany participated in 10 card sorts, where they organized 20 cards into 6 predetermined categories. The results informed adjustments to my site map.

reload icon

Revised sitemap

Analysing the card sorting results revealed overall success. Testers correctly categorised most cards within the predefined categories, requiring only minor adjustments, with no major redesigns necessary.

Card Sort Analysis

Connect with a Financial Advisor

This was the most positive grouping, with only one card being added to this category that shouldn't have been,


Homepage

No cards should be in this category, I added it for user insight. 13 out of 20 cards were added, but 60% of users expected to find search results here for "financial advisor." This confusion was caused by poorly named cards.


'SET' aims to simplify accessing financial information, so having multiple paths to the same destination can create confusion, as seen in the search results. We may consider testing a search feature in future prototypes. Additionally, 'Take our quiz to find a financial advisor' was added by 30% of testers to the homepage, and we'll explore adding an entry point for it.


Terminology to change

Save for later = Add advisor to favourites

Search Results = Financial advisor search results

Leave a Review = Leave a review for a financial advisor

Revised Site Map

Brushstroke Arrow Smooth Curve Down Long

Entry point for take our quiz on homepage

Rounded Rectangle Icon

Historical calls moved

to profile section

and payment method tab added. 'Calls' changed to 'upcoming calls'

Square Line Frame
Brushstroke Arrow Smooth Curve Down Long
Square Line Frame
Square Line Frame

Terminology changed

Square Line Frame
Brushstroke Arrow Smooth Curve Down Long

Wireframes & Prototyping

By now I understood who my users were, what features SET needed to make it useful to them and how the product would fit together. It was time to start sketching iwireframes for the initial brief and the additional features I needed, keeping in mind the following:

Mobile Menu Line Icon

Navigation

Which navigation patterns will best be suited for SET to help guide the user through the app?

White Heart Vector

Design

Which commonly recognised design patterns will be used in SET to help create a smooth and seamless user experience?

Airplane Check In Process

onboarding

Which onboarding patterns will be utilised to create an informative yet enjoyable learning experience for the users?

Avatar Icon

user stories

Add some context to your wireframes by creating user journeys from your user stories

Initial Brief

  • An onboarding page & a way to sign up and log in
  • A home screen or dashboard where users can access their information
  • A menu that allows users to navigate the application
  • A way to browse experts and pose a question to them
  • A way of paying for an expert’s time

Low-fidelity Wireframes

When the navigation, design and onboarding patterns had been developed, it was time to add some context in the form of user stories. I created low fidelity sketched wireframes and prototypes for both mobile and desktop versions for the following user stories.


  • Intro and Onboarding
  • Search for a financial advisor
  • Book a call
  • Make a payment

User path

Alternative path

One Finger Swipe

User interaction

Mid-fidelity Wireframes

Once I had a low fidelity prototype that I was happy with, it was time to move into the digital phase of the design and start creating mid fidelity wireframes and prototypes using Figma.


At this stage I wasn't looking to create a clickable prototype, it was more about learning how to use the software and ensure the navigation worked and there were no dead ends. I kept things in grey scale and used lorem ipsum as a text holder.

User path

Alternative path

One Finger Swipe

User interaction

Mid-fidelity Prototype

Once I was happy with my mid-fidelity wireframes it was time to bring things to life with an interactive clickable prototype. I created a clickable prototype for the following features as they all interconnect and flow through one overarching user story.

Intro/Onboarding/Sign up

Brushstroke Arrow Smooth Curve Down

Search for a financial advisor

Brushstroke Arrow Smooth Curve Down

Book a call

Make a payment

Brushstroke Arrow Smooth Curve Down

Usability Test Plan

Goal:

To assess the learnability and satisfaction for new users interacting with the application for the first time on mobile. I would like to observe and measure if users understand the app, its value, and how to complete basic primary functions, such as logging in, searching for a financial advisor and booking a call.


Test Objectives:

1) How easy it is for new users to sign up. Are there any points of friction, or hesitation with giving out information?

2) How would users search for a financial advisor?

3) How easy is it to book and pay for a call with their chosen advisor. Are all the options given that they would want?

4) How to access upcoming calls

:

Methodology & Participants

The study will be held online and will be conducted as moderated, remote tests. Informed consent forms will be sent out via Docusign prior to the test. The study will test 6 participants, all from the target audience (25-35, ideally living in a large city and employed full time) and will be recruited from my personal network. Participant details can be found here.


Script:

For a detailed review of the test script used, including all tasks tested, please refer to the test script here.


Metrics:

Errors will be measured using Jakob Nielsen’s scale

Learnability is measured using the following equation: (S + (P x .5)) / total number of task attempts = Success Rate %

Satisfaction will also be measured using the Single Ease Question 5-point rating scale after each task.

User Profile Picture

6 Participants

calendar outline icon

12th - 13th May

Clock

30 - 40 minutes

Software Development Icon

Zoom & Figma

Affinity Mapping

After the interviews there were over 300 minutes of recordings to filter through and analyse. Affinity mapping was used to analyse the findings, as it's an effective way of organising large amounts of information, allows you to easily combine duplicated results and enables trends and patterns to be easily spotted. I organised my results into the 4 following categories using Miro.

Spotting Common Issues

Once I had my categories organised in Miro I transferred the results into a rainbow spreadsheet using Google Sheets and I split this document into 3 sections. Section 1 contained details of the test participants, section 2 showed the affinity mapping categories with the results that correlated to each participant, and the third section detailed other statistics such as satisfaction.


A rainbow spreadsheet is useful when analysing large quantities of data as it introduces an element of prioritisation to the analysis process. Observations and errors that were made by numerous testers are highlighted, making it easier to decide which errors and issues need to be prioritised in the next iteration. Click the link to the left to view the spreadsheet.

Learnability &

Satisfaction

Errors

Error key

Using the rainbow spreadsheet, errors were classified using the Jakob Nielsen’s four-step rating scale.


Errors that were classified a 3 or above and that had been assigned to two or more participants were prioritised as urgent, along with observations that were assigned to 3 or more participants.


These errors and issues were then rated in order of severity and addressed from most severe to least severe. Details of the top 3 errors observed and the action taken to fix them are shown on the following slides.

Issue 1: Navigating the dashboard was confusing (Severity Major)

When asked an open question about the dashboard design, 4 participants found it confusing and 3 Participants said the duplication of the buttons were confusing when trying to access a booked call.

Before

Redesigned

Photo of Apple iPhone 11 Cutout
Brushstroke Arrow Smooth Curve Down Long
Brushstroke Arrow Smooth Curve Down Long

Dashboard feature on homepage removed and replaced with quotes and case studies

Entry point now through the top right corner via the profile icon

Photo of Apple iPhone 11 Cutout
Brushstroke Arrow Smooth Curve Down Long
Brushstroke Arrow Smooth Curve Down Long

Keep the navigation bar to enable the user to jump between the dashboard features

Replace the buttons/icons on the dashboard homepage with the users profile overview

Solution:

Amend the dashboard design so there is only one entry point to the call feature

Include onboarding coach marks for the dashboard

Brushstroke Arrow Smooth Curve Down Long
Brushstroke Arrow Smooth Curve Down Long
Photo of Apple iPhone 11 Cutout

Change 'calls' to 'upcoming calls'

Brushstroke Arrow Smooth Curve Down Long
Photo of Apple iPhone 11 Cutout

Dashboard homepage - first view

Dashboard homepage -video coach point

Photo of Apple iPhone 11 Cutout
Brushstroke Arrow Smooth Curve Down Long

Clearer wording added to "join call here" button

Upcoming Calls

Solution:

Change the process to payment details being stored and payment being taken once the call has happened.

Brushstroke Arrow Smooth Curve Down Long
Photo of Apple iPhone 11 Cutout
Brushstroke Arrow Smooth Curve Down Long

T&C's added

Photo of Apple iPhone 11 Cutout
Brushstroke Arrow Smooth Curve Down Long

Change in terminology to include "authorisation"

Photo of Apple iPhone 11 Cutout
Brushstroke Arrow Smooth Curve Down Long

Button changed from "pay" to "authorise"

Payment screen 1

Payment screen 2

Payment screen 3

Issue 2: Uncomfortable that payment was taken before the call had happened (Severity Major)

3 participants felt uncomfortable being charged for the call before the call had taken place. Especially as the booking is technically a request that the advisor still needs to confirm.

“The advice hasn’t been provided so I wouldn’t expect to pay for it”

There were a number of other errors observed during the user testing which were a 'one click fix' within the prototype


  • Credit card payment path didn't work
    • Solution: Amend screen interaction in figma
  • Pension option not clickable in sign up process
    • Solution: Make clickable in figma
  • Clicked on entire advisors card to expand profile instead of expand icon
    • Solution: Make entire card clickable in figma

.

Click here to view the

revised prototype

Brushstroke Arrow Rapid Curved Long

Preference

Testing

Another evaluative research method I used to ensure the users directed the design decisions, was to implement preference testing. Preference testing is useful for validating design decisions that have already been made or to dig deeper into issues that were raised during the usability testing.


I focused on testing the onboarding and sign up process as this is the most important step within the whole of SET, as it's key that users can, and want to create an account.


Guest access is actually offered, as Dan, my primary persona likes to see the value in things first, however the overall user experience will be greatly improved by having an account as it enables access to the dashboard and custom content - features that Dan will use within the app.


Objectives:

  • Do users prefer a horizontal or vertical list of features on the onboarding page
  • Which terminology is favoured, "Sign up" or "Create an account"
  • Which order do users prefer to be shown sign up options. Email or Google first


Methodology & Participants: Testing will take place online using Usability Hub across the 30th and 31st of May. Testers will be recruited from the CF slack community and social media groups.


User Profile Picture

18-23 Participants

calendar outline icon

30th - 31st May

Clock

2 minutes

Software Development Icon

Usability Hub

Which screen do you prefer best?


Screen A was the clear winner with 83% (15/18) of testers selecting it with a 99% statistically significant difference. The overall feedback was that the linear layout was easier to read and looked more organised.

The full report can be found here.

83%

Photo of Apple iPhone 11 Cutout
A

17%

Photo of Apple iPhone 11 Cutout
B

Visual Design

Evolution

Design Collaboration

The next stage to refining the design was to let fellow designers test drive SET and provide feedback to help me catch any pain points and ultimately improve the overall design.


The prototype and the comments provided can be viewed here.

User Profile Picture

6 Participants

calendar outline icon

7-9 July 2022

Software Development Icon

Figma

I collected and condensed insightful feedback using a rainbow spreadsheet. This helped identify high-priority issues marked in red, and facilitated a methodical approach to addressing and deciding on feedback implementation. Some revisions identified included:



1) "Primary dark" colour made darker and used more

Several Designers commented on the need for a darker blue to replace the black font on some screens. There were also comments made about images not having strong enough contrast, due to the colour and thin stroke used.

2) Second “stronger” gradient added

Several Designers commented that they liked it, but other's pointed out it's not common to see gradients used so heavily throughout an app and there are potential contrast issues.


I redesigned some processes which in turn eliminated some of the turquoise primary buttons that were causing a contrast issue. I also created 2 versions of the gradients. A soft one and a heavier one to provide more contrast where needed as seen in the 2 images on the right



Original. Gradient too soft and poor contrast

Revised. Stronger gradient and better contrast


3) Redesigned choice chips

I originally followed the material design guidelines when creating the buttons and choice chips. Buttons had a height of 40px and a corner curve of 100. Choice chips had a height of 32px and a corner curve of 8.


Based on the feedback recieved I made the CTA's more similar and had the choice chips follow the same design as the buttons. The font was replaced with Roboto, sized down to 14px and the colour of a selected choice chip was the new "primary dark" #37628F.


Style Guide

The Final

Product...

I'm clickable, check me out!

Brushstroke Arrow Rapid Curved Long

Unlocking success with a friction free onboarding redesign

90% of users who downloaded the mobile app dropped during the onboarding journey. I designed a friction free, “try before you buy” experience with the goal to reduce this number to 60%.



Role: UX Designer

Stakeholder: Da Vinci (Macademia)

Industry: Ed-tech, Entertainment

iPhone Frame
iPhone Frame
iPhone Frame

Coming VERY soon!

A native mobile app with the mission to make finding financial advice easy and accessible for millennials. As the sole UX/UI designer I was responsible for all research and design work.




Role: UX/UI Designer

Stakeholder: SET

Industry: Finance

Let’s Chat!

Message Envelope
Call Symbol

+447404588302

Briefcase Glyph Icon