Cocoon Carbon

Identity & website for a low-carbon future

UI Design
UX Design
Cocoon visual system

The Challenge

Cocoon is pioneering low-carbon cement alternatives by transforming steelmaking waste into scalable replacements for traditional cement. Their breakthrough approach enables heavy industry to cut emissions without disrupting operations, a critical step for decarbonising global infrastructure.

But their existing visual identity wasn’t fit for purpose. Inconsistent visuals, mismatched illustrations, and generic stock imagery diluted the message. While the wordmark and colour palette had strength, the brand lacked clarity, authority, and focus. With ambitions to expand into new markets and reposition toward commercial partners, Cocoon needed a more professional, consistent, and scalable identity, and a website that told the story with confidence.

Cocoon billboard
Cocoon Eliot Brooks information card

We refreshed Cocoon’s visual identity, building on what worked while introducing a cohesive system rooted in clarity, authority, and innovation.

Outcomes

The new design balances industrial credibility with accessibility: a refined colour palette, engineered typography, and isometric illustrations to explain complex processes. Photography now conveys quiet precision and human purpose, celebrating materials, people, and transformation.

Alongside the identity, we designed and built a new website in Framer. Structured around Cocoon’s commercial audiences, the site combines clear navigation with scalable design principles, making it easy to adapt as the company grows. The result is a platform that communicates technical credibility, positions Cocoon as a leader in carbon reduction, and helps attract the right partners at speed and scale.

Cocoon design visual system

Built with modularity and developer-friendliness in mind

Our process began with an identity workshop, aligning the team on brand personality, target audiences, and visual direction. Together we defined Cocoon’s positioning: innovative, down-to-earth, and authoritative, credible without being cold, ambitious without overstatement.

Cocoon graph
Cocoon typography designs
Cocoon dark and light designs

Project Summary

From there, we refined core brand assets: simplifying the wordmark, establishing a disciplined colour and type system, and introducing grids, gradients, and illustrations that reflect Cocoon’s modular, industrial ethos. We also rebuilt the website’s information architecture, ensuring the content flow spoke directly to suppliers and manufacturers, not just investors. Prototyping and iteration in Framer meant the Cocoon team could see, test, and refine quickly, giving them confidence in both the brand system and its digital home.

Have a challenge in mind?
Let's solve it together.