CASE STUDY
IMPROVING USABILITY AND AESTHETICS OF PRESIDIO.GOV
A national park inside the City gets lost in the details and the website that can help clear the fog
EXISTING PRESIDIO.GOV HOMPAGE
THE CHALLENGE
In order to improve the usability and aesthetics of The Presidio of San Francisco website, we proposed to redesign the website by integrating updated UI components and vivid imagery.
I was a part of this project with a partner as UI/UX designers to identify usability issues and redesign the website for better functionality in navigation and improved aesthetics.
Presidio.gov is not quick and easy. You had to think through and guess where stuff might be.
”
“
EARLY INSIGHTS
Throughout the Presidio.gov website, we found that the site was fairly clear but certain aspects needed to be addressed, including :
Content Organization
Unclear navigation & required lengthy searching for desired content
Underwhelming Imagery
Does not reflect the beautiful, diverse environment of the Presidio and everything the park has to offer
Lack of Iconography
Difficult to identify what the walking & biking trails offer without further research and searching
Plan your visit and things to do categories sound so similar. I had to hunt around for the right page.
”
“
LOOKING DEEPER
In order to resolve the issue of poor navigation, my team and I set ourselves the task of creating a more thoughtful solution. We analyzed the information architecture and conducted user tests to identify areas for improvement.
PRIMARY NAVIGATION
The taxonomy of the primary navigation is not intuitive for visitors who are new to the website or to the national park.
CONTENT MESSAGING
The main hero image and the call to action button does not accurately explain what the Presidio is or how to “Visit Now.”
SECONDARY NAVIGATION
The pages should be recategorized to ease in the search for desired content.
How might we make it possible for a diverse set of users to utilize Presidio.gov with ease and experience all the national park has to offer?
BEGINNING AT THE ROOT
Starting with the building blocks of a site map, we began by re-ordering the website to help organize and clarify the content. The Presidio is a vast and varied park and it’s website requires careful planning and consideration.
PRESIDIO.GOV SITE MAP
DESIGNING A NEW PERSPECTIVE
Once the site map was sorted, my partner and I begain developing lo-fi wireframes, cognizant to highlight the rich landscape and long history of the area. We conducted A / B testing to determine the best way to move forward with the navigation.
LO-FI TESTING . A
LO-FI TESTING . B
TESTING GIVES INSIGHT
Based on feedback from both A/B testing and 5 second tests as well as further research, we refined the lo-fi wireframes.
Search feature interaction updated
Footer information reorganized
Navigational pull-down menu interaction updated
Header updated to include white space for visual relief
East is east, and West is San Francisco.
”
“
– O. Henry
BRANDING MAKES A MARK
In order to provide a stronger impression that the site is about the Presidio and not just San Francisco, I created a new logo mark for the website. It is inspired by the rise and fall of the Golden Gate Bridge and the military architecture, reflecting over 200 years of development under three different nations.
FINDING THE RIGHT VOICE
The Presidio is where San Francisco all began. Today, the Presidio welcomes all with its beauty, nature, history, recreation, and family activities. A place that represents so much needs a website that shares the beauty and diverse history with clarity and easy access.
With pages like this and this rich information, I never knew all this was happening at the Presidio!
”
“
TESTING AND TESTING AGAIN
We conducted interviews to test our responsive web design, user interface and navigation. Users were asked to explore our clickable prototype and provide feedback.
-
Users felt that the Presidio logo could be larger
-
The user interface was clean and easy to navigate
-
Majority of those tested found the use of icons effective; it helped them find information without digging through muliple pages
-
Overall, testers reported that the website was visually appealing and informative.
KEY FINDINGS AND NEXT STEPS
Good imagery selection is important – it provides a richer user experience and tells a strong visual narrative of what the Presidio has to offer.
Users like quick references rather than having to go through too many steps to find what they are looking for.
By refining how the content was organized, users found that the navigation was more intuitive.
Going forward, we would like to include a digital billboard on the home page that will highlight upcoming events.
Further, we would build out additional pages with a similar clarity of content and information.
In addition to the hero photography, we would like to incorporate the use of videos to further illustrate the beauty and wonder of the Presidio.