Direct-to-customer energy retail
Salesforce platform for sales & service
forwerts & slashwhy
This project was realized within the slashwhy corporate group by partner company forwerts. forwerts is a digitalization and design consultancy focused on UX and CX strategy, service design, and strategy consulting. An interdisciplinary team of designers and strategists successfully brings digital products to fruition, even in complex corporate environments. Together, slashwhy and forwerts offer consulting, design, and development from a single source: from strategy through implementation. forwerts works across industries, with a focus on energy, industrial, technology, healthcare, and finance sectors.
Services
UX Strategy Consulting
Technologies/Methods
Process Analysis & Optimization
Salesforce
Design System (Atomic Design)
Prototyping
A/B Testing
User Testing
From umbrella brand to direct online sales
The client is a large energy provider that had long operated primarily as an umbrella brand for several regional utilities. Until now, the company had left the online marketing of electricity and gas to end customers to its affiliated regional utilities. That was set to change. On one hand, there was a need for technical modernization and process optimization: orders ran through separate systems belonging to the individual utilities, systems that had grown independently of one another, were technically outdated, and no longer met the industry's legal requirements. On the other hand, the company wanted to start selling electricity and gas online under its own brand in the future.
The project's goal was therefore clear: to sell electricity and gas online under its own brand for the first time, and to create a future-proof technical platform that could scale for new products and bundled offers, and eventually replace the regional utilities' systems in the long term.
Self-service under the provider's own brand: the new customer portal brings together contracts, meter readings, documents, and tariffs in one place, in the provider's consistent visual identity.
User-centered processes & digitalization
Process optimization & automation in Salesforce
At the heart of the project was building a shared platform for the ordering journey, customer portal, and service portal in Salesforce, combined with optimizing existing workflows in collaboration with the client. Core processes were first analyzed and refined, and over the course of the project were not only digitalized but, wherever possible, automated. Sales and service have worked in the same interface ever since, enabling seamless collaboration between the two areas. In service, automated checks noticeably reduce the manual effort involved in contract processing, allowing staff to focus more on actual customer care.
A shared web platform, optimized for multiple user groups
Alongside internal users, particularly service staff, the end-customer user group, with fundamentally different requirements, was equally central. For a system serving two such distinct user groups, a user-centered approach was an essential requirement from the outset: end customers looking to sign up for and manage tariffs have different needs than service staff, who handle operational tasks in the system every day. That is why service staff in particular were involved early in the project, to understand their actual needs. One concrete improvement that emerged directly from this is optimized tab handling: service staff retain context during a phone call without having to switch between windows.
One interface for everything: sales and service handle inquiries, contracts, and reports in a single place. Rather than relying on Salesforce's standard components, forwerts focused on developing custom frontend components.
Modular design system & digital accessibility
Custom components for a consistent brand experience
Building on Atomic Design principles, forwerts developed the client's existing corporate design into a modular design system. Rather than relying on preconfigured standard components, forwerts used custom frontend components to ensure a consistent brand experience across all digital touchpoints. As a result, the energy provider's brand remains visible even where many providers rely on interchangeable building blocks.
Digital accessibility & an intuitive UI
The design system also forms the basis for an intuitive, accessible UI that appeals equally to both user groups. Digital accessibility was an important and forward-looking client requirement, given the accessibility legislation announced well in advance at the time. As a result, forwerts' UX experts factored WCAG 2.2 AA into the ordering journey and portal from the very beginning, not as a subsequent fix, but as part of the concept and design process from the start.
Optimal collaboration between design & development
Synchronizing disciplines across the project
A project of this scale brings many disciplines together: UX, UI, frontend, backend, and solution design. Previously, these strands ran through separate teams that coordinated their work only loosely, causing design and development to sometimes proceed in parallel and past one another's goals. forwerts redefined how the disciplines worked together, reducing development effort and ensuring a consistent solution across all areas.
Long-term collaboration beyond rollout
Going live did not mark the end of the project. The energy provider continues to rely on forwerts' expertise for the long term: both the Salesforce platform for sales and service and the customer portal are being jointly developed further, continuously enhanced with new features, and optimized. This allows end customers to gradually handle all of their needs through self-service, while the product range keeps growing step by step. What began as a single project has grown into a lasting partnership that continues to carry the solution forward.
Before we built a single component, we analyzed and questioned the existing processes together with the client. Good UX doesn't start in a design tool, it starts with understanding how people and processes connect.
Dennis Belzner
Managing Director & Partner at forwerts
What made this project special was that we didn't treat Salesforce as an off-the-shelf toolkit. Our own design system lets the brand fully come through in the frontend, with sales and service both working on the same foundation.
Sarah Mager
Principal UX Manager at forwerts
The challenge was building a system that serves two such different user groups equally well. That only works if you truly understand both sides' processes and needs before you start designing and developing.
Oliver Ivic-Matijas
UX Expert at forwerts
Achievements & Outcome
More contracts, better service & a scalable web platform
Scalable platform created: The architecture, combining a central Salesforce backend with a modular design system, is built so that new products, bundled offers, and additional brands can be integrated without major restructuring. On this foundation, the platform is continuously expanded in further development stages.
Sales targets significantly exceeded: Within just the first three months after launch, over 10,000 contracts were signed, well above the target set by the energy provider.
Conversion rate above target: Ongoing A/B and user tests continuously provide insights into end-customer behavior, enabling targeted refinement of the ordering journey.
Self-service established for customers: End customers manage contracts, installment payments, and requests themselves in the portal, no longer relying on customer service.
Service quality improved: Automated processes noticeably reduce manual effort in service while also increasing processing speed.
Service staff relieved: With a 360-degree view of all relevant customer data in a single interface, service staff resolve inquiries faster. Optimized tab handling supports them during ongoing phone calls as well.
Cross-disciplinary collaboration optimized: Clearly defined workflows between design and development replace the previous side-by-side work of separate teams, shortening feedback loops and reducing development effort.
Consistent brand experience ensured: The modular design system ensures that brand identity is consistently experienced across all digital touchpoints, independent of Salesforce's standard components.
User satisfaction increased: Systematically collected user feedback on the ordering journey and web portal is consistently positive, confirming the improved digital experience for both user groups.
FAQ
A digital ordering journey is the online process through which customers select, configure, and complete the purchase of a product. It guides them step by step from initial interest to signed contract, for example when signing up for an electricity or gas tariff online. How well an ordering journey is designed shows up in metrics like conversion rate and the drop-off rates at individual steps, both of which can be continuously improved through A/B and user testing.
Both often draw on the same underlying data but serve different user groups. A customer portal is the self-service interface for end customers, where they manage their own data, contracts, and requests. A service portal is the working environment for service staff, where they access many customers' records to handle inquiries. When both are designed on a shared platform, end customers and service work from a consistent foundation.
Digitalizing an existing workflow unchanged also carries its weaknesses into the new system. That's why it pays to first analyze and simplify processes before mapping them digitally. This removes unnecessary steps instead of cementing them in place. Only on this cleaned-up foundation do digitalization and automation deliver real impact, because they build on deliberately designed workflows rather than ones that simply grew over time.
User-centered design means building a portal around the actual needs of its user groups, rather than around internal structures or technical constraints. That requires understanding those needs early on, for example through user research and usability testing. This becomes especially important when a system serves multiple groups with different requirements, since their expectations for features and usability can vary widely. A user-centered portal lowers barriers, increases adoption, and eases the burden on customer service at the same time.
Salesforce is a cloud-based platform that originated in customer relationship management (CRM) and is now also used to support sales, service, and other business processes. It can be tailored to a company's requirements through configuration and custom development, and can serve as the central system behind applications such as an ordering journey or a customer portal.
A design system is a central collection of reusable design building blocks, rules, and principles that define the look and behavior of a digital application. It goes beyond a simple style guide or component library, because it connects design guidelines with ready-to-use components. Design systems are often built on the principle of Atomic Design, where complex interfaces are assembled from small, combinable base elements. The benefit: a consistent appearance across all touchpoints, faster development going forward, and better scalability as new products or brands are added.
A consistent brand experience ensures that a brand stays recognizable across all digital touchpoints, from the ordering journey to the customer portal to the service interface. This builds trust and recognition, and avoids the impression of an interchangeable, off-the-shelf solution. A proprietary design system is an effective way to achieve this, as it anchors brand identity firmly in reusable components, independent of the standard building blocks of the underlying technology.
Digital accessibility means designing digital applications so that as many people as possible can use them, regardless of limitations such as vision, hearing, or motor impairments. The key international standard is the Web Content Accessibility Guidelines (WCAG), often at conformance level AA. In Germany, the Accessibility Strengthening Act (Barrierefreiheitsstärkungsgesetz) makes accessibility mandatory for many digital offerings.
A customer portal serves a broad and diverse range of end customers, which makes digital accessibility especially relevant here. There's also a legal dimension: the Accessibility Strengthening Act (Barrierefreiheitsstärkungsgesetz) makes accessibility mandatory for many digital consumer offerings in Germany. Building accessibility into the concept early, rather than adding it afterward, not only meets legal requirements but also saves effort and creates a product that reaches more people.
Looking for answers?
Looking for a partner for a joint project, or want to hear our experts' take? Feel free to send us an email, or find more contact information in our contact section.
