Enel X Connect

Redefining EnerNoc’s Utility Bill Management experience (X Connect)

I was part of an ambitious project to redefine the new set of applications that would meet the market expansion standards that Enel was expecting.

• I worked as a Senior Designer, and used lean agile methodology to improve efficiency while focusing on customer value.
• The design of XConnect application took 14 months from start to finish and involved a team of 2 senior designers and 3 interns.
• Application was shipped to production in 2020 and is still being used today by Enel customers from US.

Business goals

Utility Bill Management (UBM) with Demand Response (DR) and among a few other applications were the most vital energy management applications at Enel X former EnerNoc. Through the years, the interaction model failed to meet users needs which required Data visualisation and Custom energy reporting among other important features. The initial business goals were to evaluate the entire suite of applications that EnerNoc had and to focus on redesigning the ones that bring the most revenue.

 

My involvement

I was initially hired to help improve the usability of UBM application while collaborating closely with the engineering team. After the scope of the business and goals have changed I received more responsibility and was personally in charge of:

• Running heuristic analysis to help solve current UI issues
• Researching Enel’s main competitors from the US energy market and document the findings
• The co-creation of the new design system and maintenance while collaborating closely with engineering team
• Data visualisation mock-ups and Prototyping
• Held Contextual interviews and Usability Testing sessions
• Workshop and presentations to internal teams (Product management)
• Collaborated and supported engineering teams from Italy, India and US
• Reviewed/validated design implementation along with engineering team
• Measured results and performance of final product using google analytics and contextual interviews

1. First thoughts: Heuristic analysis

With the new management team and the expanding user base, the customers asked for features that the current interface wasn’t able to deliver. When I was first introduced to UBM, I noticed there were a number of design and functional flaws:

• Very small font size, considering most users were over 40 years old 
• Missing of critical navigation functionality to find certain data (users had to click multiple times to get to a specific page)
• Users had to log in with same account on different Enel applications to compare data
• Filtering for specific results required heavy cognitive load
• Reporting feature was very cluttered and  required horizontal scrolling
• Missing data visualisation (customers had to use different application to generate charts based on their data)

To get these findings documented and get more insights on what wasn’t working for the users, I ran a Heuristic analysis following Nielsen Norman 10 general principles for interaction design. This was an important step towards improving and maintaining the current UBM application.

 

 

3. See what competition is doing: Competitive analysis

Before starting on the design of the new unified platform called XConnect, I wanted to see how other Energy companies from US are handling energy data management and customer expectations. The main focus of the analysis was:

• Data organisation & page layout structure
• Reporting & data visualisation
• Customer support area

 

Some of the main energy companies that I explored were E-On, Engie and Schneider Electric. Analysing competitors interfaces helped us get a better picture of what the legacy application was lacking and what can be improved.

 

Based on the findings and discussions with the Product team, we created the Information Architecture map that would be the backbone and point of reference for the XConnect application.

 

 

 

 

4. Defining design goals and roadmap: Prioritisation Matrix

I wanted to start the project with a clear set of rules that would define the new application. Some of the most important aspects that I wanted to achieve were confirmed during the customers interviews and research findings.

5. Components & Consistency

In order to have a consistent experience for the entire application, I collaborated with the rest of the design team and front-end engineering lead to create a Design System that would help us maintain consistency across the application.  The new design system was based on the Enel branding manual, and it was adapted to the internal application needs with custom components created by me and the design team.

 

 

6. Prototyping & Usability testing

To get realtime insights and validate new features quickly, we had usability testing sessions every 2 weeks with different Enel customers. This helped us make faster decisions on the new design features and avoid rework on some more complex user flows.

Some of the first pages that were tested with the users were the Dashboard which offered a cards layout that can be customisable based on users content priorities. This was a new feature that the customers liked especially since each of them had different roles within their company.

 

 

Other pages that were tested in usability sessions were the Billing, Budgets, Payments and Savings.

 

Viewing site’s address and editing in a side drawer.

Dashboard interactions:

• Exporting a report
• Editing card’s data
• Viewing data with different charts