A startup business that required a user-friendly e-commerce website to sell health & wellness products. I created a user-focused design and prototype for the client's web developer.
July - December
The client had hired a web developer to design and code a site on Shopify’s CMS. However, the website’s visual aesthetic and functionality were not optimized to offer an enjoyable user experience on both desktop and mobile.
With an emphasis on UX and UI design principles, I crafted a website design that would allow users to seamlessly browse and purchase the client’s products. The design also reflected the business owner’s minimalistic brand vision.
Understand the problem
I arranged an initial consultation to learn more about the client’s business goals and brand vision. In this meeting, I asked the client a list of pre-set questions to understand their needs in order to propose feasible solutions.
Who are your customers?
Who are your competitors?
What is your value proposition?
What are your short-term and long-term business goals?
How are you currently addressing online areas of concern?
I conducted an audit of the client’s initial website, created by the web developer. This audit consisted of a detailed-observation of each page on the website along with a usability test of its functions.
Areas of concern:
Brand colour discrepancies - i.e. text, buttons, lines were not aligned with the brand
Pixelated logo and images throughout the website
Missing personalized brand materials - i.e. general stock images & videos
Inconsistent spacing between sections and headings
Partial information and grammatical errors
Research potential solutions
TARGET MARKET RESEARCH
In lieu of user data, I decided to research competitors in the industry by examining their website and social media platforms to understand their consumers. I then compared these observations to the client’s brand vision and mission.
I looked at trends in the industry for inspiration on website design to facilitate user interactions. I first considered direct competitors, namely therabody.com, gravityforce.ca, and xfitonway.ca, all specializing in the sale of massage guns. These brands provided insight on a structured layout of the site with basic elements such as CTAs leading to the product page, an accessible homepage that included contact, social, and payment details.
Then, I expanded my search to indirect competitors which included prowess.qodeinteractive.com, spengle.com, anovaculinary.com, and databox.com. Although these companies are not directly related to the client’s brand, their webpages represented a minimalist appeal sought by the client.
I began the design process by creating a sitemap to lay the foundation for my wireframes. Because the client intended to have the web developer input custom code into a Shopify template, I focused on designing 4 key webpages.
I collaborated with the client to test user interactions with the mockups. Accessibility features were added to all pages of the website, which included an English-French language translation option, live chat box, and a “top of page” button. These were added to facilitate customer service inquiries and offer ease in comprehension and navigation of the site.