A strategic revamp and a new page design

Client

European Union Agency for the Cooperation of Energy Regulators (ACER)

About the client

The European Union Agency for the Cooperation of Energy Regulators (ACER) is an independent body that fosters the integration and completion of the European Internal Energy Market for electricity and natural gas established in March 2011 by​ the Third Energy Package legislation.

Deliverable

Revamp the Market Monitoring (MMR) Page and Design the Terms and Conditions or Methodologies (TCM) page.

About the deliverable

On behalf of the European Union Agency for the Cooperation of the Energy Regulations (ACER), Hypertech undertook to offer its expertise in User Experience and User Interface design for two separate pages on the official ACER website. Specifically, the tasks were:

• Revamp the Market Monitoring (MMR) Page and
• Design a Terms and Conditions or Methodologies (TCM) page.

1. Shaping the Strategy

Aligning with ACER's vision was crucial for the overall strategy. Hypertech adopted a storytelling approach, creating a user-friendly narrative tailored to ACER's audience. Using user-centred design (UCD) principles, the team uncovered user needs through research, persona development, and content mapping.

Following Agile methodology, our iterative design process allowed the rapid creation of information architecture, wireframes, prototypes, testing, and refining. This ensured a visually appealing, seamless, and intuitive user experience, transforming the pages into dynamic platforms that drive positive outcomes for the audience and the organisation.

2. Drafting the Wireframes

Wireframes were designed with the Drupal platform in mind, exploring diverse layouts, user journeys, and interactions. Multiple options were explored, considering the organisation's constraints, brand guidelines, and overarching policies to ensure alignment with the overall vision and objectives.

To better assist the needs of the MMR page, the team divided its content into three templates: one for the main landing page, another for reports, and a third for archiving publications. This strategy helped to restructure the content into three new and meaningful pages for the users that are simultaneously easily handled by the admins. For the case of the TCM though, which was designed from scratch, the testing process proved that one page was ideal to share all the important information and offer a proper user experience.

3. Creating the Mockups

Finally, after confirming the wireframes, the team developed the high-fidelity proposals. Hypertech offered a range of designs, that adhered to ACER’s brand identity while introducing new elements that highlighted the content and suggested a more comfortable design for the modern user.

MMR final pages

• MMR landing page: The final design of the MMR landing page adopts a sleek and straightforward approach, efficiently familiarising the target audience with the essence of the report. A prominent section showcases recent publications, each adhering to the second report template crafted by Hypertech, alongside a preview of upcoming releases to encourage users to revisit the page. Recognising the diminished relevance of past publications for the organisation and users, they are segregated onto a separate page. Reports beyond a designated date are automatically archived here, enabling users to concentrate mainly on the latest updates.
• The Report page: The primary objective of the report page template was to enable the organisation to provide comprehensive details about each report. In addition to a clear description and a call-to-action for downloading the report, the template includes a section dedicated to highlights and a variety of resources available in different formats such as Power BI, PowerPoint, video, audio, and PDF. Αll these resources can be accessed directly on the page without redirecting users elsewhere.
• Past Publications page: Finally, the Past Publications page for MMR organises all previous reports chronologically, categorised by the year and month of publication. Users have the option to filter their search by topic or year or utilise an open search function to locate specific reports.

TCM final page

The TCM page was effectively consolidated onto a single page, despite the wealth of its information. One of its primary accomplishments was the systematic organisation of data, presented in a clear and structured format. The template begins with providing general information and highlighting key elements before moving into the methodologies section.

Methodologies are categorised into EU-wide and Regional sections, each colour-coded to denote its implementation status. Users are equipped with a filter tool to refine their search based on region or implementation status, facilitating ease of navigation and access to relevant information.