Key ESG design on iMac mockup - showing graphs





Key ESG approached us to build them a lightning fast website. Initially we spent some time consulting which technologies they should use, and expanded on the ones brought to the table. We advised using Next.js & Sanity due to the sheer scalability, ease-of-use and content velocity. What they found especially impressive was the ability to write content on the fly, and watch it update side by side (we've still not got over this functionality either).

Now we'd picked our stack, our eyes were set firmly on building the fundamentals of a design system. We almost always advise using Chakra UI, because unless you fancy shelling out 100's of hours of design time, it lays the baseline for you and speeds up the entire development & design process. Hell, we trust it so much, what you're reading right now is built with Chakra UI.

Homepage of Key Esg

Fully page-builder

Seriously, you read that right. Everything you see is completely customisable, hot-swappable and scalable. Not just this, but it also works perfectly with preview and simplifies the entire content publishing workflow.

What's really impressive is the speed at which you can use the CMS to pump out relevant and well thoughtout content. What's even more interesting is the custom SEO component we built especially for Key ESG, to ensure they have all the correct Meta and Open Graph information

Contact page of Key ESG that has calendly support and form builder

Form building

Everybody hates forms, it's a universal fact. We wanted to attack this problem head on by building a form within Sanity... but that wasn't enough. We ended up building a fully fledged "form-builder". This let the client fully add, arrange and move a two column grid - oh and did we mention it also integrated directly into their CRM with the correct labelling and everything. Not a bad feat.

Bonus points: The UX doesn't suck, it's incredibly intuitive and even slugifys the text to work perfectly with Hubspot

Jono took the time to really understand our specific needs and objectives and recommended us the most appropriate tools and ways of building/doing things. He's a great listener, always there to give advice and very proactive.

Pauline Misery - Marketing Lead

Future performance

We tried to push all we could with performance, ensuring every block is built with Next.js image, minimal library bloat and backed with Sanity's awesome Imigix rendering capabilities.

However, we still wanted to provide more value on top of this. We've have a hunch the latest version of Next.js will support Web Workers which essentially means the bloat of scripts such as Google Analytics and Hotjar can be offloaded and ultimately increase the speed of your website. Upon handover, we'd ensured all scripts had the ability to use this, and we will advise how to implement this when it is available for production websites.



Like what you see ?

Sign up for a 30 min chat and see if we can help

© 2024 Roboto Studio Ltd - 11126043

Roboto Studio Ltd,

86-90 Paul Street,

London, EC2A 4NE

Registered in England & Wales | VAT Number 426637679