Zeit Ecommerce Booking Site

Project Summary: For this project, I was tasked with branding a “time travel” company and building an e-commerce booking site.

Category: Web Design

Collaborators: Hailey Lemon

Dates: Mar 2022 - Apr 2022

My Role: UX Design, UI Design, Branding, Logo Design

Project Overview:

Zeit is a Virtual Reality resort and arcade focusing on making “time travel” accessible, safe, and unique. With experiences for every interest and age, Zeit is putting its focus on connecting people to amazing experiences despite the limitations of time.

Problem Statement:

💡

Traveling can be difficult and booking sites often lack information and a simple booking process, further complicating travel-related tasks.

Design Process:

This project utilizes the Design Thinking Process:

❤️ Empathize ✅ Define 💡Ideate ✏️ Design 📊 Test

Empathize Phase

During the research phase, the following goals were established:

Overall Goal: Design a site that is simple and familiar, yet provides adequate information and appealing branding.
Overall Research Goal: Determine what info users need to confidently use the service.

More specifically, I wanted to:

Understand who wants to time travel/use VR
Understand why people want to time travel/use VR
Understand the concerns and inquisitions
Find out how to make booking easy and accessible
Look at similar products to see what people like and dislike about their processes
Know how people feel about the product

Competitive Research

Because Zeit is a concept for a product that is the first of its kind, competitive research is limited. I found no direct competitors but did find several secondary and indirect competitors. These competitors included National Geographic Expeditions, AirBnB, Tripadvisor, and Space X.

What did they all have in common? They provide meaningful experiences through various mediums in an efficient and effective way.

Interviews

Virtual and in-person preliminary interviews focused on travel habits and booking experience. All participants traveled very differently, which gave me well-rounded insight for my project.

Key Insights

✈️

All participants value reliable and consolidated information as well as easy, stress-free, and efficient travel despite differing planning methods.

😁

High-level planning makes users feel less stressed.

👨‍👩‍👧

Most participants travel with family or friends, hardly ever alone, which impacts the way they plan and budget.

🏡

Participants are highly motivated to book when safety and surroundings info is provided.

💪

Confident booking occurs only when a lot of info is provided, along with the possibility to chat or call someone from the company. This includes company-based info as well as reviews.

Other Important Considerations

💖

Context of travel is often directly related to enjoyment: travel for leisure was less stressful and travel for work was more stressful.

💃

Participants like the process to be familiar and fun.

Define Phase:

Through my user interviews, I identified four main types of traveler personas: The Thrill Seeker, The Scholar, The Planner, and The Family Traveler. I focused on a realistic mixture of all these archetypes to build a persona and empathy map.

Ideation Phase

Sitemap

The ideation phase started with a sitemap that prioritized functionality, familiarity, ease of use, and efficiency in booking according to how my users previously defined these attributes. Just before developing this sitemap, I decided to conduct a card-sorting exercise to help establish the best course of action for site navigation.

Main Task Flow

In addition to the sitemap, I also planned out the main task flow, which was booking a package.

Sketches

After establishing the sitemap and task flow, I got right into sketching. I considered several different designs during this phase.

Logo & Branding

For the branding, I wanted to encompass both futuristic and familiar feels. I also wanted to keep a clean, simple interface to keep tasks easy to follow. My typography conveys a sleek, high-tech feel. My color palette is fun and friendly.

Design Phase

Wireframes

I narrowed down the designs I brainstormed during the sketching phase and made wireframes. I chose the designs that were most aligned with the project goals. At this time I did not choose to digitize the checkout flow because I was already very happy with my sketches.

The Final Product

After the wireframing phase, I moved into high-fidelity designing and prototyping. I then tested my prototype with users. The design was widely accepted among participants. Feedback included: easy to navigate, clean, simple, effortless, calming, and cool.

There was also a lot of great feedback that led to some changes in the design. This feedback told me there was a lack of communication to the user, not enough information to confidently book, and no transparency with the price. Using a priority matrix, I made changes to the design. Below is the finalized product. Enjoy!

Reflection

🔍

Research is important! This was my very first project, so I found the research phase to be very daunting. Through this project, I learned how to ask questions that helped me better reach my research goals. With each interview, I got more comfortable with interviewing participants and more honed in how to ask questions to reach research goals.

🕶️

Dark designs can be tricky. The desire for a futuristic feel led me to design in a dark mode. While this was a fun challenge, it was definitely a difficult one for my very first design.

👥

Broad statements can be difficult to work with. Similarly to the point about research, I found that establishing broad goals and terms is not helpful during the design phase. Sure, a design should be efficient and effective, but what does this mean for users? These terms are arbitrary until defined by the user.