W
W
Wage Wise
Wage Wise
Embedded Files
An early wage access app (Payments/Fintech)
Project Overview
Project Overview
Wage Wise is a financial empowerment app that provides early wage access (Payments/Fintech). This independent design project focused on User Interface design and explored creative solutions to deliver a seamless and accessible experience through thoughtful Information Architecture.
Working with a hypothetical stakeholder, we defined requirements and limitations to guide the design process. We designed both the Wage Wise app and website in parallel, ensuring consistency across platforms.
Business Need
Business Need
Providing a user-friendly app that enables employees to access a portion of earned wages before payday, while having features for track earnings, goal setting, and automate saving.
Goals
Goals
Simplifying the process of accessing earned wages, making it intuitive and seamless.
Developing a user-friendly interface with smooth navigation for optimal user experience.
Design Process
Design Process
We followed the Double Diamond method based on the Design Thinking Methodology. The process wasn't linear; we moved back and forth between stages as the project evolved.
Discover
Discover
Interview and Affinity Diagram
Interview and Affinity Diagram
As a first step, we interviewed 16 potential users, and the affinity diagram was made accordingly. We asked more open-ended questions, allowing for a discussion with the interviewees rather than a straightforward Q&A format.
Top Takeaways:
Simple and easy to use without confusing information.
Monitoring and accessing earnings after each workday or shift.
Informing about next payday, available pay, completed shifts earnings, and any important updates.
Clear and intuitive data visualisation.
Smooth transaction process.
Competitive Analysis
Competitive Analysis
We analysed Money Manager and four other financial apps, as well as PayActiv and two other early wage access apps. In doing so, we were able to design a more effective Information Architecture, Workflow, and Data Visualisation for a better user experience for our product.
Top Takeaways:
Identified items for the tab bar.
Content strategy.
User-friendly interfaces for a seamless experience.
How to present data understandably and visually.
Define
Define
User Persona
User Persona
To establish our design and communicate information about the users, that we gathered during our research, we developed a persona.
App Map
App Map
Based on our research, we developed an initial version of the Information Architecture and refined it through the design process and user testing to create the final version.
Develop
Develop
Mid-Fi Wireframes
Mid-Fi Wireframes
We have created mid-fidelity wireframes to outline the page layout design vision. These wireframes went through several rounds of iteration before finalising the content.
Colour Palette & UI Kit
Colour Palette & UI Kit
We selected a vibrant shade of yellow as the primary color, because:
Promotes Positivity and Optimism: Evokes feelings of happiness and relief associated with financial stability.
Grabs Attention: create a memorable visual experience with our users.
Conveys Energy and Dynamism: Reflects the app’s quick and efficient financial solutions.
Fosters Trust and Confidence: Associated with clarity and transparency, reinforcing reliability.
Encourages Creativity and Innovation: Aligns with the app’s pioneering and modern nature.
For designing high-fidelity interfaces, I defined a UI Kit consisting of fonts and elements to ensure consistency across all screens.
Challenges & Solutions
Challenges & Solutions
During the design process, we faced some challenges and based on the analysis of all our research data, we attempted to address them by incorporating solutions into our design.
Knowing the next payment date
Displaying the next payment date on the first page and representing it with a progress bar, to help users manage their finances.
Informing about weekly earnings in a month
Using a bar chart for visualisation, allows users to compare with the weeks of the previous month and provides a complete view of their earnings process.
Real-time access to earnings information
Showing the amount of earned wage and the details of the last work shift.
The received amount of earnings through the app
Providing a section with a quick overview and also a history for users who want to delve deeper into their past transactions.
Monthly payments overview
Providing a salary history section with a quick overview of the last payment details.
Earnings display modes
Providing three different modes to display the amount of earnings based on the user's preferences.
Informing about the completed shift
Displaying the details of work shifts from the past days of the month, with the option to view more details on each shift's page.
Usability Test
Usability Test
We tested the task of getting a portion of earnings with 5 people. During usability testing, we observed 2 issues:
Users were confused about why the total amount they could receive differed from their total earned wage. To address this, a section was provided showing their available pay and payment limit settings. This allows users to control their pay wage within the maximum limits set by their employer.
Users didn't realise that the Goal Setting categories had horizontal scrolling, so all categories were placed in a non-scrolling section for ease of use.
Results: The usability testing insights led to key design improvements that enhanced clarity and ease of use. These changes resulted in smoother user interactions and increased confidence in completing tasks. Overall, the iterative user-centred design approach significantly improved the app’s usability and user satisfaction.
Deliver
Deliver
High-Fi Wireframes
High-Fi Wireframes
A few high-fidelity wireframes are shown below.
Final Design
Final Design
Even though the design process is always evolving based on how human behaviour and needs change over time, this is the point we agreed to call it "Done".
Reflections
Reflections
What did I learn?
What did I learn?
Understanding users' needs at every stage of the design process, keeping track of all research findings and continually referring to them, for addressing this issue.
Making a good balance of users' needs and stakeholders' strategy in mind while designing.
It was interesting to discover that I enjoyed interaction design the most, and I'll continue to develop this skill.
What can we do next?
What can we do next?
It would be beneficial to improve the design development of some pages, such as the Hub, to make them more useful.
See more of my work:
Google Sites
Report abuse