ZEIT TIME TRAVEL TOURISM

Travel eCommerce Responsive Website

Overview

A case study on building a brand, and setting up an eCommerce responsive website in which ZEIT can sell travel packages to different times.

View high-fid prototype

COMPANY

ZEIT Time Travel Tourism
project developed for DesignLab

YEAR

2018 (August)

PROJECT DURATION

80 hours

MY ROLE

User Research, IA, Interaction Design, Prototyping, Usability Testing, UI Design, Branding

TOOLS USED

Sketch, Adobe Illustrator, Adobe Photoshop, InVision, Zepplin

The Challenge

ZEIT, a subsidiary of Richard Branson’s Virgin empire has been able to make time travel tourism available to all.

A total of 289 destinations selected based on safety are available to receive people at any moment. ZEIT asked to create a logo and a responsive eCommerce website through which they will present their travel packages to different times in the past and users can easily find, learn and book their ticket.

The process

RESEARCH

Competitive Analysis
Primary Research
Sythesize User Personas

DEFINE

Card Sorting
Sitemap
User & Task Flows
Feature List

DESIGN

Wireframes
Low-fidelity Prototypes
Mood Board
Brand Style Guide
Logo Design
User Interface Design

REFINE

Usability Test
Usability Test Findings
Affinity Map

Research

1-TO-1 INTERVIEWS

Lead 1-to-1 Interviews to find out more about users’ demographics, needs and pain points of people that search for alternative types of traveling how we can improve their online booking experience.

MARKET RESEARCH

Read and gather information about travel trends, online travel booking and time traveling (opportunities, dangers etc.). Search for indirect competitors such as space traveling websites and websites offer alternative types of traveling, to define their strengths and weaknesses.

Goals

Collect information about the traveling habits people have and their previous experiences.

Discover more about travelers' goals, pains, and frustrations in booking a trip online and/or offline.

Determine if people are positive in time travel in the past and which are their concerns about a trip like this.

Collect information about the potential travelers and determine ways to establish trust.

1-to-1 Interviews

Three men and two women between 36 to 47 years old were interviewed for the needs of my research.

Participants were frequent travelers, who spend an average of 3.5 hours per day, excluding working hours, browsing the internet, they use several devices for this reason and they tend to book a trip online while they are at home.

PAIN POINTS

Trust the website they will book a trip back in time.
Return back safe.
Hidden fees.

NEEDS

Images and detailed information about travel packages.
Read reviews and testimonial.
Easy access to the trip information and to contact for further information if necessary.
Get offers and discounts.

DESIRES

Meet new places, people and cultures.
Live one of a lifetime experience.
Search alternative types of travel.

Personas & Empathy maps

Storyboards

The next step, after creating ZEIT's user personas and empathy maps, was to create the storyboards.

By sketching storyboards based on user stories, I created another handy tool to present additional context. Storyboards helped me to empathize deeper with the potential ZEIT users since I was able to transmit their stories through chronologically arranged images that reflected their main events.

Information Architecture

Since time travel has never been available before, it was necessary to discover an easy and understandable way to build the main navigation of the website. For this purpose, I ran an online card sorting study to see how users intuitively will organize ZEIT trips. The results helped me build a sitemap and get a more concrete sense of the website's structure.

Eleven participants completed this study in an average time of 13.93 min. Based on the PCA results of the most preferred groupings, I came up with the following categories: Eras & Empires, Major Events, Art & Music and Architecture.

Task & User Flows

Brand Identity

About the Brand ID, the brief asked for a combination of modern, classical and historical. My goal about the ZEIT brand identity was to create a modern and futuristic website since, even though ZEIT will sell time travel packages to the past, it will be a product based on high technology and science. Typography, color palette, and photography should match with this look and feel.

I began my research in Google, searching about different kinds of time instruments from the past like sundial watches, astronomical clocks, and hourglasses. After several sketches and iterations, I came up with a logo based on an hourglass-shaped "Z" simple yet elegant and modern.

Low & Medium Fidelity Wireframes

At first, I started by sketching wireframes for the homepage's layout to brainstorm and then I proceed with the medium-fidelity wireframes,

While creating the wireframes I always had in mind the previous user research, the core navigation and the user flows while my first priority was whatever I design in desktop version to be easily adaptable to any other screen dimensions.

View mid-fid prototype

User Interface Design

ZEIT's UI Design is focused on aspirational imagery while maintains the modern typography and color palette of the already designed brand ID.

In order to improve my workflow and be consistent in the website's look and feel, I designed a UI kit using Sketch. I then proceed with the implementation of all the key elements and the creation of new ones always based on the primal guidelines.

All these elements were used to build all the needed desktop screen for the high fidelity prototype. This would be the prototype I was planning to use in the usability testing sessions.

Usability Test Results

Using the high fidelity prototype, I conducted 5 user testing session both in person and remotely using Skype screen sharing.

Participants were 3 men and 2 women between 37 to 47 years old. They were all professionals with high education, frequent travelers and familiar in browsing the internet. Within the variety of scenarios, their main task was to navigate in the ZEIT experience categories, find an adventure and after spending some time to have a complete idea of the content I asked them to complete the whole booking process.

Through this usability test, I aimed to evaluate how the users interact through the ZEIT website and how easily they can complete their tasks. At the same time, I wanted to identify any pain point, potential improvements on the provided information, design and flow.

View high-fid prototype

Next Steps

Working on the ZEIT project was really exciting and challenging. I gained a lot of experience trying to search for solutions and get insight into a non-existing product with such limitations. At the same time, all this work wasn’t a result of teamwork but of one only person in a really short time period.

My next steps for this case study would be to:

Conduct a usability test on the high-fidelity prototype and check if the solutions I gave after the first usability test are effective.
Conduct another research to define which extra features and tools would be helpful for ZEIT's target audience.

Say Hi!

Find me also at...

If you have any questions or you would like to work together, you can either email me at thehmux[at]gmail.com or use the contact form.