American Museum of Natural History / Article Design System
Project Description
The museum needed a system that would give them the ability to create highly engaging long form articles with a variety of media. The articles needed to be easily flexible for their diverse range of content while retaining a high level of visual fidelity and custom interactivity. High definition photography, interactive diagrams, videos, and all editorial content were all on the table.
Here are some live examples built with the system:
33 Million Things
The Tiniest Fossils
Nabokov's Butterflies
Role
I designed the system with our creative director and collaborated with the development team to deliver the museum the robust system used to create the Shelf life series.
Component Based Design System
Our design process was based on components, or building blocks, which allowed our client to easily build pages while retaining flexibility. Our components were designed to fit together seamlessly, and with configurable defaults. This allowed fonts, colors, and imagery to be customized to the article subject, while following rules that ensured they would retain aesthetic integrity. Our component designs included image galleries, full bleed images, interactive diagrams, and timelines.
In addition, our articles were fully responsive, functioning on tablet and mobile devices, with best practices for mobile usability taken into account.
Development Aware Design
Building a system that could be easily configurable required design to work with development from day one. We ensured that the museum could easily create articles with our system by working in lock step internally and with our client.
This allowed our development team to execute pixel perfect designs, and also to integrate them into the museum’s backend content management system. Our detailed guidelines had us diving into the details so that our client didn’t have to.
