For a better experience on Michael Wills Update Your Browser
500,000+
REGISTERED USERS
10,000,000+
receipt images captured
10,000+
business partners
Rb Mobile Project
My Role

My Role

I was hired at Receipt Bank as the lead digital product designer which would self manage the entire design system for the business. My daily tasks consisted of:

  • Scoping new features with product managers.
  • Building out wireframes, designs and prototypes.
  • Controlling all UI & UX related design tasks.
  • Doing user research and having a user centered design approach.
  • Combining business goals and user needs to achieve the ultimate product.
  • Running user studies and testing workshops.
Rb mobile-project
Task

Task

One aspect of my position at Receipt Bank was to push design changes as well as features. The proposed changes supported by qualitative user research meant I was able to recommend and convince stockholders that a full mobile app redesign was needed to take their product to the next level.

1
To back up my theories that a mobile redesign was needed through multiple types of research
2
To build a design system which could be reused for future mobile app design features/projects
3
With better design to increase engagement in the app and increase retention
4
To reach all of receipt banks target markets through the style of design used.

User and customer research

In order to prove to key stakeholders within the business that a mobile redesign was needed, I used data analytics software like Mixpanel and Hotjar to track events and see where key drop off within the app was.

I also sent our a questionnaire to a sample of our user base to understand how they really felt about the overall UI & UX of the mobile application.

MIXPANEL

I used Mixpanel to see drop off points within the app

HEATMAPS

Hotjar was great for me to be able to see where user impressions are

QUESTIONNAIRE

I used Survey monkey to send out a questionnaire to a sample of our user base

FEEDBACK

I collected feedback via customer complaints for the mobile app on Zendesk

feedback
Discovery

Discovery

After research I did a discovery phase of the project to give myself a solid foundation to work from when producing design work. This included competitor benchmarking, potentional user journies and workshops with the product team.

1
invision mood boards
I used invision mood boards to group competitors and benchmarking
invision mood boards
2
wireframe userflow
Lo-fi wireframes put together to show the potential flow of the new mobile design
wireframe userflow
Current Mobile App Design Planning
3
CURRENT MOBILE APP DESIGN PLANNING
I ran a design workshop to help break down the current mobile app
4
USER FLOW DIAGRAM
A flow diagram to show the user journey inside the new mobile design
User Flow Diagram
Deliverables

Deliverables

Below highlights some hi-fi wireframes I produced in Sketch which then could be converted into a finished design.

1
Login
Login
2
Onboarding
Onboarding
3
Camera
Camera
4
Inbox
Inbox

The onboarding journey

These are the screens from the final onboarding designs. I also used animation to create more engagement for the user. There would also be two different onboarding flows depending on which user was signing in, therefore providing the different user types with information tailored to them.

Watch Video
Journay Group
1
Login
Dashboard 1
2
Dashboard
Inbox 1
3
Inbox
Setting 1
4
Setting

Core Feature

The inbox is the main screen for all users, it covers eighty percent of all usage within the app. So perfecting the design for this was key. Based on research and feedback from the questionnaire I split the inbox into two separate tabs; Completed and Processing.

For the settings screen I have used stroke outlined icons which I created myself as part of the developed design system to go with the new look and feel.

The login screen I produced two different versions, which I then ran a A/B test to measure which one had higher conversion. The one shown above converted better and was then subsequently used for all users.

Learnings

Learnings

The final step of the mobile redesign process was to test it. I built a series of mini prototypes which represented different features and flows within the mobile app.

I then tested these prototypes on a different mixture of our user base by asking them specific questions and actions to perform. This was recorded with a mobile arching camera and a laptop facing camera to fully gather all qualitative research.

Finally the research was gathered and placed into buckets which included UI problems, UX problems, feature problems, technical problems and other.

Deliverables image 1
clickme
Deliverables image 2
Deliverables image 3
Deliverables image 4
Deliverables image 5

Find out more

Got an interesting project and would like to work on it with me?