Project Overview
Year
2020
Duration
10 Hours
Tools Used
Figma
Scope
Responsive Website
Background
You’ve been approached by Wayfarer, a travel website, to create a new landing page and mobile app design. Wayfarer is a place for travelers to discover new locations to visit around the world.Although it doesn’t directly sell any trips, flights, or accommodation on the site, people use it as a tool for researching where to travel next, based on their preferences. Wayfarer’s target audience is anyone between the ages of 21 and 30 who travels frequently and is in search of new adventures.
Objective
Design a website for the brand Wayfarer that is adapted for mobile use.
Home Page Design


Design process
The Wayfarer product is for travelers - who tend to be in their 20s. This group is inspired by diverse cultures and natural landscapes, outdoor activities, shopping, and historical destinations across the world. The site can help them either find accommodations in cities they know they would like to visit (via search) as well as get inspired by browsing some of the categories such as “Popular Destinations ” on the landing page and additionally “Explore the USA” and “Suggested for You” on the app, that I've laid out for them.
The product also features a tagging system where destinations are tagged with adjectives and activities so if our user wants to search a particular interest, they can do that too. This makes the search feature even more useful. The tags are also linked up to the “Features” section on the landing page so they can browse for inspiration as well. The tags appear when you open the details page for a particular destination (as displayed on one of my app screens). Originally, I included a snippet of the text description of each destination on the landing page as I thought it would interest users to continue reading. However, then I put myself in their shoes and decided that the long-form description would be better tucked into the details page, and that listing the tags underneath would provide an easier way to digest some basic information when scanning the landing page.
Accommodations was another category to bring into the product, and despite not being able to purchase the accommodations in the site, users can search, review, and bookmark their favorite stays and browse the accommodations in a particular destination on that destination’s details page. This use feels particularly useful, however if the user is the type who just wants to stay in a nice or interesting hotel and is open to multiple destinations, they can check out the “Top Rated Accommodations” highlight we’ve created in the explore tab.
For the navigation for the app - at first I had a “Search” and an “Explore” tab, but then I decided to combine these categories so that the user has both options without taking up unnecessary screen space. I contemplated putting a bookmarks tab, but I decided that wasn’t an immediate navigation need for the user and I could nest that into a hamburger menu with other options.
The product also features a tagging system where destinations are tagged with adjectives and activities so if our user wants to search a particular interest, they can do that too. This makes the search feature even more useful. The tags are also linked up to the “Features” section on the landing page so they can browse for inspiration as well. The tags appear when you open the details page for a particular destination (as displayed on one of my app screens). Originally, I included a snippet of the text description of each destination on the landing page as I thought it would interest users to continue reading. However, then I put myself in their shoes and decided that the long-form description would be better tucked into the details page, and that listing the tags underneath would provide an easier way to digest some basic information when scanning the landing page.
Accommodations was another category to bring into the product, and despite not being able to purchase the accommodations in the site, users can search, review, and bookmark their favorite stays and browse the accommodations in a particular destination on that destination’s details page. This use feels particularly useful, however if the user is the type who just wants to stay in a nice or interesting hotel and is open to multiple destinations, they can check out the “Top Rated Accommodations” highlight we’ve created in the explore tab.
For the navigation for the app - at first I had a “Search” and an “Explore” tab, but then I decided to combine these categories so that the user has both options without taking up unnecessary screen space. I contemplated putting a bookmarks tab, but I decided that wasn’t an immediate navigation need for the user and I could nest that into a hamburger menu with other options.
Recogniton
.png)
Of the thousands of 10-Hour Design Challenge projects received by Designlab, this project was chosen out of just a few to be featured on the school's website!