UI/UX, Branding + Identity

4Culture
Rebranding of a Seattle arts organization.

a colorful logo resembling a 4, with a phone in front displaying the 4Culture web homepage
a colorful logo resembling a 4, with a phone in front displaying the 4Culture web homepage

Timeline

6 Weeks Winter 2023

Team

Individual

Roles

Visual + UI Designer

Tools

Figma, Photoshop, Illustrator

Overview

Context

4Culture is a multidisciplinary arts platform that seeks to support local artists in Seattle, WA

My Role

As a designer, I developed a new brand identity, digital assets, and re-designed the mobile flow to find a grant.

A colorful poster laying across a orange couch
A t-shirt with the 4Culture logo hanging from a cactus
A stack of buisness cards with the 4Culture logo
A grey wall displaying 4 posters with the 4Culture logo
A colorful poster laying across a orange couch
A t-shirt with the 4Culture logo hanging from a cactus
A stack of buisness cards with the 4Culture logo
A grey wall displaying 4 posters with the 4Culture logo

BRANDING

Logo

The logo is made of geometric shapes that vaguely resembles a person reaching out to reflect the community support 4Culture provides. The icon is also a 4 on its side.

The 4Culture logo
4 4Culture logos, displayed in 90 degree intervals
4 4Culture logos, displayed in 90 degree intervals

Color + Type

Primary colors make up most of the accent colors, while the background consists of neutral tones. The visual language is inspired by Bauhaus aesthetics, and remains playful while being modern.

The typography consists of HK Grotesk, a bauhaus-esque sans serif font that is both clean and modern.

4Culture typography
4Culture typography
4Culture typography
4Culture colors
4Culture colors
4Culture colors

INTERFACE

Current Brand + Heuristic Analysis

Logo is hard to see

No active button state

Redundant menu

Applications not on first screen

Process

I envisioned a modern looking website with bold typography and easy to use menus. I utilized dropdown menus to save space and prevent scrolling, and followed the information currently displayed on the website.

Inital wireframes for screens navigating to the grants and artist calls page
Inital wireframes for screens navigating to the grants and artist calls page

For the higher fidelity prototype, I refined the following:

  • Color integration

  • Active button states

  • Refined visual direction

  • Added screen to show expanded state

A higher fidelity prototype
A higher fidelity prototype

Deliverables

Previous pain points included:


  • A hard to see menu button

  • Unclear type hierarchy

  • Not enough spacing in the menu,

  • Too much text

  • Confusing menu

The new mobile flow adds :


  • Greater visual contrast

  • Images

  • Less dropdowns for the grants page

  • Condenses information

  • Responsive elements

INTERFACE

Current Brand + Heuristic Analysis

Logo is hard to see

No active button state

Redundant menu

Applications not on first screen

Reflection

Visual Systems

This project encompassed my first foray into visual systems and overall I am happy with how it turned out.  Being able to combine both research and visual design into a cohesive flow boosted my visual design skills.

There were several key things I learned:

  • Mockups + merch!

  • Heuristic analysis

  • Graphic design using Figma

Metrics

Although this rebrand was never implemented, these are some factors I would consider if it was:

  • Social media impressions

  • Audience retention on the website

  • Revenue from merchandise

  • Change in number of applicants

© Chris Sanders 2025
© Chris Sanders 2025
© Chris Sanders 2025
© Chris Sanders 2025
© Chris Sanders 2025
© Chris Sanders 2025