Greensync

A highly complex and innovative project, designing a user-friendly interface for a brand-new low carbon technology asset register, commissioned by The Department for Energy Security and Net Zero (DESNZ).

Project Goal

Collaborating with cross-functional teams, crafting a visually appealing and
highly functional User Interface. Exceeding clients expectations and meeting all requirements, whilst exciting the final customer and solving user problems.

Collaborating with Developers, translating technical needs into an intuitive experience. The final product will serve as a crucial tool in advancing the government’s Net Zero initiatives.

Roles

  • User Interviews

  • Collaboration with Project
    Strategists & Developers

  • Design Wireframing, Prototyping
    & Annotations

Tools

  • Figma

  • Miro

  • Google Workspace

Year
2025

Client
Greensync

Investigative Analysis

The back end of the asset register app had already been built by the developers when I came to assist on the project, displaying the data that would be used by operators managing the installed low carbon technology products such as, electric vehicle chargers and solar panels.

Testing the existing User Journey

With the data of the application displayed with some functionality, I extensively tested the existing application and identified usability issues and ideas to ensure its functionality and visual design.

  • I identified that the page navigation didn’t include all essential page headings.

  • Inconsistency with button designs.

  • Inconsistency with call to action names such as ‘delete’ and ‘destroy’.

  • Branding was inconsistent and unclear.

  • Unclear call to action buttons, with confusing colour differentiation from other information.

  • Identify what the Operators will be looking to use the search bar for.

User Interviews

I interviewed the engineers that would be using the asset register to input data from their installation jobs. I gathered insights listening to their frustrations and observing their mental models. Users echoed the similar issues that I identified during testing;

  • They found the page navigation headings misleading and didn’t show the data that they expected upon clicking on the heading.

  • Users found the terms ‘delete’ and ‘destroy’ very confusing, did they mean the same thing or something completely different?

  • Page navigation headings could be more concise, they would expect to find ‘De-registration requests as a subsection under ‘Registration Requests’.

  • The use of green to highlight some words and call to action buttons was confusing for users. Unclear call to action buttons, with no use of buttons or highlights to differentiate from other information.

Page Navigation - unnecessary and unclear headings that can be organised in to subsections.

Inconsistency with button designs and colours. (Some bright blue and some bright green). Causing user confusion.

User Feedback

Following my interviews with the engineers (users), they provided some excellent insight in to the key

functionality and features that they would find useful from the application.

  • Operator login functionality.

  • Dashboard showing core KPI’S, with an indication of urgency.

  • Ticketing System to register existing and new assets. With the functionality to track their own and colleagues actions and tasks.

  • Track new participants (third party asset providers). 

  • Discount Token System for new participants upon registration.

  • Identify missing data and incorrect data with prompts to Operators to gather and input missing information.

  • Identify New Device configurations and identify the product that has been installed.

  • Functionality to authenticate tokens for new participants.

  • Be able to see how many participants want access to the Asset Register.

Brand inconsistency through colours and icons.

Features

During meetings with the Head of Product, Developers and Operators (users), we identified features that would be useful and effective for the user navigation. These included;

  • Dashboard to view statistics, to view the registration requests (new product installation requests) to identify which have been verified, rejected, and unavailable for verification.

  • Map to locate where the low carbon technology products are located and to see which UK regions have dominant coverage.

  • Drop down menu to consolidate Participants ‘Third party asset providers’ and discount tokens they have achieved.

  • Activity feed for updates, notifications and operator activity logs in chronological format.

Design Solutions

Greensync Brand Kit

Brand Colours

Brand Icons

Brand Logos

Design Solution

Visual Identity

Brand Identity The original design used a standard "enterprise" palette of dark blues, greys, and yellows for status indicators. I incorporated the greensync brand kit across the whole of the UI, introducing the vibrant high-contrast lime green and teal palette against a deep charcoal background, giving it a much more energetic, "Clean Tech" brand identity.

Typography I updated the typography throughout the design, using a modern, rounded geometric sans-serif, which feels friendlier and more professional than the standard system fonts used in the original.

Search Functionality I moved the search bar from a centered, understated position to the top-right, following common UI patterns for modern web apps, making navigation familiar to the user.

Spacing & Icons I used a dark header with white content cards, reducing the number of small interface elements, reducing visual noise, creating stronger contrast and a more premium feel. I incorporated icons from the brand kit, making the design look less utilitarian and more finished.

Design Solution

Dashboard

I redesigned the dashboard from an admin UI into a cleaner, more polished product interface with stronger hierarchy, better spacing, and a more modern visual style. The biggest changes are in navigation, card layout, chart presentation, and overall branding.

Before

