Greensync
Building a little grid with a great deal of energy.
How do you articulate the brightest ideas in energy, when people are completely in the dark about the current state of play?
GreenSync is a global energy-tech company using innovation and imagination to completely revolutionise electricity markets around the world.
How? By creating a range of software platforms, hardware products, and other solutions designed to optimise every aspect of 'the grid'.
The potential benefits are huge. As part of their vision for a brighter future in energy usage, GreenSync connects millions of smart energy resources to create dynamic electricity grids that are cleaner, more cost-effective, and ultimately better for everyone: commercial business, power generators, everyday homeowners, and the environment.
The problem
Incredible innovations can sometimes be difficult to understand. GreenSync's products are groundbreaking and highly complex, but they need a compelling, simple story.
The approach
To get into the collective heads of GreenSync, we embedded an August team to encourage ongoing collaboration and clarity, and keep things powering to schedule.
The end-game
Create a clear and captivating narrative for GreenSync, articulating how their technology solves problems and creates opportunities. And critically, whom for.
The brief was to make a complex innovation–the trade, accumulation, and distribution of energy–feel attainable.
MAKING CONNECTIONS
Before you can improve a story, you've got to understand it comprehensively.
To get into ‘the grid’, we conducted a series of deep-dive presentations and workshops. We had to learn, and then more effectively highlight, how each piece of this intricate puzzle fits together. Then, how different participants can interact to share in cleaner, more cost-effective power.
We also ran several early design sprints—collaborative sessions where everyone in the team draws up potential solutions to the problem at hand—to ensure we could hand-pick the brightest ideas from multiple brains. And, give us a comprehensive insight into the way energy specialists conceptualise their content.
PROBLEMS, PATHWAYS, AND POSSIBILITIES
We had to create different pathways for each audience, while offering easy education into the current problems and future possibilities of electricity management.
All while clearly guiding people to the right information and the most appropriate products.
'Opportunities like GreenSync don't come along frequently.
Take an energy-technology startup reimagining something that affects all Australians, run by an interesting team of smart, value-driven people who love what they do. Throw in a shared appetite for creativity and innovation, and you’ve got a great project.’
Mark Davis, Engagement Director
Lightbulb moment: we had to show the bigger picture at play.
THE GREENSYNC GRID
If 'the grid' is vital to understanding GreenSync's technology–and it's a physical landscape–why not go ahead and build one?
We created a miniature digital grid to tell the GreenSync story quickly. Doubling as a navigational mechanic throughout the website, it also prompts people to explore the products in the most accessible and efficient way possible.
"Your approach helps us tell our story as win-win-win-win, for government, utilities, retailers, and customers."
Dr. Phil Blythe, CEO, GreenSync
'With the complexity of the content, it was obvious that copy and written words alone wouldn't cut it.
GreenSync talk to so many audiences, and those audiences are interacting among each other in a variety of different ways themselves. Why not tell their stories in multiple mediums—animation, text, drawings—to accommodate different preferences and understanding?’
Elliott Grigg, Senior Copywriter
SEGMENTING AUDIENCES
Identifying broad markets with miniature tiles.
Each illustrated ’tile’ on the grid represents a specific audience or major market player.
Subtle visual cues in the landscapes convey the difference in audience segments, and hint at their key concerns. The idea is to make it easy to understand where everyone fits and how each party can benefit.
For example, we articulated the distinction between new energy service companies (with a focus on renewable energy generation) and electricity networks (who largely maintain infrastructure).
We explored a range of illustrative styles before settling on a minimalistic approach, for flexibility and legibility.
'The challenge was creating distinctive landscapes with no labels, just architectural and urban hints.
And then, ensuring the tiles connect in any configuration, to represent the transactional nature of GreenSync’s products and their relevance across the entire grid.
We chose a minimalistic illustration style to ensure flexibility and that the tiles themselves can evolve in coordination with GreenSync’s products and audiences.’
Mel Bruning, Designer and Illustrator
MORE QUALIFIED LEADS
The segmented approach continues in the form of a dynamic in-page signup tool in the global footer.
Designed to help GreenSync process inbound enquiries more efficiently, the sign-up mechanic filters enquiries based on world location and audience sector.
Armed with context, the GreenSync team can better tailor ongoing communications to whoever’s getting in touch.
BUILDING THE GRID
Each tile is built from a bespoke isometric illustration, rendered as a scalable vector graphic.
The tiles are animated to highlight audience interactions and the trade of energy through the GreenSock platform, GSAP.
We originally researched a variety of abstract interactions in the hopes of clearly showcasing the trade, storage, and accumulation of energy, before ultimately settling on the Tetris-style fluid grid seen below.
See the Pen Isometric Squares by Matt Agar (@agar) on CodePen.
Rather than try to show electricity as a commodity, it was easier—and clearer—to highlight a sense of flexible interaction between multiple different parties.
Utilising the tiles
Beyond the homepage header and navigation, the tiles feature prominently throughout other areas of the site.
Detailed elements of the illustrations are plucked off the landscapes and peppered throughout the content to add visual cues and promote greater understanding.
The tiles have also made the jump offline and into the real world. The miniature grid has been so well received it is now part of GreenSync’s consistent and ongoing brand language in brochures, signage, documentation, and more.
VISUAL LANGUAGE
GreenSync is all about bold innovation, bright ideas, and sustainability. So is their digital design identity.
From a design perspective, GreenSync wanted to blend easy sophistication, forward-thinking innovation, and pragmatism. They’re ground-breaking, but they’re grounded and highly approachable too.
GreenSync’s sense of multiplicity is reflected in the visual language used throughout the site. There’s a mixture of photography, illustration, animations, and icons.
Pages are designed with a series of replicable, alternating elements, to ensure all content can be structured with space to breathe while still feeling cohesive.
'Rather than blend everything together and create something overly busy or forced, it felt more effective to go the other way: pull back and let different ideas and elements exist in isolation.
Once we had a palette of elements, we could link the content conceptually through subtle visual cues. One example is the grey-on-white grid lines that subtly draw your eye through written content and hint at power lines, or the isometric perspective used in the illustrated grid tiles.’
John Broadfoot, Senior Designer
RESULTS
More engagement, greater efficiencies.
Our tracking shows many more people are using the site, spending more time than they did before, and viewing more pages.
They’re accessing content much faster, with average page-load times nearly halved since the new site launched. And the team at GreenSync are using their new website to better educate clients, partners, and collaborators on their products.
RESULTS SINCE LAUNCH
- 64%increase in average session duration:
People are staying on the site longer.
- 27%increase in pages per session:
People are browsing more content on each visit.
- 47%decrease in bounce rate:
People are finding compelling, engaging content that meets their expectations on arrival.
ALL SET FOR GREENER PASTURES
Head over to the new GreenSync site now to explore the grid and find out what the future of electricity means for you.
There’s all kinds of information on the past, present, and future of energy consumption in commercial and residential sectors. Plus, it’s all easy to understand and engaging.