Method
The method that I followed is made by four simple steps:
User research: interview & user story
decided to test trivago.com platform on four different potential customers, leaving them to be free to browse through the service. I examined their behavior using the list section and the map section. On the map section I tried get as much as possible information ask them to find the hotel suitable for their travel and book it. I did the test three time each person to understand the different user-flow stages and if they are able to use lots of Trivago map features. I asked them if they encountered any difficulties in using the map, what could be heplful to improve the user-friendly experience.
The simple test were helpful to understand better which are the main common issues of the service and which are the areas to work for the usability, UX and UI improvments.
General main painful points:
Label colours, Map graphic style, Hierarchy of the information, Too much step between the listing page and map, Information about the travel time between the differnt attraction/service, Confusion between the company icons and standard google map icons, Keep under control the selected filtes.
Competitors research
I did an inspiration research identifying the main trivago competitors and I focused my work on the options that the competiors tried to work out on my same painful points.
Analysis of the platform
I studied the characteristics of the map and which elements can help tourists when they would choose a hotel for their trip. I have identified the main issue, unnecessary information and design problems that divert customers' attention. This analysis comes from the test results, the competitior analysis and my personal design assessment.
Sketch & idea
As a creative and UX/UI designer I started to get ideas using pen and paper. I can understand how should the project appear defining the main guide style line, the user flow and the first layout to follow during the design stage.
Design process
During the design process I worked out on the User Experience and User Interface solution for the painful points came out the research stage. I focused to create a responsive layout for wide and mobile screens and cohesive visual language. The target is to improve the usability and accessibility of the hotel information studing the interaction between the customers and the platform. I changeed the position of the elements, adding the important information for the users and ruling out the unnecessary one.
Mobile version
The best practice is to develop the project for mobile users.
Header filter
The current link to change the destination, travel dates and the number of the guests is well hide and while I was testing the platform I noticed that the potential stakeholder found very hard the right link to do it. Most of the time they came back to the listing page. I thought to put on the header the destination search bar, check-in check-out input and the number of the guest. The customers can change the main travel details in one step. This solution resolves the problem to open an hide link, helping the users to change their destination or travel dates or the number of guests. In some case it is possible to change the header for a special section of the website but it is also a hard challenge and change for entire user experience and user interface of the Trivago platforms.
Technology research
Goole Maps APIs is a google support for Designer and Developpers which offers the full documentation and tutoriar to customise the google map. It is possible to create the own personal map by coding and use it for different application, platform, website. I created an essencial and simple map for this project using Google Maps APIs Styling Wizard, a quick way to generate a JSON styling object.
