ZEIT: E-Commerce Historical Travel Booking

Timeline: 6 weeks, 150+ hrs Role: Lead UX/UI Designer  Client: ZEIT (DesignLab)


︎︎︎ View Desktop Prototype



*Though this project is speculative in nature, the concept and principles are intended to be applied to creating educational products for companies with innovative technology.


I. Time travel is now available to the general public.


ZEIT aims to transport travelers to historic moments, launching with 289 experiences from prehistoric to present. I was tasked with
defining a brand and responsive e-commerce website  for this groundbreaking company. 


II. Research: The idea of time travel is both an abstract concept and one we are familiar with through various fictions. 


Unique experiences call for specialized research. I had to search outside of the norm when it came to assessing competitors, including standards in the present
(ex Airbnb, Expedia), but also in speculative realms like VR tech. Conducting research broadly informed the design standards of e-commerce travel websites
as well as the potential for ZEIT to distinguish in the travel market.


 
 


III. Takeaways: These conversations helped clear up a few personal assumptions. 


Where I would have jumped at the chance to see the pyramids in construction and dinosaurs up close, some interviewees had reservations. I discovered that there was a great deal of uncertainty about time traveling; some expressed concerns about “blending in in,” behaving respectfully by adherence to the appropriate cultural norms, as well as being knowledgeable as possible before traveling in order to maintain the integrity of the fourth wall/space-time continuum.


Moving forward into the next stage of ZEIT, I knew that reasurrance, safety, and preparation were all key insights to bring in to my prototype.


IV. Definition: When thinking about the past as a museum, we might imagine a gallery filled with potential genres or experiences.


Knowing that reassurance is a key factor helped me developed user and task flows that laid out the experience of visiting the ZEIT platform and choosing a destination. A card sorting exercise uncovered that above all, experiences were grouped together by genre. These insights shaped the architecture of my site. In the sitemap, I built a browsing function that filters primarily by activity, interest, geography or time period as the main paths for users to explore experiences.

I sketched potential layouts of the Zeit site page, then structured responsive mid-fi wireframes for desktop, tablet and mobile. 




IV. Brand: Inspired by sleek and literary sophistication, and the immersiveness of a tactile experience, ZEIT’s branding and UI took shape. 


Creating a logo presented a unique challenge. I explored different forms for the Zeit “Z,” ultimately integrating it into a ticket stub to generate cleverness, excitement and sophistication. 

Zeit’s logo was born.

The visual guidelines were inspired by the idea of “modern meets historical”—dark, smooth design and subtly neumorphic-inspired UI elements.




V. The Prototype: I wanted the Zeit prototype to make apparent to a user that they were looking at actual, feasible experiences in space-time rather than a historical archive.


In a future prototype, I would like to incorporate more dynamic, 3D rendering.  Based on my card-sorting exercise I made the main browsing filters by interest and by time period. Experience cards were formatted to seamlessly scale down across responsive sizes.

Experience Page: If a user was familiar with the destination, the floating widget provides an option to book a trip right away.

A downward scroll provides more details about what to expect from the itinerary of the trip: such as hosting, accomodations, and whom the trip might be ideal for. 

I also created mockups for tablet and mobile to render responsiveness





VI. Usability Test: After building my prototype in Figma, I conducted usability testing.


I set out to learn how users understood what Zeit was offering from the homepage , how they navigated the prototyped interactive elements, how they interacted with filters, and where  they would navigate when researching and booking their trip. I affinity-mapped the results to uncover the top priorities for revision. 



The user path I created aligned with participant expectations. 

To instill greater reassurance from the start of the experience, I also made the Testimonials readily accessible on each page. One participant wanted more visual information of what to expect, so I added grid and carousel image galleries to communicate look & feel. 

VII. Reflections: A speculative brief is challenging at first, but creating something new and novel can be a gratifying experience.


I encountered obstacles from time to time as I took a scrappy approach to building the prototype. Yet, this project showed me how infinite the opportunities of a digital product are, when crafted with human-centric design.