The Problem
With all of the world to explore, Zeit is taking travel to the next level by inserting time as a filtering option when planning your next trip. Zeit is a time travel tourism company that facilitates travel to 289 destinations all over the world from prehistoric times through today. 
Zeit need a site that could support booking travel to these destinations that would incorporate a welcoming aesthetic and facilitate smooth interaction for users, regardless of their device.
The Solution
The solution Zeit was looking for was to establish an identity for the company, and create a fully responsive site for booking travel. 
Role
UX designer, UX researcher, and visual designer. I worked independently with feedback collected from peers and mentor.
Client
Zeit*
Tools
Adobe Xd, Optimal Sort, InVision Freehand, Zoom, Adobe Illustrator
View tasks being completed within the Zeit site prototype.
*This is a speculative project. Zeit is a fictional company.
Market Research
I conducted market research online to identify patterns for booking travel and managing trips with specific interests.​​​​​​​
Research focused on identifying:
• Travel safety concerns
• Key demographic focus areas
• Opportunities for optimized travel experiences
• Interest levels for various package types
Provisional Personas
Using my market research I was able to develop provisional personas that would allow me focus my recruiting efforts toward expected users of the Zeit site.
Competitive Analysis
The competitive analysis identified established norms and common pain points. With this awareness I would be able to avoid those pain points and make improvements to the current state of travel offerings.
User Interviews
To gauge interest in time travel I conducted 1-on-1 user interviews with participant interested in traveling using currently existing methods. I sorted the insights from the interviews into an empathy map to establish a clearer understanding of the Zeit user.
User Persona
The empathy map gave a picture of the user that I further developed into a user persona. I was able to use my market research to identify the demographics, and the empathy map to establish the goals and needs of the user.
Ryan Jones - 28 years old, Male
"I can't believe what some ancient civilizations created. Sometimes it's like, what? It would be amazing to see in person."
Goals
  • Explore history in person
  • Find travel options that align with interests
  • Share interests with family and friends
Needs
  • A method for booking travel through time
  • Travel options that are organized by interest
  • Trip options for group travel
Business & User Goals
With my research in hand, I began to make decisions about the identity for Zeit, and began considering solutions based on the overall project goals. I wanted to be sure to keep the business goals and user goals in mind as well as any technical considerations so I broke down the goals of each to identify where they would overlap.
Feature Roadmap
I kept each of these goals in mind as I built the feature roadmap. Primary focus was placed on ensuring that users could create an account, explore the offerings, make a trip selection, and checkout. I further prioritized the features based on the impact they would have on the final solution, as well as the effort that would be required to implement the feature. I then prioritized each into four categories.
P1: Must-Have
Account Creation - User registration, sign in, and account page so the user can access all their relevant and specific data such as previous purchases.
View Offerings - Collected listing of all possible destinations with brief descriptions and tips.
Trip Selection & Booking - Add trip selection to a shopping cart and select dates of travel.
FAQs & Support - FAQ section to field common questions about booking.

P2: Nice to Have
Package deals - Create themed packages and group offerings.
Filter -Expand filtering functionality to more specifically align with the user preference.
Reviews - Review and provide feedback on trips taken/interested in.
Responsive Website - Allow users to access the site from any device.

P3: Surprising and delightful
Save - A list of favorites that can be attached to the user account for future bookings.
Share - Link to share with friends/family to gather interest about booking a trip.

P4: Can Come Later
Newsletter - Regular notification about events or company updates.
Card Sorting
To establish the hierarchy of the content within the site I again looked to users for guidance on expectations of the organization of information as presented in our card sorting exercises. I used significant dates in history as the cards that users would interact with and had them sort into categories that made the most sense to them.
Sitemap
I  used the insight collected during the card sorting exercise along with my understanding of common design patterns to generate the first iteration of the sitemap.
Task Flow & User Flow
The task flow allowed me to define a straight path for completing a single task within the site.
 In an effort to expand on the task flow, and also to begin identifying the screens that would be needed for the prototype, I created a user flow that explored two unique scenarios.
