National Park Service Case Study

I went on a National Park road trip with my friends in Utah and Arizona last year and came across the National Park Service website while planning our trip. It had a lot of helpful information, but we ended up using other online resources more because the organization of the website made it difficult to find information. I thought it would be a fun design experiment to redesign the website and create a mobile version to help users who are using the National Park Service website to easily access information and plan their trips.

01. OVERVIEW

Duration: March 2019 - May 2019

Team: Individual project

Tools: Balsamiq, Sketch, Adobe Photoshop, InVision, Flinto

Problem: The National Park Service website provides valuable information about national parks to help users learn and plan their trips. However, its lack of clear information architecture and visual hierarchy, inconsistency of information across different parks, and insufficient visual information prevent users from using the website to its full potential.

Goal: To improve the efficiency and enjoyment of searching and planning trips to national parks

Final Design Outcome:

Simplified Search

A quick, simple search to improve the efficiency of finding and browsing parks.

National Park Overview

An overview of national parks with basic information about the parks, activities, attractions and events, which will help users plan their trips.

02. RESEARCH

I performed a quick heuristic evaluation using Jakob Nielson's 10 general principles for interaction design. The three usability issues that were most critical were:

⚠️Consistency and standards
⚠️Flexibility and efficiency of use
⚠️Aesthetic and minimalist design

I wanted to get a better grasp of the problem space and the experiences of other users so I conducted semi-structured interviews with my friends who I went on the trip with and asked about their experiences navigating the website. I asked how successful they were in finding desired information, navigating between different pages, how they felt about the content and the presentation of information. Some of the key findings from the interviews that were repeatedly mentioned were:

1) Users want to search by park names but the main search feature forces users to search by state and they have to go to a different page to search by parks.
2) Users are disconcerted by the two search bars—the main drop-down search bar and the type search bar within the drop-down.
3) Users found the inconsistency of information across the website for different parks confusing—the way information was organized was different for every park.
4) There were too many tabs containing the same information.
5) It is difficult to find activities and recommended attractions with appropriate pictures.
6) There is a lack of quality visualization and it's hard for users to get a sense of what the park will look like.
7) Mobile version is difficult to navigate and users wish there was a better way to access information on-the-go.

After the interviews, I conducted a quick competitive analysis by looking at travel websites and blogs to gauge how other resources that the users of the National Park website were using to plan their trips. Some of the features that were prevalent in the other websites that the National Park website lacked were:

1) Quick, simple search
2) Lots of photos that grab users attention
3) Map of attractions and activities
4) Organized section for guides and tours

03. IDEATE

User Personas

Before jumping into design I wanted to use the ideation phase to surface different ideas and quickly brainstorm. I first created user personas to help me guide through the ideation process and make sure that I was addressing the issues found during my research phase.

Thumbnail Sketches

Based on my research and personas, I created thumbnail sketches, experimenting various thoughts and ideas. During this idea generation phase, I came up with new features such as AR navigation and bookmarks that I wanted to test in the prototype.

Wireframe

After iterating concepts through my sketches, I created wireframes to finalize the functionality and define interactions.

04. DESIGN

Based on the feedback on the sketches and wireframe I created the high-fidelity UI of the National Parks Service website below.

Web

Mobile App

05. EVALUATE

I conducted cognitive walk-throughs with the prototype in person with two tasks of 1) planning a weekend trip to a national park and 2) finding activities assuming you are already at the park. Some of the comments included:

👍I like the simple search on both mobile and web. It feels natural.
👍The large images, especially the 360 degree photo, help me visualize the park.
👍I like having an interactive mobile map that shows different attractions and activities at the park.
👍It is easy to find information on what I have to do/go at the park.
👍The overall look of the website feels modern and clean.

👎Label pictures on the home screen and provide a little more information.
👎Having a pop-up for photos on the overview page on the web is confusing because the four dots make it seem like it's a slideshow.
👎The icons that switch between the 2D and AR maps in the mobile version are unclear. Labeling them "2D" or "AR" might be more helpful.
👎Bookmarks could be organized better rather than having one long list.
👎If there is no internet connection at the park how do you use the navigation feature?

05. REFLECT

Making Mistakes

I had a lot of fun redesigning the National Park Service website and trying to solve the issues that my friends and I encountered. I wanted to improve the user experience so that users could navigate and plan their trips to national parks with little frustration, but I quickly learned that redesigning the whole website was an ambitious project. I made LOTS of mistakes along the way such as building the web version before mobile and overlooking the technical side of the mobile map. However, it was a great learning experience improving my design skills and getting feedback on my designs.

Future Work

Since this project was aimed to hone my skills in brainstorming design concepts, getting feedback, using design tools and prototyping, there is a lot of room for future work. Based on the user testing, the map flow of the mobile version wasn't intuitive to users, so I would want to flesh it out more so that the experience of finding attractions, navigating and switching between different modes is smoother. I would also want to explore different solutions for the possibility of not having cellular service and how it would affect the user experience of the app.