Overview
LuminAID is an E-Commerce Consumer Goods Company that sells solar-rechargeable lights that pack flat and inflate to diffuse light like a lantern. The company was founded in 2011 by Anna Stork and Andrea Sreshta, who invented the technology in response to the 2010 Haiti earthquake.
The Problem
Redesign the e-commerce website to a compatible modern Shopify theme to increase site speed, ensure ADA compliance, & increase sales conversions.
My Role
UX & Marketing Technology Associate
I began at LuminAID as a marketing & web design intern in October 2020, I worked full-time during the Summer and was brought on as an associate in September 2021. I reported directly to the Head of Marketing and led several projects during my time there. The company was acquired by "Adventure Ready Brands" in November 2021.
Solution
Document requirements for the redesign and testing of new themes along with needed changes. Ensure ADA compliance, and decrease the amount of applications and unnecessary code. Use A/B Testing, heatmaps, and customer feedback to create an optimal user journey to increase conversions and make information easier to find.
Requirements, Ideation, & Prioritization.
The first step was the requirements for the new website theme redesign. We used the requirements to select a theme that checked off the most boxes, depending on our highest priorities first. We then began seeing what we could do with the chosen theme and changes that would need to be custom to the website. We prioritized the most important features first, creating mockups for required changes and sending them over to a development team. The rest of the time was used populating the site with the most important pages, elements, and content.
Site Map & User Journeys
We were able to look at Google Analytics Data along with heatmap data of the current website to determine the most popular journeys, the highest converting journeys, and any potential issues or shortcuts in the journey. Using data and a site audit I was able to build the current website's site map and identify the most popular journeys, so we could make changes to reduce clutter and change layout.
Simplify & Optimize
I ran a site audit going through web pages, content, apps, and themes within the Shopify template. Using the data I gathered we made strategic decisions about what to keep when going forward with the redesign, what to consolidate, and what to remove completely.
We were able to radically reduce the number of main pages, simplify unused templates and pages, create best practices, as well as set up a more simplified back-end CMS.
Visual Design & Mockups
Visual design would be an important element of the redesign. One of our goals was to increase readability and simplify copy so text could be larger. This would be important due to the age demographic and simplicity of the website.
In collaboration with the Head of D2C Marketing & LuminAID's Graphic Designer we were able to choose typography and colors as well as get a text-size increase. We did our best to translate these visual elements into the new theme.
I was tasked with mocking up product cards to drive sale conversions, buttons for discoverability and interaction, as well as a product switcher design so customers could switch between 3 options for solar lanterns and power lanterns. Visually aiding customer's in identifying what they were currently selecting, as well as the product name and picture of other similar items do help customers compare and contrast products and understand selection.
Redesign Changes
Major changes included visual design, navigation, product pages, product collections, cart/checkout, best practices, and blog layout.
Final Result
- User can add to cart as quick as 1 to 2 interactions.
- Users can understand which products they have selected and which are similar
- Users can learn more about product information using drop-downs
- Story & Use-Case driven pages guide users to the optimal products
- Trust Icons, press bars, guides, customer support, and reviews prompt credibility.
- Signifiers prompt users to understand what is clickable.
Power Lanterns
Product Page
Cart
Checkout
Reflection
Throughout this process, I learned a ton about designing for E-Commerce, project management, visual design, & working with agencies, developers, and teams. We were able to craft a more modern and cleaned-up website. Even finding places where costs could be cut back or where we could spend more time focusing on or optimizing. This site is much more accessible and structured than before. We were able to focus on even the small details to increase our online presence and stay true to the brand and customers.
Visit the Full Site at: https://www.luminaid.com