Background:
Ryan likes to travel with friends during holiday breaks. He gets an email from a friend with a link to a trip that would be fun for their next adventure.
Scenario 1: This is the first time the trip has been mentioned. they haven't decided on dates yet. He just wants to check it out. He's not ready to book yet.
Scenario 2: Ryan and his friends have been trying to decide on a trip for weeks. He finally asked his buddy to just pick a place. They already have the time off. They need to make reservations soon if this trip is going to happen. As long as the price is right, he's ready to book.
Low Fidelity Wireframe Sketches
To begin exploring layout solutions, I started with sketching possible layouts with a focus on the design patterns I'd seen in my research. The sketches contained enough detail to gather initial feedback, and would also support the creation of low-fidelity wireframes later in the process. 
Mid-Fidelity Wireframe Sketches
To address the needs of the Zeit user I began to develop my mid-fidelity wireframes based on the original sketches.
Responsiveness
A primary goal for this project was to create a site that was fully responsive. It was important at this stage that I explore how the site would transition from desktop to tablet and then to mobile, so I could address any issues early on and develop solutions for a seamless transition across devices.
Brand Identity
As I continued with the design of the site, I took the research, observations, and feedback collected to create a mood board. This would lead into the first sketches of the logo. I continued to iterate on ideas once the logo sketches were vectorized, and ultimately created a style tile and UI kit that would assist with the creation of the pages used for the prototype.
Prototype
When I entered the High Fidelity Mockup and Prototype phase, the focus was initially on creating pages that could easily be interacted with by users, to complete specific tasks. I focused on tasks that would be common among users, to gather feedback that would provide the greatest impact on the final design. These pages were used to create the prototype which I put in front of users to gather observations based on their interaction.
Testing with Users
I had three participants test two scenarios with two tasks each to observe the interaction with the prototype. Each participant used a remote, moderated, think-aloud testing process as tasks were being completed.
Scenario
A friend at work told you that they recently took a Zeit trip to the 1964 World's Fair in New York. You're curious, and a bit nervous about the idea of traveling through time.
Task 1: Find safety information for traveling through time with Zeit.
Task 2: Find the trip for the 1964 World's Fair in New York.
I collected the results from testing in the form of actual results as well as observations that were documented as my findings. I was able to identify participant expectations, and focus my attention toward needed changes.
Insights & Recommendations
From the collected observations I began to detect patterns. These patterns were used to develop insights that would become the final recommendations for updates to the site. Each recommendation also received a priority level based on the effort necessary to complete the change as well as the amount of impact that could be expected from the change.
Pattern: First stop, destinations
Insight: Participants wanted to use the Destinations page as their first stop when looking for where to travel.
Recommendation: Make the Destination page available with listings.
Priority: Nice to have
Pattern: Dislike for categories
Insight: Participants want to interact with something other than categories when searching.
Recommendation: Create alternative methods for searching for trips.
Priority: Must have
Priority Revisions
These identified priority revisions were completed as a final stage before being ready for development. I identified and addressed concerns around styling consistency, category organization, and layout.
The home screen menu options were simplified and interaction points were clearly defined and centrally located.
Categories used to determine a destination selection were reorganized to reflect the patterns that came naturally to the user, with a focus on time period, location, and interest.
Destination descriptions were simplified with updated layout and simplified icons to improve consistency from one destination to the next.
Conclusion
With a combination of research and testing, I created a site that would allow Zeit users to easily navigate around the available offerings, and make selections to book travel. The main difficulty was creating an experience for users that was as familiar as booking travel on a standard travel site, while still keeping in mind concerns about a new form of travel, that had not existed before.
I've learned that there can be a great deal of effort required to develop a clear understanding of a service that does not actually exist. While I was able to take steps toward a solution, it stands to reason that many changes would be necessary for a product that would actually be possible. There would be quite a bit learned from the early testing of the project and much more iteration necessary with something so new. Design patterns would give a good start but would be only a first step on the path toward a final design.
Next Steps
The next steps for the design will be a handoff to developers for implementation. The focus will shift to maintenance and iteration. I believe the addition of features that are in line with the uniqueness of the offering will only improve the experience for users. I look forward to using what I've learned from this project to inform future decision making regarding projects that fall outside of the norm.

You may also like

Back to Top