OVERVIEW
RoadsideAmerica.com is a travel website that helps people discover hidden local attractions.
- It is a caramel-coated-nutbag-full of odd and hilarious travel destinations—over 15,000 places in the U.S.A. and Canada—ready for exploration.
- Browse by state, search by keywords or city, to find off-beat attractions, stories and tips.
Identifying the most noticeable problems within the site.
- Current interactive map is very basic, making it difficult for users to map out locations.
- To make use of the site’s information, users are better off using different map providers such as Google Maps/Apple Maps in order to complete their search.
Updating RoadsideAmerica.com will help increase rural tourism.
- Making small towns feel less forgotten, and help local businesses thrive.
RESEARCH
What people think about road trips.
To determine who my target audience is and how they travel, I began by sharing a survey with my friends, family, and colleagues as well as asking for interviews. I received:
- 46 survey responses.
- 7 in-person interviews.
Data from survey responses.
“It must equal to $1 per hour of fun for the attraction to be worth to travel to.”
—Wesley
Analyzing interview responses.
I organized and identified patterns of thought among potential users.
DEFINITION
Ideal user.
Luke Taylor
- Age 32.
- Married.
- Lives in Orange County, California.
- Likes hiking, traveling, rock climbing & photography.
- Takes the time to discover all relevant details before taking a road trip.
IDEATION
Organizing thoughts from brainstorming sessions.
- Using the “I like”/“I wish, What if” method, I categorized ideas that might help us reach redesign goals with RoadsideAmerica.com.
Visualizing potential impact and required effort of proposed features.
I decided to prioritize the following features within the redesign:
- Interactive map.
- Quirky attractions.
- Save route to favorites.
- Rating system for attractions.
Click to enlarge.
PROTOTYPING
Users' navigation through the website.
Customer journey.
I created a user journey map showing Luke Taylor's interactions with redesigned version of Roadside America.
1
Luke Taylor enters the website and clicks on a button labeled “Get Started.”
2
Enters starting and ending addresses.
3
His stops are generated along the route he specified.
4
Luke feels overwhelmed by the diverse array of options available to him.
5
He quickly scans the points on his map, to get a sense of what each stop has to offer.
6
Luke likes all the quirky stops that were added to his route. He clicks to finalize it.
7
He goes to the route menu to save the route to his favorites. He sees a prompt asking to log in. Not happy about having to do another step.
8
Luke logs in using his Apple account to save the route to his favorites. He’s very happy about the fast log-in process and saving the route with his favorite quirky attractions.
Initial idea and sketches.
By creating a set of sketches, I was able to visualize what the layout might possibly look like before committing to digital design.
Low-fidelity prototype.
In my first iteration of the prototype, I created a general layout to try to determine how important pieces of content would fit together.
- It felt more intuitive if the quirky attractions menu was displayed horizontally across the bottom, rather than in a vertical alignment as initially sketched.
TESTING
Testing first iteration of the redesign.
Once I finished the initial prototype, I created a test plan in order to evaluate how well it would work against these tasks:
- If a user enters their starting location and destination, then sees the route created for them on the map.
- If a user is able to add/remove stops along their generated route.
- User can save their generated route.
What I learned from first round of user testing.
Testers had difficulty understanding the purpose of the map. It was a static image that lacked key interactive features, causing confusion about the purpose of the entire website. In addition:
- Homepage/landing page needed to quickly explain to the user, that the focus of the website is on route stops and quirky attractions, rather than finding the fastest way from point A to point B.
- The wording in the “Add to route” button did not make it clear that initially the route isn't set, and it up to the user to add/remove stops that they want to explore.
- User input from the bottom menu did match with what was being shown on the map and vice versa.
Iterations based on feedback.
After listening to the testers, I decided to make several changes for the next interation of the prototype.
- Added introduction paragraphs to explain what RoadsideAmerica.com is about.
- Focused on adding interactivity. The map could be panned and zoomed around.
- Changes to the route matched with what would be shown on the map.
- Replaced “Add to route” with an icon to hide/show stops.
- Added filters and a rating for each quirky attraction.
Second round of user testing results.
Second iteration of the design was much more successful than the first.
- Users found the prototype easier to use and more responsive across all its previously problematic areas.
- The prototype was ready to be changed into a more detailed design.
FINAL DESIGN
New brand style guide.
- The tone of UI style direction is classic and warm.
- Users should be able to focus on their task without getting distracted by bright colors.
- I kept some of that western-road-trippy feel by utilizing a brown mid-tone color pallete, and avoiding any vivid colors.
High-fidelity design.
FINAL RESULT
High-fidelity prototype.
This prototype is a culmination of research, user testing, and design work.
- It is interactive, easy to use, and clear.
- Making the user experience much more enjoyable than that of the original website.
Comparison.
