Italian power company NeN energized by migration to Figma

29
November 2023

Belka’s Department of Energy is happy to announce that, with a little help from us, the digital product team at Italian energy company NeN has completed their migration to collaborative design app Figma, replacing a number of legacy tools.

This has been one of the most ambitious design system projects undertaken by Belka. In addition to supporting NeN’s migration to Figma, it also included the construction of a large design system with almost 900 components, as well as onboarding and training for NeN’s designers and developers.

Digital and mobile have been instrumental in NeN’s success, and the company is committed to maintaining its lead in product design. Founded in 2019 as a subsidiary of A2A, one of Italy’s biggest energy providers, the NeN quickly gained a prominence thanks to a strategy of digital-first.

“When it comes to the digital transformation in Italy, NeN is really a pioneer,” said Luca D’Incà, Belka’s General Manager. “We’re absolutely thrilled to have been able to help them make this jump,” Luca added, looking absolutely thrilled.

Belka not only supported us in reorganizing the design system on Figma, but helped us make our design process even more efficient by building a robust and scalable solution.

Alessandro Bider
Head of Customer Experience, NeN

A digital success story

NeN’s focus on digital products has been a big factor in the company’s success. However, in the aftermath of the pandemic their design team recognized the need to upgrade their working processes and tools.

Designers had been working with a combination of Sketch, Invision and Confluence — tools that have been largely made obsolete with the appearance of Figma.

The team was also in the early stages of formalizing their design system, but work on it was going slowly.

“At some point we realized that doing this ourselves was not sustainable,” says Francesco Cardascia, Brand and Product Designer at NeN. “So we aborted the mission and said, ‘Let’s take a moment to do things properly.’ And after seeing Belka’s work on the migration of Subito.it’s design system, we reached out.”

The big move

“This is probably the most technically advanced design system project we’ve ever done,” says product designer Mattia Marinangeli who led the work for Belka. “NeN has a mature and complicated digital product on multiple platforms, and a migration on this scale takes a lot of work from everyone involved, not least the team at NeN.”

The first phase involved taking embryonic design system NeN was in the process of building in Sketch and Invision, and migrating it to Figma, the collaborative online application that has quickly transformed the process of digital designing and development.

It’s simple, really.

“If you’re building a digital product today you’re using Figma,” says Sara Fazzini, Design Manager at Belka, who is currently researching design practices at tech companies. “It’s obviously so much better than anything else out there. But migration can be intimidating, particularly if you have a big legacy.”

In Figma, we restructured and strengthened the foundations of NeN’s design system, implementing a system of design tokens using Figma variables to ensure a consistent design system with dark/light themes and quick switch between NeN's main services. We also configured variables for automatic breakpoint and layout management.

{{bg-vid-1}}

Training wheels on

Ensuring a smooth transition for the designers and developers working on their product was crucial for NeN. To help them hit the ground running, we created documentation, and held workshops for the team with hands-on training.

“It’s not enough to have a fancy design system — the people working with it have to know how to use it,” says Mattia. “We wanted to make sure that NeN’s team didn’t just get a tool, but they would actually be comfortable working with it from day one.”

{{bg-vid-2}}

Happy ending

The project is now completed, and NeN expects it to be fully implemented by the end of the year. Meanwhile the team is already using the design system to build new features.

“We did our homework, studying the best practices of all the big players,” says Francesco Cardascia at NeN. “But to put it all into practice — actually building a design system in a pragmatic, coherent way that works and is easy to maintain — we couldn’t have done it on our own. Or if we had, it would have taken us three times as long, and taken our focus off our product.”

Giulio Michelon, Belka’s CEO, is characteristically enthusiastic about the outcome. “NeN’s design system is now clearly one of the most comprehensive and up-to-date in use at any Italian tech company.”

Related from Belka:

Want a safe pair of hands to help with your own design system?
Learn about Design System Checkup, our service to make sure your design system brings you results.

Design system magic.
Lights on, lights off.