Eneco
From tiny cool concepts, to scalable design system
Van digitale rebrand naar één design system dat snelheid en kwaliteit bracht.
Intro
With the message ‘Welcome to the new world’ Eneco is transforming from an energy supplier that supplies electricity and gas to Dutch households to a sustainable service provider. I had a leading role in the creation of the concept, design and design system of Eneco.nl. Based on interviews, research and data, I worked closely with people from Eneco to renew the highly outdated Eneco website & app.
Challenge
How can I transform a written strategy to a sustainable design language? Can I find a way to keep consistency across different teams, with multiple designers and developers?
Outcome
A sustainable design language that not only reflect Eneco's design principles, but is also sustainable and ready to scale with its design system.
From strategy to design principles
The strategy was to make green energy attractive. Making this visible to different consumers in The Netherlands is a super cool challenge. In a small workshop with a few designers and stakeholders we came up with micro-concepts and visuals to define how this new strategy should feel like. With the same group we translated these concepts into so called design principles. These guiding principles were (and still are) the foundation of all the digital platforms. We made everything visual in a poster to inspire other designers, developers and stakeholders. We welcomed them in the new world.
From design principles to design
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
Wizard
Extending basic shapes to full screen principles
Deepdives
Dive into more detailed information when you want
Meaningful color themes
Using colors as a legend to enhance experience
Plot twist
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
Setting up customer profiles
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
Analysing key pages & journeys
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
Concept testing
What I do a different from regular designers, is starting with 75% of the test plan before designing anything. By having specific objectives, you also have more specific user stories to work with. This gives me and the team more time to get creative and brainstorm ideas based on our design principles.
We just created the right time to implement our tiny cool ideas! I made mobile and desktop designs for key journeys and product pages. Someone else did the actual test because I don't believe in doing a concept test with your own design.
From design to pattern library
My worst nightmare is inconsistency and when others start reinventing the wheel or use different patterns to solve the same problem. In 90% of all product teams this is also where the biggest waste of money is. To prevent this, I came up with three solutions that are still being used.
Creating a single source of truth
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
Documenting patterns
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
Defining the same language
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
From pattern library to mature design system
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
Company goals
- More focus on the problem
- Don't 'over' design
- Get grip on what's made
Design system purpose
- Create a universal design language
- Sustainable building blocks
Team goals
- Pattern based design
- Uplift journeys
- Uplift Mijn Eneco
Quality control in the Eneco design system
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.
Conclusion
Translating tiny cool concepts to a sustainable design sounds like a huge thing, but is pretty easy. The trick is to don't push them into your design, but implement them when the right opportunity is there.