Identifying the users

Before I joined the project, the team along with the internal NRG stakeholders, identified eight key personas who would serve as the litmus test of who we were redesigning the site for. These personas were:

Pioneer (e.g. Director of Sustainability, Industry: Hospitality)
Achiever (e.g. CFO, Industry: Manufacturing)
Creator (e.g. Developer, Industry: Construction/Retail/Housing)
Producer (e.g. Chief Engineer, Industry: 48 Floor High-Rise)
Broker (e.g. VP, Client Sales, Industry: Wholesale Energy)
Research (e.g. Journalist, Industry: Media/PR)
Investor (e.g. NRG Investor, Industry: Finance)
Networker (e.g. NRG Account Executive, Industry: Energy)

Process

As mentioned above, when I joined the project the personas and their journeys had already been flushed out, in addition to the preliminary IA of the site. For me to jump into the project, I began to build a structure around documenting the pages, the individual modules that made up those page templates, the overall module library, and took ownership of the ever-evolving sitemap.

Through creating these master templates and sitemap ownership, I was able to document not only the overall structure of the site, but I was also able to capture functionality of the various modules which would help when communicating the designs to the development team. Additionally, it served as a great resource to be able to reference and define what functionality we wanted to be bespoke and what modules we could leverage in various areas throughout the site.

The Asset Map page was complex as it incorporated a map, search functionality, and two separate filtering options (in the secondary bar and in the list view). My first step was to author the backend CMS system with all 131 assets that would make up the map and list, to be able to understand what information I was designing functionality for. Once I understood the different categories, I was able to create different scenarios in which the user may want to search for NRG’s holdings. 

Having separate map and list views allows the user to either explore assets visually on the map or scan and locate via a filtered list. I was responsible for not only the UX, but the UI as well. 

The contact form was a page that I another page that I was responsible for from UX to design. Working with the developer, were found existing React components that we could leverage on the frontend to allow users to identify specifically what they were interested in contacting NRG for. This also helped on the client-side, to help direct inquiries to the right person. The contact form was kept consistent with the form fields behavior that I had design and had been approved earlier in the project timeline.

>> PROTOTYPES

A large part of my role was to create prototypes using Flinto and Keynote software to demonstrate intent with interactions on the website. Below are some examples from the mega navigation, search results and awards carousel.

>> RESEARCH OBJECTIVES

• Validate concepts for the new desktop experience of NRG.com with persona users

• Gather feedback from persona users based on new experiences

• Explore the functionality of the new desktop experience and ease in locating information about the company and offerings

>> METHODOLOGY

30-minute phone interviews were scheduled for testers to call into a Webex meeting. They were asked to share their screen and the session was recorded as a series of questions/prompts which had been tailored for their persona type.

Once the recording was received from NRG, the I re-listened/watched the recording, transcribing the interview to capture anything missed and to watch and document behavior/interactions as the user navigated the site.

>> OUTCOME

A 3-page summary report and a matrix built out to be able to identify feedback corresponding to user and section of the website. These were delivered to the internal AKQA team, as well as the client stakeholders.