Currency Exchange

Currency Exchange Calculator - UX Interview Task

Introduction

Description

Currency exchange calculator for Desktop and Mobile helping users to easily search or change the currencies and amount



Project Duration

1

Weeks

5

App Screens

Client

Exness Company

Location

Malaysia

Role

Discover, Define, Design

Tools

Understanding the project

Problem
  • The user is confused between Desktop and mobile view
  • Preferred currencies are not expected for different users
  • Many steps to compare currencies
  • A massive list of currencies should be included
Solution
  • Usable interface from Desktop and Mobile
  • Main currency changes based on the user's location
  • Flexibility for changing the favorite currencies
  • Auto calculate the currencies price

Discover

In discover step:

I had 3 quick interviews with 3 users from different countries, Hong Kong, Malaysia, and Switzerland. I provided them a URL for the currency exchange I have git it in the task "Not available right now", to know the pain points.

1st user interview:

Moustafa Al Aswad

Accountant, Switzerland, 40 Years old

  • Born and live in Switzerland, Married, and have one kid
  • Working as an Accountant
  • Main currency: Swiss Franc CHF
  • Usually convert to CHF, EUR, and USD
  • Sometimes I want to search for a specific currency
  • Not really confused between 2 layouts from desktop and mobile, but the mobile view is not easy to use
  • I would like to compare between 5 currencies but no option for this on mobile.
2nd user interview

Ghada Samy

Designer, Malaysia, 35 Years old

  • Born in Egypt and live in Malaysia, Married and have 2 kids
  • Working as UI/UX Designer
  • Main currency: Malaysian Ringgit MYR.
  • Usually, convert to EGP and USD.
  • Confused because Desktop and mobile do not have the same options.
  • I want to reset the calculator but there is no option for that.
  • Why must I press Apply button to see the currency result? I feel not really helpful.
User Interview 3:

Cazey Tan

Digital Marketing, Hong Kong, 42 Years old

  • Born and live in Hong Kong, Married.
  • Working in Digital Marketing.
  • Main currency: Hong Kong Dollar HKD.
  • Usually convert to HKD and USD
  • No option to change any amount, Only can change the main currency
  • Mobile view is usable but does not have the same options on Desktop

Define

In define step, I’m trying to:

Creating one persona for all users to find the Needs and Goals and understand the pain points.

Persona

Moustafa, Ghada, Cazey

Accountant, Designer, Digital Marketing

Demographics

    35 to 42 years old

    Switzerland, Malaysia, Hong Kong

Behavior
  • Overseas and local online shopping
  • International money transfer
  • Investing on Cryptocurrency
Needs and Goals
  • Similar view for both Desktop and Mobile.
  • Comparing between 5 currencies at the same time at least.
  • Auto Calculate without clicking on Apply button.
  • Easy to reset the calculator
  • Change any currency amount not only the main currency
  • Easy to find any other currency
  • The main currency is determined based on my location. dedicated

Design

In develop step, I’m trying to:

Create a high fidelity with Interaction prototype and solve the users problems.

High-Fidelity Design for Desktop and Mobile.

In the example below I'm covering:
  • The top 5 currencies showing by default at the top based on user location
  • Users can search or scroll to view more currencies



In the example below I'm covering:
  • Adding an underline to all currencies amount to make the user feels this amount is editable to get more user engagement
  • Create a text style status "Hover, clicked"
  • Users can change any currency amount
  • All the other currencies amount calculated automatically once the user tries to edit any other amount
  • The user can reset the currency change calculator with one click



In the example below I'm covering:
  • The user can easily search for a specific currency and the auto result shows while typing
  • The user can search for currency by typing the Currency code or Country name for example "Swiss franc or CHF"



In the example below I'm covering:
  • Any currency can be changed
  • Added an arrow next to the currency flag to make the user feels that this is editable
  • Users can set their favorite currencies
  • The user can change the main currency as well by scrolling or searching manually
  • Auto result showing while typing
  • The user can search for currency by typing the currency code or Country name, for example: "Morocco or MAD"
Self-demo prototype for desktop
Try self prototype demo from here
Self-demo prototype for Mobile