Customer Journey For ABB's Energy Management System.

With the increase in renewable energy usage in industries, ABB required an online customer journey for OPTIMAX® so that they could reach out to smaller and mid sized companies who aren't their primary customers without needing to increase size of their sales team.

We were tasked to understand needs and wants of these smaller companies, design and deliver a polished solution in form of a website and research insights. 

Company: ABB
Duration : 12 Weeks
Role : UX Designer

In the Fall 2019 semester, I was part of a six person team (all undergrad UX Design Students) working for a project sponsored by ABB. We worked closely with our sponsor Chris Naunheimer (Product Portfolio Curator at ABB) who is based in Chicago area.

My role was to contribute in the project throughout the design process as a UX Designer putting to use my design skills and experience I have gained through previous projects. Through the process I led several sponsor meetings, interviews etc. Besides leading the final design sprint, I took over the testing of our design as I selected or created the testing methods we used to test our design. I created the weather animation interactivity which is one of distinguishing features of the journey and it was my idea. Through the design process, I collaborated with my teammates and also took some of leadership role on an interpersonal level. 

After finishing our interviews and research looking into what documentation ABB sent us and their Figma prototype, we started analyzing our research.

We created a persona, Linda ,who is a potential customer for ABB. We created the persona based on our research findings from the interviews we had conducted. 

We used our persona to create an experience map. We mapped out experience through 'realization of need', 'searching for solutions', 'decision making' and 'purchase' . We realized our project scope will allow us to work with the searching and decision making phase.

We created power summaries summarizing interviews and understood what features are important for the user and what are their end goals.  We understood that videos and interactive touch points led to an engaging experience.

I led efforts creating the experience map and made sure we did not fall into any confirmation biases.

Based off our understanding of what the website should have, we started off on ideation and came up with a basic idea of the content to be present on the website. We conducted some team ideation activities to decide on how sections of the website should be presenting the information.

Upon presenting to our sponsor we were told to "make the user the hero of the story".  With the feedback we decided do a comparative analysis of more user centered project management systems like Trello, monday.com, Basecamp, etc. We also used findings from this to create mood boards for sections for our site.

We found that the language plays a major role in making the user the "hero" of the story. We decided to move forward with our design and add "You" language in Med and Hi-Fi.

For the ideation, I came up with the idea for a weather toggle interactivity showing how the software optimizes energy which later becomes a distinguishing factor of our solution.

Shown below: Activity we conducted to understand what goes into making the user the hero of the story and how we could use it in our case.

The first goal of our testing was to understand what would be the ideal arrangement of the sections of our website. What arrangement tells a story and is able to create a narrative using the visual hierarchy. 

I created a testing method for the purpose based off card sorting. I called it "Arrange-Rearrange" in which the users would be given cut out sections of the website and asked to arrange them vertically in whatever way it made sense to them followed by telling us their rationale. We provided the users with wireframes level sections with it's name written on the back. We encouraged our participants to rely on the visuals and only flip the cards to see their names if needed. I conducted the test with four participants as the test facilitator. 

We got some interesting insights from the test and it helped us reach to an information hierarchy which made sense to most users. 

Upon completing our first round of testing, we had a better idea of where were moving forward towards. Using the mood boards we had created earlier, we created medium fidelity mock-ups in Figma and decided to test again. 

The goal of this round of testing was to understand if the visuals we had created allowed the important information to stand out to the users and if the users are able to make sense of the whole website.

To test this, I had suggested we do teachback testing.  The team agreed to the idea of teachback testing because it allowed us to understand if the the users retained the information presented to them as they had to teach it back to us.  We had a think aloud phase before teachback to understand the participant's interpretation of the information presented to them.

We got some interesting insights from this phase of testing from the participants. There were some common trends in our participant's responses. 

We created a high fidelity mock up in Figma which was interactive to address some of the points mentioned in our earlier testing. We made changes to the visual hierarchy so that information presented to the user stands out and helps with the understanding of the website.
The goal for this round of testing was to understand if the interactions we created for the website made sense to the users and if they were helping the customer journey. We also wanted to find the overall understanding of the user as they progress through the sections of the website.

To test this, I initiated to create a testing protocol. I created a test in which we measured user’s interpretation of their understanding of the website by using a understanding scale as they thought out loud through the prototype. We asked them to point their understanding after every section. The other part of the test was the user was asked to tell us what they expected would happen when they click something on the screen and then compare it to what actually happens. This was concluded by a session of teachback as they explained to us what they saw on the website. 

This gave us some good insights and understanding of how well our customer journey is being understood by the users.