Full service strategy, design & web development

LeapFrog came to us with big ideas, big energy and a desire to reimagine their brand. With such huge success over the last 10 years in scaling their portfolio and creating real world impact, it was time for their branding and assets to reflect that maturity. LeapFrog required an evolution in how they communicated to prospective investors as well as their general communication, and were looking for efficiency improvements in how they handled their assets across digital and print, as well as social media and events.

Instance established a new branding strategy for LeapFrog that could be implemented across all their communication channels, with a clear method on how branding should be executed, a brandbook and design system for how their identity should (and should not) be used, typography treatments and scaling for all purposes, as well as colour, finishing, and animation.

We then optimised for AI discovery and performance which saw a significant boost in new users to the site.

A new design system

Design systems are often the unsung heroes of the products we use every day—from mobile apps and websites to the print design that surrounds us. They serve as the DNA for design, encoding the principles and elements that define the very experience users interact with. Colors and icons convey meaning, buttons are implemented with a consistent size and shape, and language is clear and understandable. Without a design system, you risk your users experiencing inconsistency, confusion, and a feeling of brand dilution, or frustration.

We developed a new design system for LeapFrog that could be applied to all existing and future assets, ensuring a clear set of rules were defined, organised and collated in a structured and usable manner for any designer to use. Clear instructions for brand treatments, logo, typopgraphy, photography and graphs were produced to create the ultimate resource for LeapFrog.

A precise mobile experience

As of 2024 more than 50% of traffic is mobile based so supporting smaller screens is not just important, but essential. Your digital products must feature an effective user experience designed specifically for the different audience and the limitations of their device.

We utilised intelligent development practices to enable the same content, imagery and video scaled precisely to mobile phones and other devices, while in depth and conversion focused User Experience design was used to ensure interactivity was intuitive and content discovery was seamless. We coupled this with detailed analytics to continually revisit how users were using the website to regularly make ongoing improvements to boost conversions even further.

Web design, web development, campaign microsites

We empowered LeapFrog to harness their new brand identity by building a flexible and powerful website that can be used to both communicate who LeapFrog are, their services and their differences in a competitive market, as well as support their marketing needs via rapidly developed campaign microsites.

We chose WordPress as the CMS for LeapFrog as the project was heavily leaning towards written content creation – we created a handmade & bespoke flexible page builder that LeapFrog could utilise to leverage the website in multiple ways, from simple content writing such as articles & press releases, to rich content editing such as case studies and portfolio pages. The scalable system we created allows us to add and remove components in the future, ensuring the website remains effective, performant and easy to use.

Multiple times a year LeapFrog will run marketing campaigns that require something more unique such as their yearly Impact report (https://impact2023.leapfroginvest.com). For these more complex requirements we developed a campaign microsite tool using Next.js that allowed LeapFrog to rapidly produce marketing material and lower their per year costs. A custom, interactive communication tool for their online marketing channel and boost engagement and leads.

AI Optimisation, the final piece of the puzzle

AI optimisation is about making sure your content is the one AI tools pull from, summarise, and cite. AI engines are trained to find the most trustworthy, clearly-stated, factually-grounded answer to a question, and it was our job to make their task easier. With that in mind, here's how we approached it for LeapFrog:

1. Content - We reworked LeapFrog's content to be as suitable as possible for AI, adopting a Question and Answer format where possible, with direct answers easily found and leading. We optimised headings to be questions and defined terms and entities clearly via concise summary blocks.
2. Data mapping & structure - We leveraged schema markup so AI can efficiently scrape LeapFrog's data, particularly products, product detail pages, organisation data, and linked reviews.
3. Technical hygiene - Beyond ensuring the site was performant, we paid particular attention to fast page loads, mobile-first layouts, and clear URL structures.

By reworking LeapFrog's website into a natural Q&A language style, backed by real proof of expertise and proficiency, and marked up with structured data, we saw a tangible increase in users accessing the site.