Creating a design system for a leading EV charging point manufacturer
The context
Rolec Services are the UK’s leading manufacturer of electric vehicle (EV) charging points, and they work with installers who are fitting their EV charging product.
They approached DPP with the idea of launching a new self-serve portal for Installers. The portal will be a one-stop shop, for everything Installers need to implement the product.
EV Charging
B2B
SaaS Product
Global
The problem
Rolec Services had so far not incorporated design when creating their products. This meant they weren’t designing their products with a user-centric approach and accessible UI.
They realised that over time, this gap in their process would eventually lead to competitors catching up to them, fewer user conversions and accumulating design and development debt — ultimately affecting their bottom line.
The objective
We were given 12 days to demonstrate how good design practices and process would enable Rolec Services to efficiently create and grow their self-serve portal, with an accessible and scalable design system that can continue to iterate and evolve with the business.
By creating a foundational design system with consistent and scalable styles and components, their design and development teams could save time and resources in the short and long term.
Need help testing and optimising your product?
We can help you rework the UX/UI of your business critical tool.
The approach
Conducted workshops with key stakeholders to understand their business objectives and explore the UI look & feel that best aligns with their brand.
Collaboratively documented their product’s core personas and Jobs-To-Be-Done within their self-serve platform.
Identified the main user flows and prioritised important screens to wireframe, and outline key components needed.
Designed a comprehensive UI design system, including colour, grid, effects and typography styles, and a large set of responsive components which can be iterated and built on moving forward.
Designed key screens in desktop and mobile. To showcase the flexibility and customisability of the new design system in action, we produced multiple versions to inspire Rolec’s team with their product’s new visual language.
“[TESTIMONIAL] Lorem ipsum dolor sit amet…”
— Name Surname, Job Role, Rolec Services
The result
The design system gave the internal team the confidence and ability to implement the new UI, and ensured consistency across their product.
A more efficient development team focussed on building components & the product, and an efficient way of rolling out products and iterations in the future as the business grows.
This in turn resulted in more smoother operations, enabling Rolec Services to digitise their service, requiring less intervention from the internal team.
By adopting a clear and robust design process, Rolec Services are able to make greater returns on their business:
Making operational efficiencies; digitising the process for Installers to onboard and deliver jobs, will require less intervention from the Rolec Services team.
Digitising the admin & self-serve tasks, means the Rolec Services team can focus on higher value tasks.
Investing in their product’s User Experience means happier customers with a higher NPS score, resulting in retained customers and higher word of mouth impact.
12
Days from kick-off to final deliverables
385+
Components designed
4.5/5
Clutch review
Need help testing and optimising your product?
Whatever your business objective — reducing operational costs, increasing efficiency, improving customer satisfaction or increasing revenue — we can help you achieve your digital ambitions.
