The Wave

Project Type

UX, Information Architecture

Overview

TheWave.info is a website in place to provide information to visitors of the popular photographic destination in Page, Arizona called The Wave. I was responsible for restructuring their content to better direct users to plan their trip to the destination.

Opportunity

Visitors to TheWave.info attempting to find information about the Wave located in Page, Arizona were being misdirected by having an overwhelming amount of information poorly organized. Users need to be able to find information on the wave, what they may need to go there and directions on how to get there. In addition, users should be able to easily access permit information and the online application to be able to access the site.

Goals

Improve navigation on website to provide quicker access to planning tools and lottery permit application + process. In addition, remove unnecessary and repetitive information throughout website as to avoid confusion for visitors to the site.

Approach + Deliverables

This project was conceptualized and undertaken as practice although it is following a UX design process, this project is not forecasted to ship or become a real product.

Role

Concepting
Wireframing
Prototyping
Information Architecture
UX Research
Visual Design

Tools Used

Sketch
InVision
Paper + Pencil

Project Duration

1 week

 Process

1

Research

Content Audit
Card Sorting
Tree Testing

2

Analysis

Navigation Study
Heuristic Analysis
Competitor Analysis

3

Ideation

Information Architecture
Low-Fidelity Wireframes

4

Design

Mid-Fidelity Wireframes
Mid-Fidelity Prototype

5

Conclusion

Reflections
Next Steps

Research

TheWave.info is currently one of the top search results when searching for information on the wave in Page, Arizona. To allow visitors to this site and website to gain necessary information to visit with proper accommodations, directions and permits this website’s content needs a restructure. A content audit was used to assess what information was needed, what content could be merged and what needed to be removed altogether.
View Content Audit | View original home page

Card Sorting Results - 4 out of 9 participants abandoned the card sorting.

Card Sorting

Based on user research conducted using card sorting, users were having a hard time locating necessary information with the current navigation.

Most participants seemed to be confused by the original options provided by the website TheWave.info, as many options were misleading or did not make sense. A lot of users created a group called, “I don’t know” or something similar. Based on the findings, the navigation on the website should be restructured and possibly condensed to provide users clear guides to information, lodging, planning, permits, etc. Users also claimed the sorting was difficult to complete.

Tree Testing

Following the card sorting, the navigation was reorganized to assess what would work. The new navigation structure was then presented to seven users through tree testing using Optimal Workshop’s digital tree testing.

Based on the card sorting, the tree sorting was based on a simpler navigation directing users to main tasks that are necessary for a user looking to plan their visit to The Wave including Lodging Information, Maps, Contact information, etc. The simpler navigation seemed to have a higher success rate in users finding where they needed to go to complete tasks.

Tree Testing Participant Results - The error rate was below 20% overall

Analysis

Research was conducted on 16 individuals from ages 18–50 male & female, for their thoughts on the navigation on TheWave.info. Most expressed frustration with the navigation and repetition of content throughout, although many enjoyed the photography made available as it was visually appealing. The navigation was not consistent as it changed while navigating the website.

010-thumb-up.png

Positive

Users enjoyed the abundance of professional photography found throughout the website.

014-neutral-1.png

Neutral

Users did not understand whether the website was a photography website or an actual informational website for the wave.

013-sad-1.png

Negative

Users expressed strong frustration with the navigation throughout the website, as it was repetitive and disorganized.


Heuristic Analysis

The heuristic analysis presented some opportunities to improve the website’s structure to properly serve the user. Using the Abby method, the heuristics of TheWave.info’s website’s overall structure were assessed to improve the navigation and information architecture of the website.

A majority of the findings of the heuristic analysis were marked under “serious problem” as they require attention to improve the user experience on the website. Some of the major ones are listed below.

alert.png

Findable

Can Users easily locate the things they are seeking?

alert.png

Accessible

Does it meet the levels of accessibility compliance to be considerate of those users with disabilities?

alert.png

Clear

Is the path to task completion obvious and free of distraction?

alert.png

Useful

Is it usable? Are users able to complete tasks they out to without massive frustration or abandon?


Competitive + Competitor Analysis

The competitors and comparators were other websites within the same target audience which were hikers, tourists and avid outdoor photographers. Based on the findings, the wave fell short within several of the features offered such as social media, contact, and lodging. The wave has no social media presence and only offers a link to email the webmaster, which is placed all the way at the bottom of the page - which isn’t convenient to the visitor. There is no lodging information for the visitor, which would be useful to someone coming out of state or someone who wishes to stay in the area.

Competitors.png

View the full competitor analysis here.


Navigation Study

Following the user research, I created a new structure for the navigation along with a navigation study to depict what each new section on the global navigation would direct the user to. The goal was to create one global navigation menu that would be present on each page of the website which would still include all the necessary elements found on the original website.

NavStudy_TheWave.jpg
TheWave_Annotations.png

Ideation 

Design

Mid-Fidelity Wireframes

The following mid-fidelity wireframes reflect the findings from the navigation study and successful tree testing. A global navigation was created to better serve the user and applied to each page on the website to allow the user to properly navigate through tasks and functions. Some difficulties faced while restructuring the navigation was making sure nothing was left out from the original content and being able to find an appropriate place for every piece of content that was scattered throughout the website.

Mid-Fidelity Prototype

Prototype was created in Sketch with added functionality through InVision, displaying functionality through the website and its new reorganized content structure.

Conclusion 

This project was completed to restructure the content of TheWave.info’s website. Restructuring the navigation created a simple user flow, which allowed visitors to complete the necessary tasks in less steps and with less frustration or confusion.

Next Steps

Bringing the mid-fi wireframes to high fidelity and complete user testing with all visuals would allow for insights on how successful a full restructure and redesign would help future visitors to TheWave.info.