Digital Transformation for an Excellent User Experience

Client
Logo Stadtwerke Düsseldorf
Services
Design System, DXP, Development
Industries
Energy, Public Sector

Seamless Digital Solutions for Energy Supply

A first-class digital customer experience in addition to excellent service is Stadtwerke Düsseldorf’s strategy for standing out in an intensely competitive market. To strengthen long-term customer relationships, the existing web platform was to be developed further into a seamless Digital Experience Platform (DXP).

Since 2019, we have been actively driving this change forward as a close partner of Stadtwerke Düsseldorf - with strategic advice, in-depth know-how and the implementation of innovative, user-friendly solutions. This continuous optimization of digital services created a future-proof, high-performance infrastructure.

Iterative Modernization of a Complex System

The Starting Point

The Stadtwerke Düsseldorf faced a complex task: their existing FirstSpirit website had to be modernized and transferred to a new headless CMS: Storyblok. A complete big-bang rollout of the new development was out of the question so as to not affect ongoing operations. Instead, the aim was to adopt a step-by-step, modular approach that would fit seamlessly into existing structures and gradually replace them.

Central requirements and project goals:

  • Seamless evolution: Modernizing the platform without changing proven processes to minimize training effort.

  • Optimized customer journey: Improving the user experience through intuitive navigation and more efficient ordering processes.

  • Simplified management: A headless CMS would optimize backend structures and enable smooth integration.

  • Better employee experience: Content management will become easier through a modern CMS with intuitive operation.

  • Digital future-proofing: Migrating to modern technologies (Storyblok, Microsoft Azure) will ensure flexibility, security and long-term expandability.

  • Accessibility and self-service: Expansion of self-service areas and consistent implementation of digital accessibility for inclusive use.

Development of a Modular Design System

Our Approach

As part of the website redesign, we developed a modular design system that enables a uniform visual language and high scalability. Designed in Figma, it serves as the basis for reusable React frontend components integrated into the headless CMS Storyblok. Storyblok enables central content management, flexible delivery across all digital channels as well as improved usability and performance, which has a positive effect on SEO rankings. This Insights article highlights further reasons why switching to a headless CMS is worthwhile.

Additionally, the infrastructure was gradually migrated from an on-premises solution to Microsoft Azure. The combination of Microsoft Azure and Storyblok offers flexibility, scalability, and security. Digital accessibility requirements were taken into account, as the modular design system allows for the systematic implementation of accessible components. To ensure compliance with the latest WCAG 2.2 standards, the design was further refined in a dedicated accessibility project. Thanks to Storyblok, this updated version can now be seamlessly integrated on a technical level.

Integration of Modern Web Technologies

The portal was further developed using modern web technologies such as React with Next.js for website development and customized interfaces (REST, GraphQL) for connecting other services. This allowed us to seamlessly integrate self-service areas, recommendation marketing solutions and sales partner services for the B2B market.

Databases for storing products, orders and addresses were integrated into the existing system landscape to enable optimal data management and further improve the user experience.

Hybrid Content Migration

The migration of existing content posed a particular challenge. To maintain the quality and consistency of the content, we pursued a hybrid approach: While content with little complexity was migrated automatically, the transfer of more complex pages was carried out manually, including content optimization.

We successfully initiated and managed the transfer of more than 800 pages to the new system and content was specifically improved to ensure an optimized user experience.

You can find further insights into hybrid migration at Stadtwerke Düsseldorf in this insights article.

Advanced Services and Agile Collaboration

Thanks to an agile way of working, we were able to react flexibly to changing requirements and establish close cooperation with the Düsseldorf municipal utilities. In addition to UX conception, UI design and technical implementation, the multi-year project includes support, monitoring, maintenance and software testing.

Our team is currently working on the development of a new help portal that will further optimize the customer experience and enable users to receive targeted, more efficient assistance with the services offered.

A Future-proof Digital Experience

The Solution

Our close collaboration with Stadtwerke Düsseldorf has resulted in a modern, barrier-free and user-friendly web platform.

The most important advantages at a glance:

  • Flexibility and scalability: The modular design system enables quick adaptation to new requirements and consistent representation across all digital channels.

  • Optimized content management: The hybrid content migration meant that content could be transferred to the new system efficiently and with high quality.

  • Sustainable digital transformation: Continuous collaboration and iterative modernization ensure sustainable digital development and have created a future-proof technical basis with the new CMS.

  • Faster go-to-market: Quickly adapt to market changes through agile methods.

Stadtwerke Düsseldorf AG

About the Client

Stadtwerke Düsseldorf Dieser Link führt zu einer externen Seite , a leading energy company in Germany, relies on innovative digital solutions to offer its customers excellent services in the areas of electricity, gas, water and heat. Together with Ergosign, they are driving forward their digital transformation in order to continue to offer tailor-made, user-friendly and sustainable solutions in the future.

Ready for the Next Step?

Let's shape your digital energy world together.

We look forward to hearing your ideas!

Our privacy policy can be found here.
Patrick Alt

Patrick Alt

Principal UX Designer & Software Engineer, Head of Site Saarbrücken