After

  • The navigation moved from a dark left sidebar to a top navigation bar, making the new design feel less like an internal admin tool and more like a consumer-facing web app.

  • The branding was simplified. The first design uses “GreenSync LCT Connect” with a sidebar-heavy structure, while my redesign uses a more minimal logo and a broader top header.

  • The content layout became more structured. In the original design, the dashboard was split into many uneven cards and panels, I reorganised the information into a clearer grid with consistent spacing.

  • Information hierarchy was adapted to summarise KPI’s, making the key metrics easier to scan quickly before looking at the data charts below, allowing the dashboard to read in a more logical flow.

  • My design uses larger spacing and clearer card boundaries, improving readability.

  • Users requested an Activity feed for updates, notifications and operator activity logs in chronological format with the functionality to track their own and colleagues actions and tasks.

    I designed a notification bar displaying the users and their colleagues recent changes along with refused and accepted registrations, creating a sense of urgency and guidance to address what tasks needed their attention. Users can also view and get in touch with colleagues that are actively online.

Overall, the Dashboard redesign replaced ambiguous navigation and inconsistent labeling with a clearer hierarchy, cleaner grouping, and better visual cues. Making the user experience easier to understand and the navigation inline with user expectations, addressing users original frustrations of heading not showing the data that they expected upon clicking.

The redesign appears more polished and contemporary, with a stronger design system and better use of visual hierarchy, improving how users move between list, detail, and configuration states, rather than forcing everything into one crowded table. The spacing and for admin tools because it reduces cognitive load and makes frequent tasks feel more efficient.

Design Solution

Registrations

I Redesigned a dense registration management table into a cleaner, more intuitive workflow, improving hierarchy, scanability, and action clarity.

Before

After

Feedback was given that the redesign significantly lowered the "cognitive load" for the user by stripping away technical metadata (like the JSON block) and focusing on high-level management tasks.

  • The original design appeared as a dense admin table with many visible columns at once, I created highlighted tabs, with call to action colours that clearly displayed the registration requests that required attention.

  • Users felt confused by the use of call to action colours, I made these clear and consistent throughout the design providing a cleaner more guided workflow for reviewing requests.

  • I improved the visual hierarchy by finding out the key information that users would immediately need to see when navigated to the page. I created a filter to search through the registrations by user relevance. I also improved visual clutter by truncating long numbers such as the MPAN and Serial Number.

  • Each individual registration can also be clicked to view further details about that registration. Resulting in a cleaner, modern UI, making actions feel intentional and easier to access and digest.

  • I categorised all registrations under the same page. Originally registration and de-registration were two completely separate pages. Making user navigation more concise and fullfing user expectations.

The new design transforms a crowded registration table into a more intuitive admin workflow, improving clarity, interaction quality, and overall usability.

Design Solution

Device Configuration

  • Information Hierarchy: The Device configuration page was of high importance and a page commonly used by the users. Originally device configurations were listed at the bottom of the navigation bar. I moved it to the third page to be selected on the navigation bar, along with its own dedicated page to manage and create new Device configurations all within its own categorised page.

  • Actionable Elements (Buttons): Users were confused by the use of colour in the orginal design, unsure of what information was an action button or not. I created prominent pill shaped, brightly coloured buttons in the redesign (e.g., "Create New") to clearly signal the "Primary Action" for the user.

  • Status & Feedback: Users requested clearly presented KPI’s to create a sense of urgency when looking at Device Configurations. I created a "Known Configurations" counter which provides an immediate summary of the system state, compared to the original design requiring reading through a list or JSON payload to understand the configuration status.

  • Content Grouping: the original design used multiple "cards" and nested JSON snippets, which felt overwhelming and clunky to users. The redesign uses a single, clean centralised container with large, clear headings.

Before

After

Design Solution

Participants

Users wished to track new participants (third party asset providers) and have a discount Token System for new participants upon registration.

  • Originally the ‘participants’ and tokens pages were not categorised together or displayed next to one another in the original navigation bar. I created a tab under participants for Tokens to be accessed easily by the user, seen as tokens would only ever be used when navigating to view or update the participants.

  •  I created an individual truncated discount token code that could be copied and sent on to new participants, along with the ability to deactivate the code.

  • I updated all the call to action buttons, reducing the ambiguity that users felt with the original design upon making new changes.

Complete

Design Solution

Prototype

Testimonials

“ I had the pleasure of working with Rebecca on a highly complex and innovative project—the design of a user-friendly interface for a brand-new low carbon technology asset register, commissioned by the Department for Energy Security and Net Zero (DESNZ).

Rebecca took on the challenge with great expertise, crafting a visually appealing and highly functional User Interface that not only met all our requirements but also excited the final customer. Her ability to translate technical needs into an intuitive experience was invaluable.

The final product exceeded our expectations, and we’re confident it will serve as a crucial tool in advancing the government’s initiatives. I highly recommend her work!."

— Igor Dremelj, Corporate Business Strategy / Digital Business Transformation