CURRENCY CONVERTER (COMPERE)
A UX CASE STUDY
IntroA SIDE PROJECT
|
DurationAugust 2019
|
TaskInterviews, Competition analysis, sketch, User Flows,
prototype, visual design |
ToolsFIGMA
PEXELS BURST |
APPROACH
|
Quick Overview
COMPERE is a web browser extension that makes it easier for user browsing a website in foreign countries to see the prices in their local currencies, they're also able to compare or convert this prices right there on the home page without having to leave.
It's a side project i came up with after discovering how stressful it can be to convert foreign prices to my local currency. There has to be another way, I conducted interviews with users in my specified target audience to validate my assumptions on how they were already solving this problem, next i came up with several ways/methods to make the process simpler, designed a simple UI and prototyped the interaction/user flow.
It's a side project i came up with after discovering how stressful it can be to convert foreign prices to my local currency. There has to be another way, I conducted interviews with users in my specified target audience to validate my assumptions on how they were already solving this problem, next i came up with several ways/methods to make the process simpler, designed a simple UI and prototyped the interaction/user flow.
Project Inspiration/ Problem Statement
I was browsing an e-commerce store on a random day and without thinking too much about it, I checked for the price in Naira (my local currency) as I always do.
I'd either just open a new tab and type the amount in dollars and that it should be converted to Naira and get my result directly from google, I knew it wasn't completely accurate but I used that as an estimate just to have an idea on the cost.
It's either that or I check for the current rate and then use a calculator to calculate it.
To be honest, this wasn't a bad approach and I didn't mind much because I knew this was an international website and was well aware that the prices won't be displayed in my local currency. I am grateful for websites that provide the prices in my local currency, it makes it super easy but, not all websites do this.
Ux for me is more than preventing issues or fixing them while making sure the customer is satisfied, it also among many others is about improving and making better existing experiences. Personally, whenever I go through an experience that isn't so great I make a mental note of my process and try to figure out what the issues were, how it made me feel and how I responded to it. I also, watch to see if others have similar experiences as well as watch out for their reactions or ask questions.
In this case, this is about improving on an already existing problem, one that people do not seem to mind as they have found ways to deal with it, here I'm just proposing another way that is more pleasant and effective. I'm also assuming that people converted prices the way i do.
I'd either just open a new tab and type the amount in dollars and that it should be converted to Naira and get my result directly from google, I knew it wasn't completely accurate but I used that as an estimate just to have an idea on the cost.
It's either that or I check for the current rate and then use a calculator to calculate it.
To be honest, this wasn't a bad approach and I didn't mind much because I knew this was an international website and was well aware that the prices won't be displayed in my local currency. I am grateful for websites that provide the prices in my local currency, it makes it super easy but, not all websites do this.
Ux for me is more than preventing issues or fixing them while making sure the customer is satisfied, it also among many others is about improving and making better existing experiences. Personally, whenever I go through an experience that isn't so great I make a mental note of my process and try to figure out what the issues were, how it made me feel and how I responded to it. I also, watch to see if others have similar experiences as well as watch out for their reactions or ask questions.
In this case, this is about improving on an already existing problem, one that people do not seem to mind as they have found ways to deal with it, here I'm just proposing another way that is more pleasant and effective. I'm also assuming that people converted prices the way i do.
GOAL
My goal and the aim of this case study is to come up with an easy and simple way to convert prices in foreign currencies to local currencies when browsing an e-commerce website.
Solution
A browser extension that makes it easier for user browsing a website in foreign countries to see the prices in their local currencies.
Target Audience
People who surf websites with prices in foreign currencies. However, for this case study, i limited my scope to e-commerce websites and residents of Nigeria
My Approach
Interviews
I conducted an informal interview over whatsapp with people i considered as part of my target audience. I needed to validate my assumptions about how people were already solving this problem. I asked four questions;
1) When you browse websites with prices in foreign currencies, how do you convert to Naira?
majority of the responses i got showed that people did this using google which prompted me to ask my next question
2) Do you care about the correct exchange rate or an estimate is just fine.?
I asked this because the exchange rates google gives differs from those given by other websites.
some of the participants cared about having a correct exchange rate, others agreed that an estimate would be fine
For those who said they cared i went on to ask
3) How do you get the exchange rates?
i wanted to know what sources to look to, to get this information
4) Do you think having to google the exchange rate disrupts you flow when browsing or you don't care about that?
I wanted to see how much the users cared about the current way they were solving the problem and how much effect it had on them. I also let them know that i was assuming they had to open a new tab to do the exchange and then return to the website to continue browsing. To this, all of my interviewees responded positively. However, about 90% of them didn't care much about the interruption.
1) When you browse websites with prices in foreign currencies, how do you convert to Naira?
majority of the responses i got showed that people did this using google which prompted me to ask my next question
2) Do you care about the correct exchange rate or an estimate is just fine.?
I asked this because the exchange rates google gives differs from those given by other websites.
some of the participants cared about having a correct exchange rate, others agreed that an estimate would be fine
For those who said they cared i went on to ask
3) How do you get the exchange rates?
i wanted to know what sources to look to, to get this information
4) Do you think having to google the exchange rate disrupts you flow when browsing or you don't care about that?
I wanted to see how much the users cared about the current way they were solving the problem and how much effect it had on them. I also let them know that i was assuming they had to open a new tab to do the exchange and then return to the website to continue browsing. To this, all of my interviewees responded positively. However, about 90% of them didn't care much about the interruption.
Conclusion from Interview
From my interviews i was able to validate that my assumptions about the way people convert foreign currencies were right and so decided to go ahead with implementing the proposed solution.
Initial Approach (New Page)
Because I was surfing the shop on my laptop, I decided to come up with a browser extension one which when installed would appear on every website and right next to the price as an icon I came up with the following flow
ASSUMPTIONS : The user has already gone through the download and Installation process.
STEP 1: The user clicks on the icon, it opens a page where the user can see the price
STEP 2: User clicks on the cancel Icon to return to the main page
ASSUMPTIONS : The user has already gone through the download and Installation process.
STEP 1: The user clicks on the icon, it opens a page where the user can see the price
STEP 2: User clicks on the cancel Icon to return to the main page
Challenges / Concerns
The issue I had with this was first how to present the information, there wasn't much to show to the user apart from the price in their local currency and the ability to see the current exchange rate and the prices in other currencies. Also opening another page would distract the user and interrupt the flow
another thing I had to consider was areas will low internet connectivity, opening another page meant to give users the price in their local currencies and then encountering an error due to connectivity might backfire and make the experience much more frustrating, in the worst-case scenario, the user might disable the extension.
another thing I had to consider was areas will low internet connectivity, opening another page meant to give users the price in their local currencies and then encountering an error due to connectivity might backfire and make the experience much more frustrating, in the worst-case scenario, the user might disable the extension.
Pivot
Because the aim of this project is to come up with a better way of coverting the currencies, i had to make changes to my approach
Second Approach (Pop-Up)
The next flow I came up with was this.
ASSUMPTIONS : The user has already gone through the download and Installation process.
STEP 1: The user hovers on Icon and a tooltip explaining what it does comes up
STEP 2: The user clicks on the icon and a pop up showing the user's local currency, exchange rate and option to check costs in other currencies as well
STEP 3: The user clicks on the cancel Icon to return to the main page
ASSUMPTIONS : The user has already gone through the download and Installation process.
STEP 1: The user hovers on Icon and a tooltip explaining what it does comes up
STEP 2: The user clicks on the icon and a pop up showing the user's local currency, exchange rate and option to check costs in other currencies as well
STEP 3: The user clicks on the cancel Icon to return to the main page
Challenges / Concerns
This did seem like a better option than the first given that the user did not have to leave the page, it is much easier for a pop-up to load but I wasn't quite sure it was the solution I was looking for. I needed something seamless that wouldn't interrupt a lot of activities.
Third Approach (Slide-Left)
Instead of a pop-up, it was more like a roll-out or a slide-out-left
ASSUMPTIONS : The user has already gone through the download and Installation process.
STEP 1: The user hovers on Icon and a tooltip explaining what it does comes up
STEP 2: The user clicks on the Icon, the price in their local currency rolls-out (if the user wants to see more information he can then click on more)
STEP 3: The user scrolls up or down and the text rolls back in or the user clicks on the Icon and the information rolls back in.
(He also has the option to pin the information(converted price))
Of all the processes/approach I came up with this was my favorite but as I interviewed my brother another idea came to mind
ASSUMPTIONS : The user has already gone through the download and Installation process.
STEP 1: The user hovers on Icon and a tooltip explaining what it does comes up
STEP 2: The user clicks on the Icon, the price in their local currency rolls-out (if the user wants to see more information he can then click on more)
STEP 3: The user scrolls up or down and the text rolls back in or the user clicks on the Icon and the information rolls back in.
(He also has the option to pin the information(converted price))
Of all the processes/approach I came up with this was my favorite but as I interviewed my brother another idea came to mind
Fourth Approach
Instead of having to click on the Icon to see the price in the user's local currency, the extension when enabled uses the users' location to determine the local currency and then asks for permission from the user to automatically convert all prices.
An Icon still appears next to the prices
ASSUMPTIONS : The user has already gone through the download and Installation process.
STEP 1: The user click on the Icon and it rolls-out it showing the original price and currency as well as the exchange rate.
STEP 2: The user scrolls up or down and the text rolls back in or the user clicks on the Icon and the information rolls back in.
An Icon still appears next to the prices
ASSUMPTIONS : The user has already gone through the download and Installation process.
STEP 1: The user click on the Icon and it rolls-out it showing the original price and currency as well as the exchange rate.
STEP 2: The user scrolls up or down and the text rolls back in or the user clicks on the Icon and the information rolls back in.
Pivot Again ?
Opps, I missed out on a couple of things and that didn't necessarily change my approach, but it's information i didn't have at the beginning which had the potential to
Competition Analysis
Given that this was a project i've had for a while but put off until now, i was working with some prior assumptions one of which i believe is important but failed to validate at the start.
The assumption? : "There are no browser extensions built to tackle this problem". I was wrong.
New Findings
From my research, I discovered that were in fact three other browser extensions developed to solve this problem. So, I installed them a gave them a run.
However, all extensions required the user to manually input the price as well as choose the currency they want to convert to an option I wanted to eliminate to make the process as seamless as possible
The assumption? : "There are no browser extensions built to tackle this problem". I was wrong.
New Findings
From my research, I discovered that were in fact three other browser extensions developed to solve this problem. So, I installed them a gave them a run.
However, all extensions required the user to manually input the price as well as choose the currency they want to convert to an option I wanted to eliminate to make the process as seamless as possible
Here's what i learned from this working on this case study
It can be very easy to see things from a certain point of view which is why I strongly believe that designers shouldn't work alone.
When I first approached this problem I was trying to find a way to prevent the user from leaving the current tab and as the inspiration came I was hooked on the idea of how best to convert the price manually.
Working on this project reinforced the importance of working in a team, i also learned to take a break from the solution and discuss the problem with the colleagues (developers and designers) as it was while I was discussing with my brother that the idea of converting the whole page automatically came to mind, ironically I have browsed websites that did this and had quite a good experience but it skipped my mind.
It also re-enforced the importance of the technical know-how as it helps to come up with solutions that can be implemented.
Lastly, i learned to test/validate ALL assumptions, although i didn't have to make any changes. It is much safer to test/validate all assumptions.
When I first approached this problem I was trying to find a way to prevent the user from leaving the current tab and as the inspiration came I was hooked on the idea of how best to convert the price manually.
Working on this project reinforced the importance of working in a team, i also learned to take a break from the solution and discuss the problem with the colleagues (developers and designers) as it was while I was discussing with my brother that the idea of converting the whole page automatically came to mind, ironically I have browsed websites that did this and had quite a good experience but it skipped my mind.
It also re-enforced the importance of the technical know-how as it helps to come up with solutions that can be implemented.
Lastly, i learned to test/validate ALL assumptions, although i didn't have to make any changes. It is much safer to test/validate all assumptions.
Next steps
Thank you for reading.
Since this is a work in progress, i am currently undergoing user testing to determine which approach works best for the users and why.
I will update as soon as I have my results.
Since this is a work in progress, i am currently undergoing user testing to determine which approach works best for the users and why.
I will update as soon as I have my results.
Credits
Header Background Image Business vector created by rawpixel.com - www.freepik.com
Site powered by Weebly. Managed by Porkbun