Challenge: Zeit is an experiential travelling company that seeks to reposition its brand as a company that is both modern and classical. Additionally, Zeit has requested a responsive e-commerce website for their vacation booking services, with intuitive searching filters and an easy-to-use interface.

As time travel is a service that does not yet exist, secondary research focuses primarily on exploring similar umbrella industries in which time travel tourism would likely fall under. Predictably, the experiential travel industry shared the most similarities with time travel tourism since both fields emphasize the significance of unique experiences, is priced at higher price points (relative to the average vacation package), and exist in a niche market.

Online research began with an exploration of current experiential travel companies, their target demographics, and their web designs.

I found three direct competitors in this subspace — National Geographic Expeditions, Lonely Planet, and Intrepid Travel — along with two indirect competitors that have significant influence in the industry, and identified strengths and weaknesses in their web designs according to current design principles and material design guidelines.

This information was paired together with an in-depth analysis of current travelling trends in North America, vacation travel statistics, and summarized in a competitive analysis to use in future design decisions.

Diving deeper into finding the needs of potential users, I sought out 5 individuals that fit the targeted demographic in my research plan to verify the authenticity of research assumptions and provisional personas.

During the interviews, I asked open ended questions to the participants to explore their various methods of searching, booking, mental states, and determining factors of when going through the process of planning a vacation. This gave me insight into the entire customer journey of my potential users.

Interviews were terminated once I began to see significant patterns in the participants’ answers, and I synthesized the information onto an empathy map to visualize the data, and delve deeper into exploring the various patterns that I might have overlooked in my initial analysis.

An empathy map was created using the interview data. Each of the post-it notes are statements taken from the interview transcripts, and each colour represents a different participant.

Having defined the various user and business goals, I went on to brainstorm a list of product features aimed at addressing these goals.

The features were then reorganized into a priority-based list in accordance with the following metrics: user goals, business goals, effort level (needed to create the feature), and confidence level (how much assurance I had in creating the feature).

In the final iteration of the feature list, it showcases a list of high-priority features necessary to create a minimal viable product (MVP), along with the middling and low priority features that it would take to create a fully fleshed out product. Since my purpose was to create an MVP, I set aside the middling and low priority lists to better focus on the high priority necessities.

Getting into the planning of my sitemap, I began the task with an open card sorting exercise with 10 participants of the targeted demographic. Each participant was given a list of Zeit’s vacation destinations (30 items) in no particular order and asked to sort them into self-created categories.

A glance at the results was all it took to see evident patterns in the data. In my subsequent (and more detailed) analysis of the results, I was able to ascertain three categorical “headers” that accounted for all of the vacation destinations - Historical Events, Time Periods, and Architecture.

Using the Product Feature Roadmap, headers, and a multiplicity of competitor websites as references, in conjunction with Material Design Guidelines, ensured that the result organization schematic would conform to user expectations.

With the basic layout of the site rendered, I began formulating the redesign of Zeit’s branding. This began with logo creation, choosing a colour palette, and picking out a typeface. This was put together into a style tile to better inspect the entire look and feel of the brand in a single document.

Logo creation began with a mindmap of Zeit’s attributes. The exercise gave me a list of brand adjectives to work with, which kickstarted me into the sketching phase. I chose several sketches that resonated with me and began refinement.

In the end, I chose the hourglass concept because it highlighted my brand attributes the most, and was both simple and aesthetically pleasing.

Having chosen a suitable logo, it was time to get down to the colour palette and typography of the site.

As with the logo, I used the same brand adjectives to guide my process. This began with the creation of several mood boards in Pinterest, followed by research into colour and type psychology, and finally, inspiration through dribbble and Behance.

I settled with a vibrant orange as my highlight colour, and chose an a simple array of shades to compliment it. Keeping it simple and balanced in line with the classical and modern branding.

For the typography, I chose the sans-serif font “Avenir” for its well balanced typeface which keeps it sleek, futuristic, and easy to read.

Affinity mapping allowed me to pinpoint two areas of concern: 1) Confusion with the organizational structure of the filter and 2) Confusion with regards to some of the headers on the site.

To solve these issues, I labelled the cards in filters that were harder to quantify (eg. popularity), and re-titled several section headers into more generic titles (this was done with many references to competitor sites).

A second round of revisions adjusted the padding, gridding, and hero images to be much more balanced, engaging, and aesthetically pleasing.

Refinements into the UI of the design finally brought my UI Kit, which was a living document that constantly changed with every iteration of the site, closure. The finalized colours, typography, and style were rearranged into their atomic and molecular forms, and put together in a cohesive document.

The next step would be to formally hand off the assets to the client or developer. This would be followed by continued testings of the design updates since the last usability testing, update the UI Kit, and continuously cycle through iterations and testing for as long as resources allow.

As a frequent flyer and a seasoned professional in industries that do not easily allow for large vacation periods, I found, through my research, that many people shared the same problems that I have struggled with — looking for authentic and quality experiences with only several days to spare for vacation per trip.

And after working on this project, I have come to the realization that many travel booking websites, partly due to the huge amount of content that they have to offer, have extremely cluttered designs that make the searching and booking process that much more tedious and time consuming.

My solution, after the research phase, was to essentially declutter that mess by using a simple and more direct organizational schematic to lay out similar information.

Although currently, there seems to be the same problem — a chaotic organization scheme — across many travel websites, I do believe that there needs to be some serious redesigns in this space.