A site rebuild to Empower internal staff

Innovation Bay

We rebuilt Innovation Bay’s website to concisely convey the Innovation Bay brand story and empower their team to easily manage the content on their site. On top of a customised and streamlined backend, we’ve built a frontend that’s significantly faster, more accessible, and better for the environment.

Innovation Bay Summit Pitch Event

The Community for Aus & NZ Startup Founders & Investors

About Innovation Bay

Innovation Bay’s purpose is to create valuable membership communities made up of incredible humans from the tech ecosystem. They bring founders, leaders and investors together to share experiences and learn from one another through carefully curated events, programmes and content.

Knock it down, build it up

Web Development

The bulk of the work we did for Innovation Bay was development with a focus on creating a blazing fast frontend, powered by a user-friendly backend that enabled the Innovation Bay team to manage the site by themselves, which they couldn’t do with their previous site. We also provided a whole range of digital support in helping them secure their domains and provided an SEO plan.

Putting a print design on screens

Web Design

One of the challenges with this project was taking the website design Innovation Bay already had and adjust it to be truly adaptive, responsive design that worked in all browsers without compromising on their strict branding requirements.

How We made it Happen

the Tech We Used

wordpress

React

Figma

Google
Analytics

Data Studio

“We recently asked Rik and the team to help us relaunch our website.  We could not be more pleased, not only with the end result, but the process.  The team was professional, on time, creative and effective in delivery.  I’m passionate about promoting great brands and this is one of them. Thanks Rik and Jesse for all your hard work!” 

PHAEDON STOUGH | CEO & CO-FOUNDER, Innovation Bay

Disconnecting medium from Message

Making a print design screen-ready

At the start of the project, Innovation Bay already had a website design that wasn’t quite complete.

We set out to create a better design that was flexible and worked adaptively with screens. We worked with Innovation Bay to clarify what elements needed to stay to maintain the integrity of their brand without compromising on accessibility or user experience.

One of the additional considerations was ease of editing for Innovation Bay’s marketing team. We made sure that our final design and the site we built from it were easily editable by the Innovation Bay marketing team so they can do their best work with the least friction possible.

Form & Function

Style guide Challenges

Innovation Bay had a large style guide, but it didn’t properly cover any screen applications. Strict adherence to this style guide in the past had led to broken layouts and unintentionally hidden content on their old site.

We worked with Innovation Bay to find the right solution that connected their brand elements and digital usability.


Shape system

One of the ways we did this was creating a design system that adds Innovation Bay’s brand shapes to any element on the page.

This allowed us to integrate important parts of the Innovation Bay brand to any block in the Gutenberg editor with ease, with minimal impact on performance and no chance of breaking any layouts.


The Brand Colours

Innovation Bay’s style guide defined a palette of specific colours, and one of the non-negotiable parts of the build was integration of this specific selection of colours.

To make things easy & consistent for the Innovation Bay team, we created custom Gutenberg blocks with a customised palette that provide colour options from this palette accessible by a single click.

We also made sure that any custom-coded parts of the websites used the same palette. To ensure consistency, we added these colours to the site as CSS custom properties, and called them rather than setting static colour values during development.

On brand, Fast, Accessible

A frontend that exceeded requirements

We built the frontend of this website to exceed expectations. It meets all of the brand & design requirements Innovation Bay has, adds on exceptional performance & pagespeed, a huge list of accessibility improvements, a great user experience, and a massive reduction in energy usage & carbon production.

Lighthouse Test

These results are from mobile Lighthouse tests on home pages, conducted on the same device.


Before

Performance – 77

Accessibility – 89

Best Practices – 92

SEO – 67

New Site

Performance – 95

Accessibility – 98

Best Practices – 100

SEO – 100

WAVE Accessibility Evaluation

These results are from audits of home pages.


Before

Errors – 28

New Site

Errors – 0

Website Carbon Calculator

These results are from audits of home pages.


Before

Worse than 99% of websites

6.78g CO2 / pageview

New Site

Better than 79% of websites

0.16g CO2 / pageview

Nothing but custom

We built the backend of the site with ease of use in mind, with a strong focus on getting the on-page editing experience right.

There’s virtually no difference between how content is displayed in the editor & the site’s frontend, and our implicit, adaptive design system allows the Innovation Bay team to easily copy and paste content & layouts to any part of the site they need them.

We worked closely with the Innovation Bay team to customise the structure & functionality of the backend to fit their needs & workflows exactly.

“The team at Kings Digital were such a joy to work with. They customised and cleaned up the backend, in the process, completely simplifying the user experience so that continual website updates are made so much easier and without the need to learn code. They also provided concise and easy to follow training so that there were no grey areas. What you see on the front is mirrored in the backend which minimises the guesswork. We’re really proud of our new website and super thankful to Kings.

Ella Petite | Head of Marketing & Comms, Innovation Bay

TRANSFORMING YOUR ONLINE PRESENCE

We help you grow your brand by providing guidance across all of your digital touch points. We collaborate with a range of clients to create beautiful web design, strong brands and performant digital marketing. We’re a team who are driven to provide technically excellent, human friendly and results driven solutions.