This is my journey of rebranding the website of 4 Culture, a non-profit organization based in Washington. From moodboards to the final prototype, I applied the Gestalt principles, typography knowledge, and color theory to create a new visual identity and website for 4 Culture.
Myself
2 months
Oct - Nov 2021
Figma
Adobe Illustrator
As a non-profit organization, 4 Culture's mission is to enhance the quality of life in King County by funding, supporting, and advocating for culture.
4 Culture is a cultural funding agency based in Seattle’s Pioneer Square neighborhood.
This organization reviews, fund, and provide support for four main areas: arts, heritage, historic preservation, and public art.
1. Connect the community: support local arts and cultural activities
2. Advocate for cultures: culture is essential and accessible to all
3. Good stewardship: transparent funding process with peers
At a first glance, 4 Culture's existing website violated many visual design best practices, such as poor alignment, too many font styles, and poor color contrast.
These issues resulted in a distracting website with a weak brand. Here, I took on the role to create a new visual identity for 4 Culture.
As the foundation of 4 Culture's new brand, I explored various moodboards and layouts.
Starting with numerous themes, these two stood out for their unique visual styles.
Based on feedback from senior designers, I decided to choose the red theme to portray 4 Culture as approachable and community-centered. Here, the red ties many cultures together as a color of celebration.
Using a system of columns, gutters, and margins, I wireframed two layouts: offset and aligned box styles.
The offset style appears more dynamic with more whitespace to promote readability. Hence, this style was chosen.
After a series of design iterations on the logo, typography, color, and imagery, I arrived the this new visual identity for 4 Culture!
Using Gestalt's principle of continuity, the geometric shapes create a 4 while the capital letters create a boxy look. This aligns with the overall geometric style of my website.
To create visual and content hierarchy for the website, I explored two sets of typography. With both desktop and mobile versions, this chosen set uses Playfair Display with Open Sans for a more playful and energetic feel.
This red monochromatic color scheme is powerful while providing a sense of unity for the community. The lighter red acts as the accent color while others support it.
A minimum transparency of 70% is set for solid box elements while a minimum of 80% is used for images.
I used realistic images about arts, cultures, and cities. It plays with different element transparency to make the visual hierarchy distinct.
Applying the new style guide, here is the new design!
