ABOUT THE PROJECT
GOplaces is the mockup project I worked on during the User Experience Design course at General Assembly / London.
This is my first UX project following the design process stages, from ideation to solution.
The web app simplifies travel planning by providing personalised recommendations for the perfect time to visit any destination. With an intuitive and user-friendly design, my app helps travelers say goodbye to endless research and hello to stress-free travel planning.
TOOLS // Sketch · InVision
PROBLEM STATEMENT
Help travellers find the perfect time to visit anywhere in the world. The goal is to have access to a resource that allows people to easily plan their holidays.
COMPETITIVE ANALYSIS
Analysing these websites, both on desktop and mobile, helped having insights on the industry and identifying possible market gaps.
USER RESEARCH & FINDINGS
5 interview subjects - Age > 25-35 - Different backgrounds, but they all travel a lot.
The main direct competitors emerged following the user interviews. Yet, it seems some of them still prefer offline resources, as travel guides and online blogs as first reference.
Tips and recommendations from friends and colleagues are valuable to them
Enjoy researching information and planning their own trips
It’s difficult to plan holidays and pick the best time to visit because of the amount of information online
AFFINITY MAPPING
Here’s a list of the main themes emerged from the user interviews. This is an insight to the traveller's habits and motivations, when it comes to search a possible destination to visit:
Motivations
Habits
Resources used
Perception / trust (travel agents, influencers, friends)
Frequency of travels
USER PERSONA
USER EXPERIENCE MAP
This step involves a deeper understanding of the user feelings and emotional experience.
When the traveller is ready to plan a trip, the most critical moment seems related to the online search. They start exploring online resources and comparing destinations, feeling overwhelmed.
STORY BOARDING
USER FLOW
Andrea wants to find the best time to visit a specific destination, without extensive online searches. Here’s a potential user flow, following the user’s happy path. Visit the website, select the preferred search method, explore the results and pick a final destination to visit.
PAPER SKETCHES - USER FLOW
These paper sketches presents the user flow when clicking the “Browse locations” button. The user is able to gradually navigate through the screen, before landing on the city page. On this final page, the information is presented in a bar chart. This allows to compare the months of the year and the average temperature at a glance.
Paper sketches user flow - Browse locations
ITERATION #1
The homepage (left) features an open search field, a “Search by month” and “Browse locations” buttons
When searching by month (center), the destinations were listed alphabetically, below a “Top Picks” section. These were the top 3 destinations to visit, based on other travellers' choices.
The city specific page (right) presented a bar chart showing the “Best” or “Good” period to visit. There’s also a section with the average temperatures and a button to save the destination as future reference.
USABILITY TESTING FINDINGS
Conducted 5 user tests using the mid-fidelity prototype. 5/5 completed the tasks and were able to navigate without too many issues. Here’s part of the most interesting feedback emerged:
Next / Previous / Skip buttons were missing on the on-boarding
The Best / Good Period sections on the city specific page were not clear. Is it the best period for weather conditions, high season, or value for money?
A list of events / experiences related to a specific city would help to make a final decision. (i.e. Summer festivals, Cherry blossoms in Japan, Northern lights...)
The open search field on the homepage caused hesitation. The users were quite sure this was the only way to access other screens and continue the navigation.
When searching by month, avoid displaying destinations in a long scrolling list. A better option would be displaying 3/4 results at a time.
Display each month as a full name. The reason is that the one letter month abbreviations, used on the city specific page, resulted confusing (J, F, M, A…)
ITERATION #2
During the usability testings, the open search field on the homepage (left) resulted confusing. The users thought this was the only way to search and access the information. For this reason, the open field was turned into a “Search by city” button.
The “Search by month” / “Top Picks” (center) screen was redesigned using an “How about?" sorting card functionality, to create a more engaging experience. This allows users to gradually display results when clicking on the “Show more'“ button.
The biggest change was made on the city specific page (right). Each month is now displayed using its full name. Also, the good/best periods are now associated to high, shoulder and low seasons. This helps the user to compare and pick the best month to visit a city.
STYLE
COLOUR PALETTE & CTA BUTTONS
