Saudi Electric Company Website Redesign

My role: UX/UI Designer

Project Goal

The goal of improving the website's user experience is to:

  1. Maximize customer engagement and usability, measured by the number of interactions and the number of users visiting the website.

  2. Align the website with industry best practices.

Project Background

Saudi Electrical Company (SEC) is the largest producer, transmitter, and distributor of electrical energy in the Middle East and North Africa. As the regional leader, SEC must keep up with modern trends in customer communication.

As part of its ongoing modernisation efforts, SEC has launched a project to redesign the company website.

Discovery

Desk Research & Proto-Personas

I began the redesign process by studying SEC's communication materials. After exploring their Instagram, Facebook, Google Images, and a few other websites, I found no established pattern, except for the excessive use of the main brand colors.

Based on the materials found on the SEC website and other internet sources it became clear the redesign is addressed at 3 groups of audience:

Investor

A persona interested in tracking SEC's market value and reports on the company's market activities.

Customer

A persona who currently uses or may use SEC services in the future, and is interested in the services and tools provided by the company.

Journalist

A persona who is interested in keeping track of SEC activities and reports.

Benchmarking

For the second step, I benchmarked websites of other power producers from around the globe.

Having all that in place we moved on with sketching and discussion going though few deign ideas. In a team we drew 4 different ideas for navigation and screen composition.

These sketches were later turned into hi-fidelity mockups and put together into an interactive prototype using ProtoPie software.

Research

After conducting usability research on a group of 6 hearing aid users who owns the Apple Watch we found following issues:

  • It was not clear for the users how get to the program selection screen

  • the navigation structure in general causes confusion for some of the users

  • the back button on top of the volume screen was misleading users

  • the design for battery level was good or at least did not raise any questions or problems

  • volume control was missing mute feature (it was designed as action on long press)

  • options screen toggles were put too close together and dimming made one of the toggles invisible

Iteration and Final Design

Once done with validation, together with developers, other designers and product owner we conducted workshop were we came to conclusion on how to improve the design.

All we had left was to redesign the hi-fidelity mockups and create another prototype of the improved solution.