P L

Challenge

Creating two museum identities under a unified brand

The Fine Arts Museums of San Francisco (FAMSF) is a non-profit organization which oversees two distinct museums in San Francisco — the de Young and the Legion of Honor — and stands as one of the most visited arts institutions in the United States.

The de Young is the arrow head for contemporary curation in the San Francisco Bay Area showcasing both modern and classic pieces. 

Code and Theory wanted to highlight the collection in addition to the prominent education programs and restoration labs. 

The Legion of Honor shifts more towards classic art, though also displays modern and some contemporary pieces with a prominent Paper Restoration Lab.

The goal was to allow the  two museums’ distinct personalities to show through; from their architecture to their curation and layout, while extending an eclectic and flexible overall approach for both sister museums under the FAMSF organization.

FAMSF wanted to reinforce the role of their organization website and highlight the unique personalities of each museum, while preserving the common values that unite them.

Approach

Museums highlighted over the FAMSF organization

The FAMSF organization’s main role is to get members to support the museums’ development through donation and membership. Since FAMSF has very minimal brand presence/awareness; most users or potential donors support one of the two museums over the less familiar over-arching organization. Hence, Code and Theory decided to scale back the emphasis on the FAMSF.org website, guiding users instead to each of the museums’ websites more directly.

Code and Theory redesigned the homepage, navigation, and several sections with a responsive design approach for mobile, based on modular structures to allow editorial flexibility. The Join and Give sections of the site were restructured and optimized, streamlining the utility and layout of page and ultimately encouraging more donations and memberships by design. Code and Theory also improved the treatment of Exhibitions and highlighted Special Exhibitions more prominently, distinguishing this content, and offering more opportunities for users to engage with imagery, familiarize themselves with the collection and learn more about the artists, and offering related content to continue to path users through the site. 

Code and Theory went further by introducing new structuring branding elements and shooting original photography to really create a completely new digital expression of the brands.

Solution

A contemporary design system capable of serving two eclectic museum collections

We believe that museums have an important role towards society to expand the audiences' horizons: by elevating their knowledge and perception, and engaging them on an emotional level.

This should be true for a museum’s digital presence too, distinguishing it as a cultural thought leader and source of inspiration and information.

Though utility is paramount, the sites inspire users as they discover the its content and navigate through exhibitions and collections. Code and Theory punctuated the bold design elements with texture, micro-interactions, modern color palettes and kinetic scroll effects to also reach the users on a more emotional level.

The resulting design system lets the two museums express their unique identities while maintaining a consistent visual language.