XCHANGE ASSISTANT

Exchange currency app concept - test task for joining Toptal.com

APP CONCEPT, UX/UI

The utmost important part of the recruitment process at Toptal is the test task. Having successfully gotten there, after a couple of interviews, I got the briefing: design an app that would show a traveler the lowest currency conversion rates available within a determined area by pulling data from conversion sites and comparing it with what’s locally available.

The utmost important part of the recruitment process at Toptal is the test task. Having successfully gotten there, after a couple of interviews, I got the briefing: design an app that would show a traveler the lowest currency conversion rates available within a determined area by pulling data from conversion sites and comparing it with what’s locally available.

The utmost important part of the recruitment process at Toptal is the test task. Having successfully gotten there, after a couple of interviews, I got the briefing: design an app that would show a traveler the lowest currency conversion rates available within a determined area by pulling data from conversion sites and comparing it with what’s locally available.

My Approach

Even though this is only a hypothetical product, I decided to think about it from a business standpoint - how could this be more than just another pretty currency conversion app that would be uninstalled after just a few uses? Creating personas was the key to coming up with ideas on how to increase retention. By questioning what possible users might want and need I was able to create features I wouldn’t have thought of otherwise.

persona_1
persona_2
persona_3
User Flows and Lo-fi Wireframing
User Flows and Lo-fi Wireframing

The proto-personas exercise (along with benchmarking) gave me an idea of the features the app could have. I then sketched user flows and very lo-fi wireframes so I could have a visual idea of how they could actually work.

The proto-personas exercise (along with benchmarking) gave me an idea of the features the app could have. I then sketched user flows and very lo-fi wireframes so I could have a visual idea of how they could actually work.

The proto-personas exercise (along with benchmarking) gave me an idea of the features the app could have. I then sketched user flows and very lo-fi wireframes so I could have a visual idea of how they could actually work.

4_xchance_assistant_sketches
Art Direction

At the same time I was iterating on the wireframes I started to think of an art direction for the app. I gathered examples of similar apps and products but also from inspiring projects that I believed could help me get to an aesthetics I liked and made sense for the project. Based on that, the concepts of Clean, Personal and Trendy came up as a way of describing the look and feel I wanted for the UI. I kept these 3 concepts nearby when designing the UI as it helps me focus.

At the same time I was iterating on the wireframes I started to think of an art direction for the app. I gathered examples of similar apps and products but also from inspiring projects that I believed could help me get to an aesthetics I liked and made sense for the project. Based on that, the concepts of Clean, Personal and Trendy came up as a way of describing the look and feel I wanted for the UI. I kept these 3 concepts nearby when designing the UI as it helps me focus.

At the same time I was iterating on the wireframes I started to think of an art direction for the app. I gathered examples of similar apps and products but also from inspiring projects that I believed could help me get to an aesthetics I liked and made sense for the project. Based on that, the concepts of Clean, Personal and Trendy came up as a way of describing the look and feel I wanted for the UI. I kept these 3 concepts nearby when designing the UI as it helps me focus.

At the same time I was iterating on the wireframes I started to think of an art direction for the app. I gathered examples of similar apps and products but also from inspiring projects that I believed could help me get to an aesthetics I liked and made sense for the project. Based on that, the concepts of Clean, Personal and Trendy came up as a way of describing the look and feel I wanted for the UI. I kept these 3 concepts nearby when designing the UI as it helps me focus.

5_xchance_assistant_art_direction
Not So Lo-fi Wireframes and User Testing

As a way of quickly testing ideas, I did some basic prototypes using Craft and Invision on Sketch and asked people to test them as I iterated.

Some ideas were ditched - such as the trip planner which would help users know how much money they would need based on their ideal lifestyle for a trip, its duration and general cost of living on the destination (data pulled from dedicated websites) - that seemed way out of place and too complex.

As a way of quickly testing ideas, I did some basic prototypes using Craft and Invision on Sketch and asked people to test them as I iterated.

