Home // Super Bright LEDs // Navigation & Homepage

sbl-image.png

Super Bright LEDs

Global Header and Home Page

Role: Visual Design, UX, Research

 

2015

superbrightleds.com in 2015

superbrightleds.com in 2015

 

I started working for Super Bright LEDs in March of 2015. My research prior to accepting the job included a deep dive into the website and it soon became clear it was in need of improvement. It would take a couple of years to get the site to a place that would not only look aesthetically appealing to our customers but also function, rank, and convert well.

 
 

The website was built on a custom developed platform during the early to mid 2000s by a small, in-house development team.

 
superbrightleds-logo.png

Current logo designed in 2002

 

2017 to 2018

sbl2017.jpg

 

The next couple of years brought on a few more iterations of the homepage. This version still had the very prominent H1 and hidden text. The menu was brought out and trimmed down but this meant on all secondary pages it was still hidden. Hero image was simplified as were the category cards. We conducted A/B/C/D testing and this version prevailed and remained the homepage for the next 2 years.

 

 

2019 / 2020

sbl2020.jpg

Navigation Usage by Top level Category
 
Along with the header redesign came the newly implemented drop-down menus. This is where I was able to emphasize things such as linking to the category’s direct clearance listings, commercial account, and blog resources. The addition of application …

Along with the header redesign came the newly implemented drop-down menus. This is where I was able to emphasize things such as linking to the category’s direct clearance listings, commercial account, and blog resources. The addition of application images was placed with the intent to potentially cross-link to specific categories, private labels, and even seasonal promotions.

 

The ideation phase started with finding inspiration whether it be brainstorming on paper or simply perusing the internet for quality examples I could present as supporting evidence that it was critical we bring our website up to date. When it came to numbers and best practices I leaned on The Baymard Institute and the quantitative research carried out by our Content Development Manager.

I took early prototypes and mockups to our call center which allowed them to express their feedback and opinions. Valuable insights such as how often they direct customers to our blog for DIY and how-tos meant placement of that link was elevated, amongst other things.

The testing phase was carried out by the Content Manager using Optimizely.