West Seattle Food Bank Brand Book

Project Length: 10 weeks
Tools: Adobe Illustrator, AdobeXD, LucidChart, Adobe Photoshop
West Seattle Food Bank (WSFB) supports families and residents in West Seattle zip codes with food, emergency financial assistance, clothes, hygienic goods, and more. Founded in 1989 by a concerned group of neighbors, the caring organization works to strengthen the community and ensures that individuals get safe and reliable access to essential necessities.
Using the assets of WSFB, I crafted a cohesive visual system for the non-profit organization in 5 design phases. By conducting research, evaluating current design structures, and employing resulting insights to re-design a logo and mobile interface, I hope to better communicate WSFB's mission statement and values.
erica smith
WorksAbout

Client Research

‍MISSION: “West Seattle Food Bank strengthens the community through the power of neighbors helping neighbors, working to ensure all in our community have access to the essential necessities of living.”
‍
VISION: "We envision a strong and connected community in which all people have access to safe and nutritious food and the essential necessities of living."

VALUES:

✌️
compassion and respect

🙍🏼🙍🏽🙍🏿
diversity and multiculturism

🧑🤝🧑
collaboration and cooperation

🧑🏫
education and prevention

🧮
stewardship and sustainability

Site Audit

To best integrate the company's core values, I also researched WSFB's current website to understand their primary and secondary audiences as well as the relationships they hope to achieve with them.
‍
Primary: families and residents in WestSeattle zip codes that need help accessing food, emergency financial assistance, clothes, etc.
✨providing a quick and reliable supply to those in need
‍
Secondary: those who are concerned with or want to help with giving back to the West Seattle area. It could be volunteers, local farmers, wholesalers, and retailers.
✨creating an accessible way to donate for individuals
✨informing the community and advocating for food security

User Task Flow

After conducting user research, I selected a key user task that represents a short micro-interaction for WSFB's mobile website. Because donations are a priority task for the audience, I made a sequential list of all steps a user must take to complete the task as it currently exists.

I diagrammed the user task flow to clearly illustrate the user's journey between key stages and noted their pain points along this journey.‍

Wireframing

Most pain points that existed for a user were visual design and navigation related. Because the current mobile design had the logo encompass half of the screen, my wireframes included a smaller version of the logo that acted as a navigational component, leading user's back to the homepage of the website. In prioritizing the user's key tasks, I decided to make a scrolling horizontal bar in the first screen to easily let the user access different actions they could perform when visiting the page.

I minimized text content by adding a "read more" option to draw attention to the graphical/list elements. This is easier on the eyes, and encourages the consumption of other information on the page.
‍

Final Product