Your secure all-in-one financial platform.
OnePay
OnePay is a responsive web app concept that simplifies digital payments by offering a secure, cardless experience for sending money, splitting bills, and tracking spending.
About the Project
At a Glance
About the Project
My Role
The Process
Motivation
OnePay is a responsive web app concept developed as part of a UX certification project. The goal: create a secure, intuitive payment experience for everyday users – without relying on physical cards.
I was solely responsible for all UX tasks across the project: planning and conducting research, synthesizing findings into actionable insights, designing cross-platform flows and wireframes, and testing prototypes with real users.
The project was structured into 7 agile sprints, each focused on key phases of the UX process: user research, flow design, prototyping, usability testing, and iteration.
I was particularly drawn to this challenge because of its real-world relevance: digital payments are part of everyday life, yet they often feel clunky or impersonal. For me, OnePay was a chance to grow as a designer – by working end-to-end, testing assumptions, and balancing simplicity with flexibility in a space that demands both security and usability
Imagine handling your everyday finances – from splitting bills to tracking expenses – in one simple, secure place. That’s the clarity OnePay was designed to deliver.
Tools
Figma
Adobe Illustrator
Notion
Maze
FigJam
Responsibility
UX Research
Wireframing
Sketching
Prototyping
Design System
Presentation
Understanding the Problem
User Research
Competitor Analysis
Discover
Design System
Figma Prototype
Prototype
User Personas
User Journey
User Flow
Define
Usability Test
Accessibility Test
A/B Test
Card Sorting
Test
Developing a Solution
Moodboard
Low-Fidelity Wireframes
High-Fidelity Wireframes
Outlook
Ideate
Design Iterations
User Feedback
Refine
Process & Approach
Scope & Impact
Over the course of a 3-month sprint-based project, I led the full UX process: from competitive analysis and user research to prototyping, usability testing, and design iteration.
Designed for two distinct user needs – a socially active millennial and a self-employed consultant – OnePay aimed to eliminate confusion around payments, card management, and budgeting.
Usability tests showed a 75% drop in errors across key flows. 73% of participants preferred the new floating navigation. Visual hierarchy, simplified flows, and accessibility tweaks all contributed to a more intuitive and confident user experience.
75%
drop in errors across key flows
in Usability Tests
Understanding the Problem
Before jumping into solutions, I needed to understand how people experience digital payments in real life. What works, what doesn’t, and where the real frustrations lie.
This phase focused on defining a clear mission, uncovering pain points through research, and analyzing competing products. These insights shaped the foundation of OnePay’s concept and led to the creation of two distinct personas that guided every design decision that followed.
Discover
Create a seamless, secure, and device-agnostic payment experience that helps users send money, manage cards, and track expenses effortlessly, without relying on physical wallets or bloated interfaces
Mission Statement
Understanding the User
Discover
To understand real behaviors and expectations, I conducted 1-on-1 interviews and user surveys with a diverse group aged 21–45. The research focused on everyday tasks like sending money, splitting costs, tracking spending, and managing digital cards.
Beyond surface frustrations, I looked for patterns in how users navigate financial tools – and what makes them trust or abandon them. These findings directly informed the personas, problem statement, and early concept ideas.
Goal 1
Identify how users currently manage digital payments and transfers, including frequency and the challenges they face, to inform the design of a seamless payment experience in OnePay.
Goal 2
Uncover user frustrations and limitations with current banking or payment apps to help OnePay address these gaps and offer a more user-friendly experience.
Goal 3
Learn what users prioritize in terms of security when using financial apps, so OnePay can be designed with features that make users feel secure and confident.
User Research Key Insights
The Problem Statement
Research Goals
Users Struggle with Overspending
Many users face challenges in controlling their spending, and tools that help monitor and manage expenses are highly valued. OnePay can address this by offering clear budgeting features and real-time spending notifications to help users stay within budget.
App Performance Matters
Delays in transactions and slow or glitchy app performance significantly frustrate users. A smooth, fast, and reliable user experience is essential for OnePay to gain user trust and prevent drop-offs due to technical issues.
Security is a Top Priority
Users are concerned about the safety of their financial information, with a strong desire for enhanced security features. OnePay must prioritize secure authentication methods (e.g., biometrics, two-factor authentication) and offer users more control over their privacy and security settings.
Users Want Control and Transparency
Users express a need for greater control over their account settings and notifications. Giving users the ability to customize their alerts and security preferences will foster a sense of trust and empowerment.
Organization and Tracking are Essential
Having a clear, easy way to track expenses and review payment history is highly valued by users. OnePay should emphasize intuitive features that organize and display transactions, helping users stay financially organized and easily monitor their spending.
Convenience is Key, but Not at the Expense of Security
Users appreciate the convenience of digital payments, especially for everyday tasks like shopping and splitting bills. However, they balance this with a cautious approach to security. OnePay should ensure that while the app is easy to use, it does not compromise on safety.
Customization is Desired
Users want more control over the app's functionality, particularly in terms of notifications and security features. Providing flexible, customizable options will help meet diverse user needs and comfort levels with digital payments.
Emma likes to shop online. She needs a way to securely manage and conduct all her financial transactions in one place because she finds it frustrating and time-consuming to handle multiple cards and platforms. We will know this to be true when we see a decrease in the time spent on managing finances and an increase in user satisfaction through feedback surveys and usage analytics.
Competitor Analysis
Discover
To identify design opportunities, I analyzed key competitors like PayPal and Klarna using a SWOT framework. This helped highlight where these platforms succeed and where they fall short in supporting everyday money tasks.
The goal was not to copy features, but to understand user expectations and uncover areas where OnePay could offer a simpler, more focused experience.
PayPal
PayPal offers a secure online payment platform for individuals and businesses. It provides features such as invoicing, payment processing, and international fund transfers, emphasizing trust, security, and convenience.
Strengths
Weaknesses
Opportunities
Threats
Brand Recognition and Trust: PayPal is a well-established and globally recognized brand, which instills trust among users and businesses.
Comprehensive Service Offering: PayPal provides a wide range of financial services, from online payments to peer-to-peer transfers, business loans, and cryptocurrency transactions.
Large User Base: With millions of active users and businesses globally, PayPal has a significant network effect that strengthens its market position.
Integration and Partnerships: PayPal’s extensive integrations with e-commerce platforms, marketplaces, and financial institutions make it widely accepted and convenient for merchants and consumers.
Higher Fees: PayPal’s transaction fees, especially for businesses and international transfers, can be higher compared to some competitors, potentially deterring cost-sensitive users.
Complex Dispute Resolution: Some users report difficulties with PayPal’s dispute resolution process, which can lead to customer dissatisfaction.
Limited Customer Service: PayPal has faced criticism for its customer support, which can be difficult to access or slow to respond.
Expansion into Emerging Markets: There’s significant growth potential in emerging markets where digital payments are still gaining traction.
Growth in E-commerce and Digital Payments: As online shopping and digital payments continue to grow globally, PayPal can capitalize on this trend by expanding its services and user base.
Cryptocurrency and Blockchain: With the growing interest in cryptocurrencies, PayPal’s move into crypto trading and blockchain technology could open new revenue streams and attract tech-savvy users.
Fintech Partnerships and Acquisitions: By acquiring or partnering with innovative fintech startups, PayPal can continue to evolve its product offerings and stay ahead of the competition.
Intense Competition: The digital payments space is highly competitive, with companies like Stripe, Square, Google Pay, and Apple Pay offering strong alternatives.
Regulatory Challenges: As a global financial service provider, PayPal is subject to complex and evolving regulations in different countries, which can impact its operations and profitability.
Security Risks: Despite strong security measures, PayPal remains a target for cyberattacks and fraud, which could damage its reputation and lead to financial losses.
Klarna
Klarna offers Buy Now Pay Later (BNPL) service, direct payments, and financing plans, focusing on convenience, flexibility, and a modern, customer-centric approach.
Klarna’s platform enables users to delay purchase payments, improving the shopping experience.
Strengths
Weaknesses
Opportunities
Threats
Innovative Payment Solutions: Klarna is a leader in the "Buy Now, Pay Later" (BNPL) space, offering flexible payment options that appeal to a wide range of consumers.
Strong Brand and User Loyalty: Klarna has built a strong brand, especially among younger consumers, who appreciate the convenience and flexibility of its payment options.
Rapid Global Expansion: Klarna has successfully expanded into numerous international markets, establishing itself as a major player in the global fintech landscape.
Partnerships with Retailers: Klarna has formed partnerships with thousands of retailers worldwide, integrating its services directly into e-commerce platforms and making it widely available at checkout.
High Risk of Consumer Debt: The BNPL model can lead to increased consumer debt, and if not managed properly, this could result in financial difficulties for users and regulatory scrutiny for Klarna.
Limited Financial Services: Unlike more comprehensive financial platforms, Klarna primarily focuses on BNPL and related services, which limits its offering compared to competitors with broader financial ecosystems.
Regulatory Challenges: Klarna’s BNPL services face increasing regulatory scrutiny in various markets, which could result in stricter regulations and impact its business model.
Dependency on Retail Partnerships: Klarna’s success is heavily tied to its partnerships with retailers, which means any disruption in these relationships could negatively affect its business.
Expansion of Financial Services: Klarna has the opportunity to expand its offerings beyond BNPL, such as savings accounts, personal loans, and investment products, to create a more comprehensive financial platform.
Growth in E-commerce: The continued growth of e-commerce provides a significant opportunity for Klarna to increase its user base and expand its market presence.
Innovation in Payment Solutions: Klarna can leverage its technology and brand to innovate further in payment solutions, such as digital wallets or cryptocurrency payments, to attract a broader audience.
Sustainability Initiatives: Klarna can tap into the growing consumer interest in sustainability by offering eco-friendly payment options or integrating sustainability metrics into its platform.
Intense Competition: Klarna faces strong competition from other BNPL providers like Afterpay and Affirm, as well as traditional financial institutions and payment platforms expanding into the BNPL space.
Regulatory Risks: The increasing regulatory scrutiny on BNPL services could lead to stricter rules, higher compliance costs, or restrictions on Klarna’s operations, especially in key markets such as the EU and the US.
Consumer Credit Risks: Klarna’s business model involves significant credit risk, as it provides financing to consumers. Any increase in defaults or delinquent payments could harm the company’s profitability.
Reputation Risk: Any negative press or backlash related to consumer debt issues or regulatory fines could damage Klarna’s reputation, leading to a loss of consumer trust and market share.
OnePay
User Personas
Define
Designing with Real Needs in Mind
Among the patterns identified during user research, one persona emerged as especially central to OnePay’s core experience: Emma.
She represents users who are fast-paced, mobile-first, and want to handle money with minimal friction, especially when social interactions like bill-splitting or shared expenses are involved.
While a second persona, Mike, a self-employed consultant, also informed design decisions (particularly around control, transparency, and budgeting), Emma’s needs were the primary driver for early concept development and flow prioritization.
Emma Jackson | she/her | Age: 24
Emma Jackson | she/her | Age: 24
Social Media Manger
Hamburg, GER
Tech Comfort
Emma is constantly managing her busy lifestyle, balancing work and social engagements. She frequently uses digital payments for online shopping, splitting bills with friends, and managing subscriptions. She values speed, convenience, and financial control but doesn’t want to spend too much time manually tracking her finances. Having all her payment methods easily accessible in one app is a key priority, and she wants quick access to her transaction history to help manage her spending. While security is important, her main focus is on efficiency and budgeting.
Background
Make quick, seamless payments without needing to switch between apps or cards.
Have a simple way to track spending and avoid overspending, with minimal manual input.
Consolidate all payment methods in one place for easy access and convenience.
Goals
Slow or clunky payment processes that disrupt her fast-paced lifestyle.
Struggles with managing multiple payment methods across different apps, making transactions more cumbersome.
Difficulty keeping track of spending without a simple, automated budgeting tool to monitor her expenses in real-time.
Frustrations
A fast, easy-to-use payment system that integrates all her cards and accounts.
Automated budgeting tools that provide real-time tracking and summaries of her expenses.
Access to a clear transaction history, showing her spending patterns at a glance.
Needs
Manage and track your expenses easily and securely with OnePay.
OnePay
Information Architecture
User Flows
Ideate
From early research, one task clearly stood out: splitting a bill with friends.
It was not only one of the most common use cases, it was also one of the most frustrating, often requiring multiple apps, manual calculations, and unclear confirmations.
I decided to focus the concept around one simple flow:
Splitting a shared dinner bill in just a few taps, while giving users clarity, flexibility, and control.
To map out this experience, I designed a streamlined user flow that prioritized:
• Minimal steps
• Clear feedback at every stage
• Options for editing, sharing, or requesting money
Instead of showing full sitemaps or user journeys, I focused on how the core interaction unfolds from Emma’s perspective; across mobile and desktop.
→ If you’re interested in these slides, they’re available on request.
Emma is an existing User
Forgot Password
Select ‘Bill Splitting’
Enter Credentials
Enters the total bill amount, the number of her friends and chose to split the amount evenly
Emma confirms the split and sends payment requests to her friends via OnePay (or by sharing a link).
Emma selects her own payment method from her linked accounts or cards to pay her share.
Emma finalizes her payment and receives confirmation that her share has been paid.
Emma can see updates in OnePay when her friends complete their payments, ensuring everyone’s portion is settled.
As a young tech-savvy and social woman, I want to split the bill with friends quickly, so that I can pay my share and track it in my budget seamlessly.
Objective
What prompted her?
How will she know the task is done?
What does Emma already know?
What information does she need?
Information Gathering
Emma receives a message, that the payment is confirmed.
Success Criteria
Emma, 24,
The Digital Native
Usability Testing
Test
With the core flow mapped out, I created a clickable mid-fidelity prototype and conducted usability tests to validate the design direction.
The test focused on the bill-splitting scenario: “You had dinner with three friends. Split the bill and pay your share using OnePay.”
I tested with 6 participants (age 22–41) on both mobile and desktop versions using Maze and moderated sessions.
The goals were to observe:
How quickly users understood the interface
Where they hesitated or made mistakes
Whether the flow felt intuitive and trustworthy
Tasks were supported by a short questionnaire and Rainbow Sheet to capture issues by severity and frequency.
Research Goals
Participants
6
Tasks to Complete
4
Methodology
Remote, unmoderated
In-Person
Equipment
Smartphone, Laptop
Camera & Audio gear
Timeframe
1 week
Goals
This study aims to evaluate the usability and learnability of the OnePay payment app. The focus is on observing and measuring user interactions, understanding the app's ease of use, and assessing the user’s ability to complete key tasks, such as navigating the app, adding a new payment method, downloading reports, and splitting bills with others.
Session Duration
30 min
Issues & Insights
What the Testing Revealed
The testing confirmed that the core flow was well-received, but also surfaced key friction points:
Some users hesitated when selecting people to split with—labels and actions weren’t always clear.
A few expected visual confirmation after sending money, such as a receipt or animation.
On desktop, one participant overlooked the “Edit Amount” option because of low visual hierarchy.
These observations led to several design adjustments, including:
Improved wording and iconography for selecting participants
Adding subtle feedback (e.g. checkmark + animation) after successful payments
Reworking layout and contrast for secondary actions to ensure visibility
Issue 1
Accessibility of Menu Bar — High
Ensure the menu bar uses a sticky design, keeping it fixed at the bottom of the screen regardless of scrolling.
Ensuring that the menu bar is consistently accessible across all devices is critical for navigation and user experience. Without reliable access, users may struggle to perform core actions, which directly impacts usability.
Issue 3
Location of the "Add a New Card" Setting — Medium
Relocate the "Add a New Card" option to the Payments section this is a more logical location for managing payment methods.
Many participants found the placement of the “Add a New Card” option confusing. This issue requires immediate attention since it affects a key user flow and was a consistent pain point.
Issue 2
Missing CTA to Finish Bill Splitting — High
Renaming the button to “Finish” or “Confirm Split” button at the final stage of the process.
Bill splitting is a primary feature highlighted in the project goals. If users can’t complete this action, it undermines one of the app's main selling points, frustrating users and lowering satisfaction.
Issue 4
Balance Update on Home Screen — High
Adding a “Refresh” button on the Home Screen for users to manually update their balance in addition to real-time updates.
Users expect real-time feedback, like balance updates, after key actions. Failing to meet this expectation reduces trust in the app's responsiveness and functionality.
Wireframes
The wireframes focused on speed, flow logic, and reducing cognitive load. Each screen was designed with a clear visual hierarchy and minimal UI noise, allowing the core actions – like splitting, confirming, and reviewing – to stand out.
These layouts served as the blueprint for usability testing and iteration.
Ideate
Style Guide
Iconography
Ideate
Indigo 700
#4338CA
R 255 G 255 B 255
Indigo 100
#E0E7FF
R 255 G 255 B 255
Indigo 50
#EEF2FF
R 255 G 255 B 255
#6366F1
R 255 G 255 B 255
Cool Gray 800
#1F2937
R 255 G 255 B 255
Cool Gray 50
#F8FAFC
R 255 G 255 B 255
SF Pro Display
San Francisco is an Apple designed typeface that provides a consistent, legible, and friendly typographic voice. Across all Apple products, the size-specific outlines and dynamic tracking ensure optimal legibility at every point size and screen resolution. Numbers have proportional widths by default, so they feel harmonious and naturally spaced within the time and data-centric interfaces people use every day.
Line Height: 140%
Letter Spacing -1%
34px
28px
22px
Regular
Semibold
Bold
16px
14px
12px
The visual language was designed to feel calm, modern, and reliable – supporting emotional trust without distraction. I used soft colors, rounded shapes, and a balanced type system to reflect clarity and ease of use.
The icon set was custom-curated for consistency, supporting fast recognition across mobile and desktop.
Mobile Grid
1
Margin: 16px
Columns: 12px
Gutter: 8px
1
7465
4001
1701
2365
03/29
valid
through
James Tiberius Kirk
7465
4002
1701
2365
03/29
valid
through
Jean-Luc Picard
7465
4003
1701
2365
03/29
valid
through
Kathrine Janeway
Outcome & Reflection
From Insights to Impact
The redesigned flow for splitting a bill was tested, refined, and validated through usability feedback.
Users completed the task faster, with fewer hesitations, and described the experience as “clear” and “surprisingly easy.”
This project helped me sharpen my UX thinking across the full process – from research to prototyping to validation.
I gained particular experience in:
• Translating vague needs into concrete flows
• Testing early and often – even with simple prototypes
• Prioritizing clarity and emotional feedback over feature overload
I see this not just as a case study, but as a solid UX foundation I can build on: turning complexity into ease, and assumptions into tested solutions.
Email → hello@chrispaff.com
LinkedIn → linkedin.com/in/chrispaff
Thanks for taking the time to explore this case study.
If you’re interested in collaborating or learning more about my work, feel free to reach out.
Thank you