Codestone invited us to design and develop their new website, with a special focus on:
· Creating a fresh and consistent UX & design system and art direction;
· Renew the website structure - to better reflect the company today;
· Present the growing Codestone services and solutions;
· Accommodate a vast amount of information with a clear and intuitive navigation system;
· Successfully migrate a huge archive of editorial content;
· Generate qualified leads through Hubspot CRM integration;
Codestones’ old website was based on a page builder loaded with plugins that were slowing it down.
For the new website, we opted for a native WordPress solution, keeping plugins to the minimum, just for SEO and GDPR management. A cleaner setup reduces errors and conflicts, improves performance and flexibility, and allows for a tailor made website front end.
As part of the discovery we created a content inventory and identified which content should be migrated to the new website and where Codestone needed to create new content. The blog and news content was migrated automatically, whereas we assisted Codestone in adding service content and optimising it for users and SEO. Hubspot was integrated for forms, chat and gated content downloads.
The design goal was to help solidify Codestone’s position as the Number 1 integrated ERP SAP + Microsoft Partner for small and medium businesses in the UK.
We created a fresh design system based on a new interpretation of Codestone’s brand book guidelines.
We aimed for a “clean-friendly-tech” style, with generous white space and bright use of colour - including a colour collection that we lovingly call our “Family of Greens”.
One of our main concerns was the sheer amount of information that the site has to support, both in terms of:
- Information Architecture: a large number of areas and pages on the Codestone offer (platforms, services, solutions, industries) and the need to build a scalable solution;
- Content: the actual volume of information inside pages - that, in many cases is considerable.
Because Codestone provides complete services for complex solutions, naturally they have a lot to say.
Bishop Desmond Tutu once wisely said that “there is only one way to eat an elephant: a bite at a time.” He meant that what seems overwhelming can be accomplished gradually by taking on just a little at a time.
We just had to present content in a way that didn’t overwhelm the user: one bite at a time.
To materialize Desmond Tutu’s methodology we worked to break down text walls and create a design system that allowed Codestone to serve content in snackable bites.
· We designed 49 different content blocks - with added variations like left or right content placement, aligned here or there, with image, text, photo or video, and button link or text link or no link… you get the picture;
· We compiled a library of over 70 icons to enrich the text with eye-catchy visuals;
· We explored all kinds of lists: from vertical only to full-width bullet-style lists, to horizontal column-style lists;
· We focused on keeping the user engaged with interaction and in-page navigation, creating opportunities to swipe, expand, drag and scroll in different types of tabs, accordions and buttons.
· We used animation as an additional way to involve the user, loading the elements in sequences that guide the eyes and help understand the content.
Codestone has a new tool for their most valuable new business channel: their website.
With a fresh and confident new look, better brand design consistency, and better performance, it reflects the brand’s position as the market leader.
Its content, while remaining extensive and complete, is easy on the eyes and shines with a dynamic presentation.
Their team has a library of solutions that allows a great deal of freedom in adding and changing content - and attracting new business leads.
