June 21, 2014
Gas South Enrollment Redesign
Optimized the natural gas signup and enrollment flow
Homepage prototype
ClientGas South
GoalTo create a fun mobile-centric website
RoleInformation architecture, interaction design, business analytics
AgencyNurun

Introduction

The Gas South Enrollment redesign was a massive project that spanned many months to rebrand and overhaul their dot-com site and enrollment signup flow- their main source of new clients.

Our goals were to:

  • understand the needs of new customers
  • usability of competitor services
  • find bottlenecks of the current enrollment flow
  • optimize the enrollment flow
  • increase number of signups

Establishing the Problem

One of many enrollment flowcharts

My immediate goals were to learn as much as I could about Atlanta’s Natural Gas market and the consumers in the space. It turned out that it’s highly competitive and non-differentiating. Basically, everyone offered almost the exact same thing for the exact same price.

The only thing they could do was improve the process of signing up.

I looked at competitors’ offerings and poured over Gas South’s customer research led to breaking their signup process down to several key parts, that we wanted to test to find bottlenecks.

Artifacts

(all artifacts are developed by me unless noted)

Requirements & Wireframes

One of the wireframes that mapped to a flowchart

Business requirements and wireframes were developed hand in hand, as each alternate flow required many iterations as I tried to develop the nuances of each enrollment flow, since information from some steps carried over to others. The flow charts and wireframes were updated to reflect not only the data and flow requirements, but also the latest copy and data required from users.

Artifacts

Wirecomps

Combination of wireframe and comp, with assets

After weeks of optimizing and designing the flows, I worked with our visual designer to develop a cross between wireframes and a comp to initiate the layout design. These translated into Photoshop comps (created by a visual designer). These were needed for us to get on the same page with the client.

Artifacts

Prototype & Development

Prototype example

After much back and forth in both the requirements, enrollment flow, and comps stage (at this point we had actually come up with a total of six testable flows), our client wanted us to develop reusable clickable prototypes for testing.

The first one I did was for the homepage – I took a homepage comp our designer had made, cut it up in photoshop, and added RoyalSlider functionality to show what the homepage carousel (this is something the client requested) would feel like.

At this point the prototype and development work was too much for one person, so the work got out-sourced to other developers which I guided closely so the pages didn’t stray from the original flow. The point of the prototypes were not only to display demonstrate each flow, but to make the transition to development and deployment easier for our client.

Mobile prototype

I had also suggested a mobile version for our client, to capture the sizable number of users who were accessing and even forced to sign up their old non-mobile-friendly signup form (after all, many lower income families around Atlanta only have mobile access to the internet). This suggestion ended up spawning a separate mobile project, which used a modular setup with jQuery, so their developers could easily adapt to later findings frmo testing.

Funny enough, our client ended up using most of our code in their final signup form (including my mobile signup code).

Prototypes

Conclusion

Unfortunately, we were not part of the official testing process, but they had enough of a plan, and enough variation to play with to optimize their signup. The customer life cycle in buying natural gas is very long and seasonal (and we were in the wrong season), so that work was better done internally than through an agency.

I eventually left soon after the project was wrapped up, so I didn’t get to know the results (which would have taken a couple of years to go through full customer cycles) Gas South also seems to really have enjoyed our work, as most of the code base we handed over to them have been kept intact a few years after the fact.