By Alice Zhang

Introduction

This project focuses on improving the visual design for the **San Francisco Zoo website.**

I took on this project as a weekend-long design exercise because I had a memorable learning experience from the previous UXD Contest and wanted to take another opportunity to sharpen my skills. I chose to do it also because I'm an animal lover. 🐾

Selected Webpages

I took 2 minutes to go through the San Francisco Zoo website deciding on 3 webpages to focus on for the visual redesign. Selected webpages are:

Landing Page - this is the page that sets the first impression a user has on the website, and should be on the forefront of a visual language redesign

**Re-opening Policies** - with these unprecedented times, it is important to clearly show what exceptions exist for visiting the zoo

Exhibits - this page is information-rich about the zoo's offerings and will be visited whether or not a real-life visit is involved

Page Breakdown

I took 5 minutes for each page to spot as many issues on the current webpages as possible. This process followed the CRAP principles; contrast, repetition, alignment, and positioning. To gather thoughts from multiple perspectives, I started analyzing with a zoomed-out version and zoomed into select parts of the page that stood out to me. Anything that repeated between the webpages' design was put in the Common section.

Afterward, I spent the next 6 minutes categorizing them into the design principles they related to. Then I spent the next 25 minutes screen shooting the parts I picked out. If anything did not categorize as any CRAP principle specifically, I noted it as a general aesthetic consideration.

Design Language Refresh

Setting the Mood (20 minutes)

I chose these 3 words to prompt the design: nature, personable, vitality. These words were chosen because they embody the spirit of the great outdoors while maintaining a connection with people who seek to learn about nature and its offerings.