.webp)
Understand
I started by revisiting the brief I had created during the UX Research phase. This document included my recommendations as well as the competitive analysis of major booking platforms.
With these insights in hand, I could begin the design phase with a clear understanding of user needs and improvement opportunities, allowing me to focus on ideation and creating the experience.
Ideation
To frame the solution, I began by creating a sitemap, which gave me a clear overview of the app’s structure and the relationships between its main pages. From there, I translated the job stories into a user flow, illustrating how families would navigate through the booking journey. This helped me ensure that the experience was both coherent and aligned with real user needs.
Design
Wireframes
To create the wireframes in Whimsical, I looked at the sitemap, the user flow, and checked how competitors were doing things. It gave me an idea of what to expect from an accommodation booking platform, and some inspiration.
Visual design
I created a mood board (colors, typography, imagery) and designed high-fidelity mockups in Figma. The goal was to create a clean, trustworthy look, reassuring families that they could make the right choice.
I chose dark teal because it combines blue (trust, reliability) and green (growth, balance, authenticity), creating a calm and confident feel.
.png)
Test
Usability Testing
To achieve this, I conducted moderated, in-person usability tests, where participants completed three key tasks while I observed and took notes, gathering insights to improve the design.
Iterations
- Pricing clarity: Displayed both total price and per night price to avoid confusion.
- Activity icon update: Changed the generic person icon to a hiking icon (backpack & stick) for better clarity.
- Filter hierarchy: Adjusted the order from “Occasion, Price, Style, Activities available” to “Occasion, Style, Price, Activities available” as users associated Style with Occasion, which influenced price.
Prototype
