B2B
B2B
B2B
Fintech
Fintech
Fintech
New feature
New feature
New feature

Voucher benefit

Product designer @Circula

Sole Product Designer for our new benefit, I led the design process from start to finish for web and mobile platforms, collaborating closely with PM and devs to address legal requirements and ensure a seamless user experience.

  • Platforms: Web and native mobile apps.

  • Skills: Research, user interviews, wireframes, usability tests and prototypes.

  • Tools: Figma, Userbrain, Jira and Asana.

Context

Overview

Our product team aimed to introduce a new employee benefit, and with a business event on the horizon, we saw the perfect opportunity to test the waters for voucher benefits. In just two days, our product manager and I collaborated on a simple prototype to showcase to potential users and gather feedback. The demo proved to be quite appealing, prompting us to dive into the development of this exciting new feature.

My role

As the sole Product Designer dedicated to this new feature, I created wireframes, prototypes, conducted in-house and asynchronous usability tests, and crafted the final designs for all platforms, web and mobile apps (iOS and Android). My collaboration involved working closely with the product management team to understand and address legal details. I presented design options, collected feedback, and collaborated with our developers to ensure feasibility and a seamless handoff.

Process

I see the design process as a dynamic journey rather than a rigid timeline that fits all, and this project exemplifies it. With only a few months from concept to launch, we had to navigate legal complexities, understand project requirements, conceptualize, test designs, and develop the feature simultaneously.

Considering the feedback from our demo prototype at the fair, I delved into competitor analysis, understanding voucher systems and features. At the same time, our PM delved into the legal aspects of vouchers.

With the project scope evolving and legal interpretations still pending, I started testing potential concepts. This groundwork allowed us to make informed decisions and prioritize user experience when solid requirements emerged. Early in-house usability tests and later asynchronous tests with non-Circula users via Userbrain provided diverse feedback.

Developer involvement from the beginning facilitated feedback on feature development and estimated efforts.

Ideating and testing

Given the initial uncertainty surrounding project requirements, my approach focused on iterative testing and feedback gathering. Exploring various user flows to gain insights into user behavior. This iterative process allowed me to build a deeper understanding and make informed design decisions as project parameters became clearer.

10

10

prototypes

21

21

participants

Tests focus:

  • What is the general understanding of monthly vouchers.

  • How users would select their vouchers, where they expect to find it, how to use it and how to keep track of their vouchers.

  • Evaluate minimal version we would need to provide for the MVP version to consider a good usability.

User insights

MVP Focus

In developing the MVP, we prioritized simplicity while ensuring optimal usability. We streamlined features to their essentials, creating an intuitive user experience without unnecessary complexities. The goal was to deliver core functionalities that met user needs efficiently.

Monthly vouchers by request

This provided employees with the flexibility to order vouchers of their choice each month, ensuring a tailored experience with no strings attached. This user-centric approach empowered employees to select vouchers based on their preferences, enhancing the personalization of the benefits program.

Voucher wallet

This improvement created a more comprehensive overview, addressing challenges identified in usability tests. The current benefits page structure, organized by month, sometimes made it challenging for users to locate vouchers. The Voucher Wallet simplified this process, making it easier for users to track and enjoy their benefits with greater convenience.

Vouchers request

In response to the dynamic nature of working with service providers, to ensure the ordered vouchers would be available until the end of the month, we implemented a deadline for voucher requests, guaranteeing timely delivery. Additionally, we incorporated reminder functionalities to assist users in remembering to place their voucher orders, enhancing the overall user experience.

Used vouchers

While we couldn't directly track their usage (limitation of tracking vouchers provided from external systems within our app), we offered users the ability to manually mark vouchers as used. This solution empowered users to better manage their vouchers on our apps.

User flows

Below, you'll find a detailed breakdown of the primary user flows, illustrating how users navigate through the app's features and interact with its various functionalities. By comprehensively understanding these flows, we can optimize the user experience to meet and exceed our users' needs and expectations effectively.

Voucher request

Order time up

Insufficient funds

Voucher wallet

Web app

Considering that the majority of our benefit users submit their benefits via the mobile app, and our assumption that users would use their mobile phones to provide the code at physical stores, we decided to focus more on our mobile apps. We spent more time improving the flows, testing, and understanding user needs. However, we also provided a simpler web version for our desktop users.

Voucher request

Vouchers statuses

Scaling with Enhanced User Experience

As our voucher benefit gained traction, we expanded our merchant pool from 15 to 80+ options. This growth presented a new challenge: how to help users efficiently navigate an extensive list of brands. Introducing this simple yet effective search feature, we significantly improved usability, ensuring our expanded merchant options remained accessible and user-friendly.

Future improvements

As we designed the MVP version, numerous potential ideas for new features and improvements for an enhanced version of the benefit were already in consideration. Following the launch, we've actively gathered user feedback over time to assess and identify areas where enhancements could be beneficial to their overall experience.

Multiple vouchers

Offering users enhanced flexibility to allocate their benefits across various vouchers, aligning the experience more closely with their individual preferences and needs.

Search and Filter

This enhancement enables users to quickly locate desired brands, ensuring a seamless experience as our offerings expand.

Fallback voucher

Mitigate the risk of users missing the voucher request deadline. In the event a user misses the deadline, a default voucher, selected as their last choice, will be provided. This ensures that every user receives a voucher, minimizing frustration and offering a benefit that aligns with their preferences.

Stronger UI

Revamping the UI with a modern aesthetic to create a visually appealing and recognizable brand experience. The focus is on elevating the overall look and feel, making interactions more engaging and brands distinctly recognizable for users.

WORK

WORK