Deep Carbon Observatory Website

In 2018, the Deep Carbon Observatory (DCO) embarked on a wholesale website overhaul of https://deepcarbon.net. The redesign was spearheaded by members of the DCO Engagement Team, Data Science Team, and Secretariat. A detailed survey of stakeholders and a variety of audiences informed the redesign, which also included input from internal committees.

I got the opportunity to lead the design effort, creating prototypes and designs in Sketch and handing the templates to a front-end developer. The Sketch designs included a suite of design patterns, icons, and styles.

The home page offered ample space for glorious photos, and clearly explained the purpose of the the Deep Carbon Observatory—something that was difficult to ascertain in the previous design.
One key improvement was the access to science features. The revised interface offered an easier way to read previous news without complicating the experience.
Special areas of research were given ample space for videos, project listings, and links to key papers. Examples shown above and below.
Each of DCO’s four communities required a special template to list decadal goals, guiding questions, steering committee members, and recent discoveries.
A nice feature was the ability to highlight recent science news with a prominent image.
A section on the home page was dedicated to the areas of scientific activity that included involvement of all communities. The box on the left (above) shows the hover state. The diagram below describes the proposed hover animation action.
The planning stage included rounds of group card sorting exercises to simplify the structure of the site.
A diagram of the image proportions used throughout the site.
Primary navigation styles. A comprehensive listing of site-wide styles is depicted below.