Hammer Museum
Consulting Designer
2014
Creating the digital living room for a bold LA museum.
The Stage Gallery
Hammer Museum is a completely free, heavily endowed art museum in Los Angeles that is focused on creating a breathing space amid the LA chaos. Every day, events are happening that have nothing to do with art in the classic sense, yet envelop the art in its own contemporaneous world. It allows for juxtaposition and serendipity in a way that is unique. They are also fearless with what artists and events they will house.
When the museum wanted a digital home that matched its character and boldness, they contact my then-partner to deliver on the promise. We managed the design and overall project planning, and worked with Cast Iron Coding to engineer the site.
Starting Up
At the point in time when Hammer chose to redo their site, Flash was dead and responsive was just becoming a solution. This afforded big imagery, which was a strong suit for Hammer. It also allowed me to tuck secondary information in side columns on wide screens, but let it drop below the main content when on mobile sizes. Working this way was new at the time, and I worked with the great folks at Cast Iron Coding to implement it seamlessly.
Aesthetically, I wanted to celebrate that energy with a site that pushed art up against each other, and lived inside a continuum of events. The typography needed to be bold, and the architecture needed to be obvious (but allow for happy surprises).
One of the unique things about the project was the depth of curation that needed to be organized:
The museum has a bi-yearly Made in LA collection of local artists. Each artist needed a separate landing page, but they also needed to collect into a single grouping for the show.
The museum has extensive permanent collections that they have digitized for research and community outreach reasons. There needed to be a faceted search solution for the different use cases.
We needed to be able to present many different types of media in their natural form on many types of devices. Video was still a difficult medium to broadcast at the time. Most video from the archives was also digitized for on-demand consumption.
Existing Research and Prior Art
Hammer’s marketing team had two sides to manage, and the art community was the easier of the two. Like many large non-profits, the departments within Hammer were heterogenous on their needs and expectations. The marketing department conducted extensive surveying of the different department heads to understand what was important to them and critical to success.
Taking this foundational work, we also conducted competitive research on museum experiences, creating a map of the ecosystem that Hammer lived within. We both wanted the information architecture to be obvious and cause visitors to get lost in juxtapositions and related content. We also wanted to be differentiated and lean into the fearlessness of the institution.
Sitemap
Sample of Competitive Intel Workshop Material
Layout & Typography
We were clear on the needs, but a visual organization like Hammer needs visual concepts. Utilizing their rich media library, I started to look for ways to best represent exhibits and events in a way that felt organic.
Site Wireframes
At the same time as the design concepts, I created a wireframe web site to explore how each section would behave responsively. At that time, the idea of how content would collapse from a multi-column desktop grid down to single-column mobile device was difficult to understand. This allowed the Hammer Team to truly understand what we were building.
Final Product
-
![Hammer Home Screen]()
Home
-
![Hammer Detail Screen]()
Exhibition Detail
-
![Hammer Collection Screen]()
Collection Detail
-
![]()
Search Results
-
![Hammer EDU screen]()
Sub-brand Page
-
![Hammer Timeline Screen]()
Museum-wide Timeline of Events
Shipping it
I worked closely with Cast Iron Coding’s engineering team to see implementation through. In particular, Naomi Rubin and I worked through CSS and javascript intricacies together to make sure the site behaved as well as it looked. This was a Hurculean task due to the sheer quantity of templates and department-specific needs. Spirits remained high throughout it all, and we shipped the site out to the world.
Since then, the web site has flexed in new ways and changed some of the original design, but the bones are there over 10 years later. Building something that has lasting impact and can flex with an organization is monumentally gratifying.
Design Processes
Team Workshopping
Code-based Wireframing
Concepting
Competitive Review
Engineering Support
Design Systems
Information Architecture
Asset Management Design
Search Design
Stakeholder Management