Introduction
Supplement Factory, part of Forza Industries, are a UK based manufacturer for private label supplements. The business specialises in the health and lifestyle, wellness, beauty and sports nutrition industries.
As part of a new brand refresh, I was tasked with looking at the existing website and identifying areas of improvement. The brief was to push engagement of clients to call our sales teams, alongside increasing traffic through marketing strategies.
Understanding the issues
The Supplement Factory website was in need of a refresh. Apart from basic changes such as new banner images, the site had not received an update for a few years.
One of the initial objectives when planning for the website refresh was to push more customers into calling the business to get a quote with the sales team. This would involve educating those visiting the site on what types of products are available, as well as a interactive page where they can specify what they would be interested in, and instantly get information on lead times, product quantities etc.
Research
Research began by looking at our competitor websites, such as MyProtein and PrivateLabelNutrition. I conducted desk research, identifying gaps with our website where competitors had an advantage. I worked closely with the CEO of the business on this, as he was keen to also understand key gaps in the market where the business could focus it’s growth on.
I also looked at websites such as Behance and Dribbble to begin to get an idea of how others design for the Supplement Industry, as well as stumble on any other websites that might help my design.
We implemented HotJar, a web analysis tool, to see how users were interacting with the website and to begin mapping out a flow map. This allowed me to see heatmaps of each page on the site, along with being able watch back footage of how users interact with the site. I mapped out these results in a document for future reference.
Building the brand
As part of the new website, I built a new style guide to fit with the website, that could be used when new pages were made to keep consistency. The document included all the font styles, the main colours that were used, all the icons that had been used on the websites and links to the prototype.
I also built a status page, so that everyone could bookmark the prototype link and then see updates through that. Each page was also a link that went to the relevant prototype.
The solution
The main area I wanted to focus on was the homepage, as this was were the most traffic came from. I began by looking at header, where we replaced the old logo with this newer design. I also placed a contact number for the Sales Team – this allowed customers to speak to someone straight away rather than wait for an email reply.
One of the new features that was added to the site was the shop page, where customers were able to buy pre designed products and use their own label based on a template. For these products, I built a custom 3D scene using Blender which allowed me to render out a turntable animation. This animated was then implemented into each product page, so that when the user clicked on a page, they would get a full 3D preview of the product.
Post development maintenance
Even when the website had been refreshed, there were still improvements to be made.
Screenshots