Some ideas were ditched - such as the trip planner which would help users know how much money they would need based on their ideal lifestyle for a trip, its duration and general cost of living on the destination (data pulled from dedicated websites) - that seemed way out of place and too complex.

6_xchance_assistant_wireframe_1
7_xchance_assistant_wireframe_2
8_xchance_assistant_wireframe_3
user_testing_feedback

* User testing feedback

* User testing feedback

Other ideas were born - a bot that gives users the info they ask for in an easy-going language, free of jargon most do not understand. It would be like engaging in a conversation with someone neutral who wouldn’t try to fool you or hide information from you in order to profit.

10_xchance_assistant_wireframe_4
11_xchance_assistant_wireframe_5
12_xchance_assistant_wireframe_6
UI Design
UI Design

I tested this idea, it seemed to work and it answered the briefing successfully. It was time to wrap up and transform those unattractive wireframes into a cool user interface. Every design element - the bot illustration, the colors, the fonts and so on - were decided based on the concepts defined earlier: Clean, Personal and Trendy.

13_xchance_assistant_initial_mocks
14_xchance_assistant_chat
15_xchance_assistant_chat
16_xchance_assistant_chat

The Bot suggests questions and actions to guide the user through the conversation. 
It communicates in a clear and understandable way that inspires trust.

The Bot suggests questions and actions to guide the user through the conversation. 
It communicates in a clear and understandable way that inspires trust.

17_xchance_assistant_best_deal
18_xchange_app_all_deals

ALL DEALS

ALL DEALS

ALL DEALS

ALL DEALS

ALL DEALS

When asked to show all deals the bot shows a screen where it’s possible to change the amounts, currencies and the default radius or enter a new location and get directions to the agencies on a map with the users' preferred navigation app.

When asked to show all deals the bot shows a screen where it’s possible to change the amounts, currencies and the default radius or enter a new location and get directions to the agencies on a map with the users' preferred navigation app.

When asked to show all deals the bot shows a screen where it’s possible to change the amounts, currencies and the default radius or enter a new location and get directions to the agencies on a map with the users' preferred navigation app.

When asked to show all deals the bot shows a screen where it’s possible to change the amounts, currencies and the default radius or enter a new location and get directions to the agencies on a map with the users' preferred navigation app.

When asked to show all deals the bot shows a screen where it’s possible to change the amounts, currencies and the default radius or enter a new location and get directions to the agencies on a map with the users' preferred navigation app.

QUICK CONVERSION TOOL

QUICK CONVERSION TOOL

QUICK CONVERSION TOOL

QUICK CONVERSION TOOL

QUICK CONVERSION TOOL

This simple feature aims to keep the app from being obsolete after users use it to exchange currency. It may be the difference between being forgotten/uninstalled or being present during the users' trip, increasing retention.

This simple feature aims to keep the app from being obsolete after users use it to exchange currency. It may be the difference between being forgotten/uninstalled or being present during the users' trip, increasing retention.

This simple feature aims to keep the app from being obsolete after users use it to exchange currency. It may be the difference between being forgotten/uninstalled or being present during the users' trip, increasing retention.

This simple feature aims to keep the app from being obsolete after users use it to exchange currency. It may be the difference between being forgotten/uninstalled or being present during the users' trip, increasing retention.

This simple feature aims to keep the app from being obsolete after users use it to exchange currency. It may be the difference between being forgotten/uninstalled or being present during the users' trip, increasing retention.

19_xchange_app_quick_conversion_tool
20_xchange_app_possibilities

The possible interactions with the Bot are endless.

The possible interactions with the Bot are endless.

Whether you need an MVP or you want to take your project to the next level, get in touch:

hey@priscila.pt

Whether you need an MVP or you want to take your project to the next level, get in touch:

hey@priscila.pt

Whether you need an MVP or you want to take your project to the next level, get in touch:

hey@priscila.pt

Whether you need an MVP or you want to take your project to the next level, get in touch:

hey@priscila.pt

Whether you need an MVP or you want to take your project to the next level, get in touch:

hey@priscila.pt