Deco Lighting Website
Redesigned and created web design standards for getdeco.com to comply with corporate visual identity guidelines and usability best practices.
To understand the problems with the website, we had an all hands on deck meeting to determine understand that we faced 2 main issues. The first being that the visual representation of our brand was not consistent. The second one came with the help of the customer service team who were able to provide a list questions they would receive on a regular basis.
Understanding The User
In order to understand the recurring questions, I met with the customer service team to understand what were the type of people they had to deal. With enough data provided by the team, we created user personas to help in our informational meetings with the executive team.
We looked at several other lighting company websites to study how they structured their website. We took into account their commonalities and strongest, most impactful design features during this analysis.
Once we established the users and took a look at our competition, the next step was to go through our website to determine what the visual pain points were. As I audited the website, I took notes on the visual problems with the website and noticed:
The main problem was that the brand was not established and there was no fluidity throughout the site. The colors did not create brand awareness. The images did not represent the quality of the products. There was not a target audience established which created a clutter of unimportant information.
The home page suffered from being uninviting and failing to lead the user to the end-goal of understanding the product. The lack of call to actions made it difficult to navigate and understand what was important. Because of this, there was a high bounce rate which affected sales.
The product page is the page that makes the sale. It should tell a story and help the end user understand what the product does. It was not the case for Deco Lighting. The products were not the predominant item on the page. There was an overwhelming amount of text without visual elements, which caused users to click away from the page instead of learning more about the product’s important features. Additionally, the text was not interesting to look at. It also included various links to other products that distracts the end-user and leads them to click away from the light fixture instead of inquiring about it.
This image is scrollable
Once the website audit was complete, I circled back to the design, marketing, and customer service teams to discuss our findings. With a clear understanding of our target audience, we removed all the clutter and useless information that prevented them from reaching the desired product. An overwhelming amount of information with no visual throughline was creating a high bounce rate. Once we determined how to streamline the path to the product pages, our next goal was to update the pages themselves. We achieved this by providing visuals that were not only aesthetically pleasing, but also informative.
In order to make sure that the user ended up at their desired product page, I established that every page would have effective call to actions. I made sure that no matter where they went through on the website, there would be easy access to the product page.
With a better understanding of the wireflow, I made a wireframe in Illustrator to help communicate layout ideas with the design team and guide the executive team to better understand the hierarchy of the customer’s needs.
Prior to the High Fidelity Prototyping, a style guide was created following Deco Lighting's branding for consistency.
The most impactful thing we started with was changing the background from white to black. This was consistent with the brand and gave the overall feel of elegant, innovative, and high-quality products.
This image is scrollable
Product Page Key Features
Hero Shot: A full-size application image of the light fixture in a creative space. It gives the end-user an immediate visualization of how the product looks in a location.
Wow Factor: We added 4 “Wow Factor” images that are considered some of the most important features of the product, setting it apart from others.
Functional Styles: Are the rest of the features and options that are apart of the light fixture.
Features & Benefits: Basic specifications and technical information for the product.
Case Studies: This feature was added to give more examples of a specific product in an environment.
Insight from the marketing team, revealed that 68% of people who visited the website were on mobile devices, so we made sure all the designs translated into a mobile friendly screen.
This image is scrollable
The final result was a responsive and interactive website based more around the audience's experience, as opposed to a confusing laundry list of irrelevant information.
Ultimately the changes we made to the website, elicited a positive emotional response in our audience and translated directly to a 15% increased conversion rate in the following quarter. Marketing noticed an 8.75% decrease in bounce rate within the first month of launch. Time spent on product pages increased by over 1:30 minutes which translated to less phone calls for the customer service team regarding answering questions regarding products.