erthos® is a biomaterials company reimagining the building blocks of plastics.
Our teams worked closely with erthos® to create a custom website that embodies the innovative spirit of the bio-plastics company. With a strong focus on accessibility, we created an experience that captivates visually while being inclusive for users of all abilities. The elegant motion and seamless transitions throughout the site reflect the forward-thinking nature of erthos®.
The Case
Crafting an award winning experience for erthos® to rid the world of plastics
“Own”
Understanding what the team needed from the site
erthos® had just rebranded, and the website is where most people meet the company for the first time. We brought the position that the site had to reflect the craft and attention to detail erthos® puts into its own work. The web experience is there to win brand and manufacturer conversations, to support a funding round, to recruit, and to establish category authority.
“Shape”
“We shape ideas into a clear experience strategy, built around your audience and your objectives.“
Most of our work sat in experience strategy. We shaped the site around seamless browsing, so moving through the story reads as one continuous experience.
The technologies introduced changed the sites theme, from the menu to the pages.
Underneath it we built a headless CMS system on DatoCMS with Next.js and dynamic templating, so erthos® can add pages, restructure sections and keep the site current as the company grows.
We wanted people to naturally go through erthos® narrative, learn about the product and become as captivated as we were.
Accessible, though motion-filled
For erthos®, we built a site that's both accessible and visually compelling. We followed WCAG standards to ensure compatibility with screen readers and keyboard navigation. This wasn't just about ticking boxes - we wanted real, seamless usability for all visitors. At the same time, we crafted thoughtful animations and micro-interactions that elevate the visual experience. It's this balance of function and form that we're particularly proud of. The end result is a site that works well for everyone while still delivering an engaging digital experience.
Asset handling for performance
We created a video and image system that downloads video's from the Headless CMS, optimizes the video for web and uses them from its own domain for performance gains and to remove the necessity to go on a paid plan. The videos are played only when they are in view and we use a new CSS performance boost called: content-visibility which disabled images and video from rendering when out of view.
"This project was all about showing people the vision and mission of erthos®. We got extra motivated due to the nature of this amazing company."
Mees Rutten, Founder @ Merlin Studio
Results & Ongoing Partnership
erthos® won Site of the Day on Awwwards, The FWA's and CSS Design Awards. We also won Developer Award on Awwwards. The website is often updated, gets traction from news sites and is often used in design inspiration directories. We look back on a positive collaboration that gave many insights during our retrospective and continue to work on projects.
More projects
_ Dior with GoSpooky