National Park Service Redesign
National Park Service Redesign
National Park Service Redesign
My Role
My Role
User Research, UX/UI Design, Prototyping, Usability Testing
User Research, UX/UI Design, Prototyping, Usability Testing
Timeline
Timeline
DEC 19 → JAN 20 (1 month)
DEC 19 → JAN 20 (1 month)
Tools
Tools
Adobe XD, Miro, Adobe PS, Invision
Adobe XD, Miro, Adobe PS, Invision
Team
Team
Solo Project
Solo Project
Disclaimer: I do not work for the National Park Service (NPS), and the views in this case study are strictly my own. As a passionate designer, I acknowledge that my vision for this project may be overly ambitious and at times reliant on assumptions of business goals. In a perfect world, I'd be working alongside the NPS team with direct access to these resources to guide my work. Until then, this case study is meant to be an exploratory learning experience on a agency I deeply admire.
Project Overview
Project Overview
Project Overview
Problem
Problem
Problem
Protecting and preserving national parks is deeply important to me. The NPS website is hard to navigate and find essential resources due to poor accessibility and cognitive overload.
Protecting and preserving national parks is deeply important to me. The NPS website is hard to navigate and find essential resources due to poor accessibility and cognitive overload.
Solution
Solution
Solution
This project will reorganize the site’s structure, develop a new style guide, and create a more engaging and user-friendly interface.
This project will reorganize the site’s structure, develop a new style guide, and create a more engaging and user-friendly interface.
Impact
Impact
Impact
This effort will make the NPS website easier to use, helping more people connect with and support our national parks. Better accessibility and user experience will boost public engagement and awareness.
This effort will make the NPS website easier to use, helping more people connect with and support our national parks. Better accessibility and user experience will boost public engagement and awareness.
DISCOVER
Heuristic Evaluation
Heuristic Evaluation
Formatting Consistency
Formatting Consistency
The homepage design is not consistent throughout the page.
The homepage design is not consistent throughout the page.
Site Purpose
Site Purpose
Primary goal of the site is not clear, there is no CTA.
Primary goal of the site is not clear, there is no CTA.
Clearly Labeling
Clearly Labeling
Site labeling is clear.
Site labeling is clear.
Prominent Search Icon
Prominent Search Icon
Primary goal of the site is not clear, there is no CTA.
Primary goal of the site is not clear, there is no CTA.
Confusing Features
Confusing Features
These features seem redundant and are confusing to users.
These features seem redundant and are confusing to users.
Inconsistent Formatting
Inconsistent Formatting
Formatting is inconsistent and articles do not seem to have a reason of being on this page, out of place.
Formatting is inconsistent and articles do not seem to have a reason of being on this page, out of place.
Poor Placement
Poor Placement
This section should be highlighted as this is why most people come to the site.
This section should be highlighted as this is why most people come to the site.
Accessible color contrast for the home page hero headline.
DISCOVER
Usability Test Plan
The goal is to identify the current issues with the National Park Service website. While it's known that the site isn't very intuitive, understanding exactly what users find confusing and how it affects their experience is crucial. This will help pinpoint key features that need redesigning.
Task 1: Search for Glacier National Park
Task 2: Reserve a campground
Task 3: Look at trip ideas and pick one that interests you
Testing Questions:
What emotions did you experience while navigating the site?
What aspects are you most interested in when exploring the site?
How did you perceive the amount of information provided—was it overwhelming or helpful?
At what points, if any, did you feel overwhelmed while using the site?
If you could change one thing about the site, what would it be?
The goal is to identify the current issues with the National Park Service website. While it's known that the site isn't very intuitive, understanding exactly what users find confusing and how it affects their experience is crucial. This will help pinpoint key features that need redesigning.
Task 1: Search for Glacier National Park
Task 2: Reserve a campground
Task 3: Look at trip ideas and pick one that interests you
Testing Questions:
What emotions did you experience while navigating the site?
What aspects are you most interested in when exploring the site?
How did you perceive the amount of information provided—was it overwhelming or helpful?
At what points, if any, did you feel overwhelmed while using the site?
If you could change one thing about the site, what would it be?
Successful paths for usability test.
Key user insights—
“Not a fan of having to click menu to see the menu - I like when there’s a bar at the top of the page to see before you have to click on something.”
“Not a fan of having to click menu to see the menu - I like when there’s a bar at the top of the page to see before you have to click on something.”
“Too much info. The food storage section is important but you don’t need this huge section about it. It’s not useful info right now, it’s useful later once you’ve completed your booking.”
“Too much info. The food storage section is important but you don’t need this huge section about it. It’s not useful info right now, it’s useful later once you’ve completed your booking.”
“I’m most interested in finding info about the parks, if things are closed, so you know if it’s worth it to go during a certain time of year. Areas may not be open because of the weather.”
“I’m most interested in finding info about the parks, if things are closed, so you know if it’s worth it to go during a certain time of year. Areas may not be open because of the weather.”
Priority matrix and user feedback analysis—
DEFINE
DEFINE
Navigation and Information Architecture
Main Navigation Heuristic Analysis—
Footer Navigation Heuristic Analysis—
DEFINE
DEFINE
Navigation Usability Test
The goal is to identify the current issues with the navigation of the National Park Service website. While it's known that the navigation lacks intuitiveness, pinpointing specific aspects that users find confusing and understanding their overall experience is essential. This will help identify and improve key areas of the navigation that require redesigning.
Task 1: Find info about job opportunities.
Task 2: Find where you can purchase a park pass.
Task 3: Find what partnership opportunities there are.
Testing Questions:
How do you feel about the color scheme of the navigation, and how could it be improved?
In what ways can the navigation hierarchy be improved to make important links stand out?
How does the current navigation design affect your engagement with the website?
If you could change one thing about the navigation, what would it be?
The goal is to identify the current issues with the navigation of the National Park Service website. While it's known that the navigation lacks intuitiveness, pinpointing specific aspects that users find confusing and understanding their overall experience is essential. This will help identify and improve key areas of the navigation that require redesigning.
Task 1: Find info about job opportunities.
Task 2: Find where you can purchase a park pass.
Task 3: Find what partnership opportunities there are.
Testing Questions:
How do you feel about the color scheme of the navigation, and how could it be improved?
In what ways can the navigation hierarchy be improved to make important links stand out?
How does the current navigation design affect your engagement with the website?
If you could change one thing about the navigation, what would it be?
Key user insights—
“I would change the titles to be a little more distinct from the other links. Make it bigger, underlined, different color, just make it stand out a bit more so it’s even more clear.”
“I would change the titles to be a little more distinct from the other links. Make it bigger, underlined, different color, just make it stand out a bit more so it’s even more clear.”
“I personally don’t like how you have to click menu. I wish you can see on top. I think the navigation is very dark too, it doesn’t fit the National Parks theme. It’s all black and white and is kind of bland and it doesn’t make me excited."
“I personally don’t like how you have to click menu. I wish you can see on top. I think the navigation is very dark too, it doesn’t fit the National Parks theme. It’s all black and white and is kind of bland and it doesn’t make me excited."
"There’s just a lot of links overall, and because there’s a black background and white text, there’s no hierarchy besides the fact that these are bigger. Looking at it, it looks all the same and my eyes aren’t drawn toward one thing.”
"There’s just a lot of links overall, and because there’s a black background and white text, there’s no hierarchy besides the fact that these are bigger. Looking at it, it looks all the same and my eyes aren’t drawn toward one thing.”
DEFINE
DEFINE
Card Sorting: Part 1
Card Sorting:
Part 1
Primary, Secondary and Footer Navigation—
DEFINE
DEFINE
Card Sorting: Part 2
Card Sorting:
Part 2
Orange: Original pages / Green: Categories, new main nav / Yellow: Renamed pages
Orange: Original pages
Green: Categories, new main nav
Yellow: Renamed pages
While organizing the sitemap, I realized that a page could be combined to minimize the number of links and a few more names should be changed.
Combined:
Topics > Discover
Name changes:
Passes > Park Passes
Search by Activity > Activities
Explore > Discover
DEVELOP
DEVELOP
UI Design and 5 Second Tests
Desktop Navigation—
Mobile Navigation—
Mobile Hamburger Navigation—
Lo-Fi Wireframes—
5 Second Tests—
Test Questions:
What is the purpose of the page?
What are the main elements you can recall?
Who do you think the intended audience is?
Did the design/brand appear trustworthy?
What was your impression of the design?
Test Findings:
Home page hero search bar—
Have categories to choose from to filter your search, rather than an open ended search bar.
For example: Climate - desert, mountains, forest, wetlands.
The pastel colors are nice and calming - which is the first thing when I think of parks. You go there to escape the world and enjoy nature.
Test Questions:
What is the purpose of the page?
What are the main elements you can recall?
Who do you think the intended audience is?
Did the design/brand appear trustworthy?
What was your impression of the design?
Test Findings:
Home page hero search bar—
Have categories to choose from to filter your search, rather than an open ended search bar.
For example: Climate - desert, mountains, forest, wetlands.
The pastel colors are nice and calming - which is the first thing when I think of parks. You go there to escape the world and enjoy nature.
DEVELOP
DEVELOP
High Fidelity Usability Test
This test will help uncover any areas of the Hi-Fi website prototype that aren’t intuitive in the redesign of the National Parks Service website. The goal is to find what users find confusing and how the site makes them feel. This will help discover if it’s difficult to navigate the site and uncover any tasks that may cause the user frustration. Once feedback has been received, features and/or usability will be iterated on.
Task 1: Search for Texas National Parks.
Task 2: View the ‘Plan Your Visit’ page.
Task 3: Find the list of available park passes.
Testing Questions:
What were your initial thoughts when viewing the home page?
How did you feel trying to navigate through the site?
What are you most interested in when going through the site?
Did you find that there was too much info or was it helpful?
Did you feel overwhelmed at any point when going through the site?
If there was one thing you could change, what would it be?
This test will help uncover any areas of the Hi-Fi website prototype that aren’t intuitive in the redesign of the National Parks Service website. The goal is to find what users find confusing and how the site makes them feel. This will help discover if it’s difficult to navigate the site and uncover any tasks that may cause the user frustration. Once feedback has been received, features and/or usability will be iterated on.
Task 1: Search for Texas National Parks.
Task 2: View the ‘Plan Your Visit’ page.
Task 3: Find the list of available park passes.
Testing Questions:
What were your initial thoughts when viewing the home page?
How did you feel trying to navigate through the site?
What are you most interested in when going through the site?
Did you find that there was too much info or was it helpful?
Did you feel overwhelmed at any point when going through the site?
If there was one thing you could change, what would it be?
Key user insights—
“I would rename the Plan Your Visit page to be in the drop down or add a drop down arrow because I didn’t assume you could click it twice in the menu.”
“I would rename the Plan Your Visit page to be in the drop down or add a drop down arrow because I didn’t assume you could click it twice in the menu.”
“The huge headline about adventure made me think that there’s an experience going on, like there would be a guided tour/adventure instead of finding a park. It made me eager to do it because it’s beautiful and I’m all about spending my money on adventures.”
“The huge headline about adventure made me think that there’s an experience going on, like there would be a guided tour/adventure instead of finding a park. It made me eager to do it because it’s beautiful and I’m all about spending my money on adventures.”
“The pages were a little overwhelming because they were super long with lots of text.”
“The pages were a little overwhelming because they were super long with lots of text.”
“It wasn’t clear that the park passes were on the Plan Your Visit page cause I wouldn’t have kept scrolling.”
“It wasn’t clear that the park passes were on the Plan Your Visit page cause I wouldn’t have kept scrolling.”
OUTCOMES
Final Thoughts and Future Opportunities
Enhance User Experience: Focus on improving navigation and accessibility, ensuring the website is user-friendly for all age groups and abilities. Incorporate interactive maps and virtual tours to help visitors plan their visit more effectively.
Mobile Optimization and App Integration: Given the increasing use of mobile devices, ensure the website is fully responsive and optimized for all screen sizes. Consider developing a companion mobile app that could offer features like offline maps, trail updates, and augmented reality experiences.
Sustainability and Education: Leverage the website as a tool to promote conservation efforts and educate the public about the importance of preserving natural landscapes. This could include interactive educational sections, live webcams of wildlife, and features on the ecological impact of human activities in park areas.
Enhance User Experience: Focus on improving navigation and accessibility, ensuring the website is user-friendly for all age groups and abilities. Incorporate interactive maps and virtual tours to help visitors plan their visit more effectively.
Mobile Optimization and App Integration: Given the increasing use of mobile devices, ensure the website is fully responsive and optimized for all screen sizes. Consider developing a companion mobile app that could offer features like offline maps, trail updates, and augmented reality experiences.
Sustainability and Education: Leverage the website as a tool to promote conservation efforts and educate the public about the importance of preserving natural landscapes. This could include interactive educational sections, live webcams of wildlife, and features on the ecological impact of human activities in park areas.
