White-label Digital Wallet

The Brief

Create a customisable design for digital wallets and card-based expense management. Aim to captivate potential FinTech customers and guide them towards our product development services.

Competitor Analysis

The Digital Wallet project was comprised of three primary phases, each emphasising a distinct user journey. These phases were as follows:

Phase 1 - Viewing previous transactions.
Phase 2 - Exploring additional transaction details.
Phase 3 - Utilising the search and filter feature

Each phase commenced with a comprehensive competitor analysis, examining renowned brands such as Apple Pay and Google Wallet. Industry standards and prevailing patterns were carefully identified. Features were categorized into "essential" and "nice to have" sections. Furthermore, the layout, language, and text hierarchy were documented using Miro.

Ideation

I utilised my previous research to create a user flow for all three phases. I conducted a thorough examination and testing of how competitor apps enabled users to search for and locate their transactions. My research provided insights into various questions, such as:

  • How many filter options should be available?

  • What process allows the user to return to their previous search?

  • What transaction details should be presented?

  • What filter settings should be default?

I utilised the Crazy 8 method to brainstorm and sketch initial layout ideas. This was then followed by a few more detailed, yet still low-fidelity, digital mockups.

Design Time

The Digital Wallet homepage had been established by a previous designer. Utilising this as a starting point, I established a reliable Design System. I populated the Design System extensively with components, styles, and booleans, all organised within an auto-layout. This approach aimed to ensure consistency and efficiency.

Using sketches and wireframes as a foundation, I started creating an interface for the three main phases:

Phase 1 - Viewing previous transaction.
Phase 2 - Viewing transaction details.
Phase 3 - Searching and filtering feature.

Once the UI was completed, I proceeded to design a second User Flow to clearly communicate the intended user journey to Product Managers, QA, Developers, and Clients.

You can view the digital wallet prototype directly on Star’s website.

Simply navigate to the near bottom of Star’s website and click the Design toggle button.