BackgroundDefineDesignRefineConclusion

Final design

Design process

Key activities

Define problem space

Go to section

Wireframing & prototyping

Go to section

Usability Testing
& Preference Testing

Go to section

Final design with style guideline

Go to section

Context

The initial goal of this project was to create an online payment service app. Through the UX design process, I designed HedgiPay to be a secure payment service that aggregates multiple bank accounts into one card that can be used for both online and offline payments. HedgiPay also helps users keep track and support their financial goals to manage their finance better.

Problem statement

Individuals who regularly shop online need an instant, secure and guaranteed payment solution that protects them and their purchases against fraud because it will make them more comfortable with their transactions.

Highlighted takeaways

👉 Shoppers prefer quick, secure, and easy payment methods: paylink, with email (Paypal), scheduled payment

👉 An app that provide various money management features can help shoppers better manage their finance

👉 Shoppers often use more than one account

👉 Shoppers prefer instant transfer and historical activities updated in real time
“Sometime I shop more than plan, I feel bad when I look into my balance and realise that.”

“I use different accounts for my different purposes.”

“I want to see my activities updated immediately in real time.”

Highlighted solutions

Issue: Confusion about functions of budgeting buckets and money buckets
Evidence:
- 3/6 participants said they were confused about the difference between budgeting buckets and money buckets.
- 2/6 participants created a budgeting bucket instead of a money bucket when trying to create a saving plan.
Solution: Clearly introduce buckets function for new users (add button "explore buckets" in home page)
Issue: Unclear about statistics in the monthly insight graph
Evidence:
- 4/6 participants felt a bit lost when switching from “this month” to “monthly” view.
- 3/6 participants said they were unclear about the variance (“402”).
- One participant clicked on the graph, expecting to see more detail of the month.
Solution: Add onboarding intro which shows how the insight feature works, and add an icon "i" for accessing the instruction
Issue: Don’t notice the wheel icon (for break-down-into-account function) in monthly insight
Evidence:
- 4/6 participants didn’t understand how the wheel icon functions until clicked into it.
- One participant ignored the icon (didn’t realise it was there).
Solution: Add a label "Break-down view” with a toggle button, set the break-down view as default
Issue: Concern of security matter when send money with no authentication step
Evidence:
- 4/6 participants wanted to use fingerprint/PIN for authentication before sending money.
- One participant mentioned one-time transfer was ok without authentication but a recurring transfers needed a security step.
Solution: Add optional feature for setting up an authentication step for sending money
Issue: Concern of security matter when accessing fast balance and need to customise the view
Evidence:
- 3/6 participants wanted to have the option to set security for accessing fast balance.
- Among them, two participants wanted fast balance as an optional feature, with an option to customize the information.
Solution: Add button to set up fast balance view (require users to login before set up)

Preference testing

👉 55% of participants choose option 2 (111 participants in total)

👉 Majority of participants preferred minimal design (without the labels)

👉 Distinct colours for each bucket were preferable

👉 Participants preferred to see the full to-do list within the screen
"I like the more minimalistic way you implemented the Buckets area." (choose opt 2)

"I like the different colours for the buckets. Easier to see the different types." (choose opt 1)

"Now all four to dos are visible. It is better." (choose opt 2)

Final design

High-fidelity wireframes and interactive prototype with all needed design assets and guideline ready to be transferred to developers.

Design for desktop

Design style guideline

Wrap up

Working through the projects has challenged my thoughts and initial assumptions about the users' needs. Through each phase, doing constant research and tests where I interacted with users had contributed to my design solutions and increased my confidence when developing the prototype into higher complexity.

Demo video

Remaining challenges

Banking is a challenging business. There are still many challenges that must be addressed regarding banking policies and technical possibilities. Working closely with business strategists and developers from the beginning would help me develop a realistic solution when validated with further testing.

Future Directions

👉 Discuss with banking business experts and developers about the product’s realisability.

👉 Further test and validate/improve insights (statistics), especially the "8-month" view.

👉 Consider adding more options for money buckets, for example, set budgets for spending with specifics brands instead of categories.

👉 Find out and implement other useful features (weekly/yearly statistics, investment feature, etc.)

👉 Implement smart suggestions for personalised features and statistics based on users’ activities.

Lesson learned

👉 Be a listener, observer, and learner when doing tests/interviews with users to discover their behaviours, thoughts, and feelings toward the product.

👉 Be open-minded to better receive feedback and initiate solutions.

👉 Be decisive when deciding key information to be prioritised/displayed at each point of users’ journey.

👉 Know when to test and which method should be used for each design scenario.

👉 Realistic project needs balance between users’ goals and business goals.

Next project:

UX/UI Design, E-commerce

Want to get in touch?

Contact me at zoenguyenux@gmail.com
or drop me a line here:

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.