Bon Voyage

UX & UI Design for a travel app

Client

Bon Voyage

Timeline

6 weeks

Tools

Sketch

InVision

Deliverables

Competitive research wireframes
moodboards 
logo design
high-fidelity mockups prototype

 

Overview

The Brief

Bon Voyage is an app that provides information and recommendations about where people can go and what to see in different cities around the world. To create this app, I applied user research to determine what the product should do and practiced user-centered design to create the best experience possible.

 

Role

I was the sole UX & UI Designer for this project under the guidance of a design director from Flatiron.

Our Process

I used the Stanford Design Thinking process throughout this project. Design thinking is a methodology for creative problem solving.

design process.png

Stanford Design Process

Understanding our Audience

User Interviews

I was supplied with three user interview transcripts from which to pull insights from in order to construct a persona for the target audience. 

 

The Target User

David is a Graphic Designer whose vacation time and funds are limited, so he strives to use his time as efficiently as possible. 


He prefers to plan his travel himself because he has been let down in the past when others take charge, however he prefers to share and collaborate on his travel plans so everyone has a good time. 


He uses his phone often to look up restaurant and event options and expects the information he finds to be up-to-date and reliable. 

young-man-on-cruise-ship.jpg

"I want to plan a trip with my friends that I know we’ll all enjoy."

The Core Problem

The efficient millennial traveler needs a simple way to collaboratively plan and edit trips amongst friends and/or family because they want to minimize the amount of time wasted during a vacation trying to adjust plans and coordinate with others.

 

Exploring Ideas

Ideation

I like to approach my ideation by sketching the features my user is asking for by putting myself in their place:

  • would I enjoy using the feature

  • what actions I would want to take

  • what I want the app to be able to do for me

  • what was frustrating when I reviewed competitors’ apps

  • where are my opportunities for innovation

Once I have sketched a few ideas across various sections of the app, I take some time to ask people similar to my target user whether they would want to interact with these features in order to select the best options from my ideas.

ideation.jpg

Some concept sketches

 

Paper Prototype

After testing  the concepts to users, I compiled my ideas and sketches to present to the design director  so we could determine which ones would be the best to move forward with into prototyping. These concepts centered around social networking and collaborative event planning, both of which help solve the target user’s needs. 

Paper prototype sketches

Wireframes

Once I felt confident in the general design direction I moved into creating wireframes. The creation of wireframes can spark ideas on how to improve early concepts while also revealing the challenges that often occur with novel concepts. For these wireframes I wanted to ensure everything on screen felt appropriate and in its  right place. Through a combination of competitive research and rounds of feedback I feel I was able to ultimately accomplish my goals in this phase.

Wireframes

Improving the User Experience

Visual Exploration

Once the wireframes were completed I moved into the visual design phase. I created divergent mood boards. One of the two most promising was based on vintage travel posters and the other used a clean, modern aesthetic. 

I’ve always had a personal passion for visual design as I get to make things feel like they are coming together to form a fully-fledged product. During this project I often had to rely on my own sensibilities without access to a user base, but luckily in this case the target user was similar to me in many ways. I felt that building a relationship between the user and the app was important, so I focused on designing moodboards that conveyed a friendly and inviting atmosphere. 

Mood boards

 

UI Design

I took the mood boards and extended them onto one of the wireframes to get a feel for what the app would look like in each style. While both received positive feedback, I ultimately decided on the vintage travel poster theme. I felt that it gave the app more personality and was more memorable. 

Vintage v2.png
clean v2.png

Style tiles

Solution

Final Visual Design