Energy Avenue

Discipline: Web Design Graphic Design UX Design UI Design

Collaborators: Sales Team CFO Ownership Dev Team Data Team

Energy Avenue Info architecture
Humble Beginnings

I was hired at Energy Avenue for web/graphic design work, but found myself doing UX work even though I wasn't very familiar with it. It was obvious when I began that the User Experience could use some improvements. I was able to accomplish this through changes in the checkout process, improved categorization of the site's products, and implementing a design system.

Maybe remove part about checkout process since I no longer have those screens
Energy Avenue landing page

UX Work

Working at Energy Avenue it became clear early on that the information architecture of the products could be better. I wasn't sure what it should look like though. I started by researching competitor's sites. Questions I asked were:

  • How were they categorizing different products, like light bulbs vs. tools?
  • Did it make sense to have products in more than one place?
  • How did the filtering change for different products/categories?

Next, I conducted user testing over our current site. Gave users tasks to complete, in this case items to find to see how they tried to locate items, and if they could find them. What products were easy to find? Did they use the search bar? What did they search for? Did they use filtering?

Based on my research and testing, I came up with changes that enhance the experience. For example Light bulbs that before were just in the LED category had been broken into LED bulbs, LED Fixtures, and LED Rope Lights.

Information Architecture
Energy Avenue Information Architecture

At the time I wasn't familiar with the concept of design systems, but I knew the Energy Avenue site needed uniformity. Paragraph text was inconsistent, colors varied, padding and colors on buttons were all over the place (not to mention they were using png images as buttons, instead of CSS).

I began working with.....wireframing.....

Energy Avenue Design System: Colors
Energy Avenue Design System: Icons

View the EA design system by Clicking Here

Energy Avenue email blast

The longer I was worked at Energy Avenue, the more promotional materials I was able to create. It's not often I got an opportunity to create print elements, but I did get to do just that from time to time

Book handouts for conventions

Card handout for a trip to Guam

Packing slips