Understanding the mental model of travelers
‍

Before determining the information architecture, I had to do research on what travel tools users are currently using and what their pain points were. I conducted market research on the closely associated service that makes sense to users: international traveling.

Market Research
For my market research, I narrowed down my competitors by making the assumptions that 1) people are using online methods to view, plan, and purchase their travels because of its convenience and 2) people are using a wide variety of tools.

Direct Competitors:

Indirect Competitors:

Therefore, I will create a planned-out itinerary similar to Jacada and National Geographic, categorize trips based on categories, integrate community contribution information like ratings and reviews to convey trust.

Customer Interviews
To better understand the users' needs, I conducted 5 interviews of international travelers and asked them why and how they traveled. Different patterns arise, such as how money and time influenced traveler. Our target user for Zeit is Short Trip Sherry who has a job obligation but likes to take 1-2 big trips per year.

Persona:

• Fear arises from navigating a new system
• 1-2 international trips per year with the goal of learning something new
• Saves money in order to save up for travel
• Learn different cultures and belief systems

Determining how to organize and present the travel trips
‍

After understanding the market and the potential users, I conducted a card sort to see how users recall information which will influence my design decisions of how to display the travel tips, ie geographical, sequential, categories, etc.

Figuring out how users sort and recall information
I conducted an open card sort with 5 participants where they had to sort through 30 events in different points in history to see how potential users will sort information, ie sequential, geographical, or by themes. I used the online software called Optimal and users had the freedom to create their own categories.

Card Sort Planning:

Test participants weren't told this was for a time travel website.

Results:

Red are the major patterns that the 5 participants grouped together

• Most of the events were grouped together based on an event,  civilization, or geographical location
• United State events tied to a geographical location were popular, ie reflective of the American participants
• Architecture were grouped together, ie landmark places that people travel to

Although as a designer, I wanted to create a time sequence where users can browse based on time eras, the card sorting results told me otherwise. I had confirmation that it was better to display the 289 time travel tips into categories such as, art, event, civilization and to have subcategories under them.

Information Architecture influenced my Sitemap
The information architecture helped organized the sitemap, which I later used for my footer as a way for users to easily navigate what they are looking for.

Footer as a Sitemap:

• The three big categories for trips were: Civilization, Art, and Events

Designing how users navigate travel website
‍

For my design inspiration, I used research from the card sort, user research, and referenced popular travel websites. I focused on how users browse through tips and how the information will be organized. I made small changes and simplifyed further.

Mid-fi Wireframes
I approached the design iteration process by making small changes to create different layout designs. Then I simplified further. Here is an example where I first had a carousel to display highlighted trips but later found through research that carousels were ineffective.

Conveying Zeit's personality through the Logo
‍

Next in the process, I define the personality and brand of Zeit based on these adjectives: convenience, trustworthy, and conveying the past and present. I used these adjectives and I also created a mood board to determine the logo, tyopgraphy, and visual. direction

Creating a logo that conveys Zeit's brand
I first brainstormed by using word association to explore logo ideas that convey Zeit's values while reflecting symbols of the past and the present. Here were some of the final iterations. The final logo was the pyramid.

Logo Iterations

• Drew drafts based on Zeit's values: brave, lively, history lovers, clever, and all-in-one service
• Final logo inspiration is reminiscent of key landmarks that are well-known in Egypt, Mexico, and Peru while simple geometry reflects modern times

Summary of the high-fidelity Wireframes with annotations
‍

High-Fi Wireframes for the Usability Test
I used high-fi wireframes for the usability test in order to gather authentic responses about the design. Below are my wireframes that I used for the usability testing with design decision annotations based on research.

Determing if we are on the right track
‍

Next, I tested the high-fidelity wireframes by recruiting 4 test takers who were travelers. I conducted the test on Zoom and used Invision. Test takers had to complete this test: Book a trip from start to finish for you and your friend. You have $3,000 and only 4 days.

Consistent colors and layout of price for each page
For my priority revisions, I focused on making the website more clear and simple by focusing on the language, consistent colors for the call-to-action buttons, consistent text sizes, and improved information architecture by rearranging when different information requests should be asked in the process.

Improving the consistent colors:

Focusing on information architecture and simplifying the page:

7. Final
‍

Thanks for getting this far! Below is the final prototype with the responsive design for mobile.

Reflections:

• As a concept project, I added too many features for the MVP. This may cause problem for the engineering team in the future.

Next Steps:

• Although I have completed one round of usability testing to validate these designs, these wireframes can be improved further to look into whether users want a more customizable itinerary, if they want to save their progress, if they want to share a trip with a friend, or if they want to add another traveler.

If you want to read more:

•  I only touched on product development and information architecture for this project. For the full case study, check out this page.

Clickable Prototype