2019
Role
Product Designer, Visual Designer,
Product Manager (post-release)
Tools
Adobe Photoshop, Adobe Illustrator, Google Analytics,
Google Tag Manager, Html/CSS, Tilda
Methods
Competitors Analysis, User Research, Hi-fi wireframing, Usability testing, Visual Design, Qualitative Research, Quantitative Research
Overview
VelvetSpa is a specialized company offering a wide range of products and services tailored to beauty and health professionals. The primary objective is to create a user-friendly and visually captivating online platform that seamlessly integrates the four core spheres of their business.
Business Goals
The site should naturally guide visitors through the product offerings, encourage lead generation, and drive sales. Additionally, the website should embody the brand's visual identity, seamlessly blending with its product line to create an aesthetically pleasing and consistent online presence.
1
Online Product Sales:
VelvetSpa boasts a catalog of approximately 200 unique products, categorized under 5 distinct brands.
2
Wholesale Partner Expansion:
The website should serve as a gateway for potential partners to explore collaboration opportunities.
3
Offline Training Course Promotion:
The website is pivotal in promoting these courses, providing information, schedules, and registration capabilities.
4
Offline Event Promotion:
The website should effectively market and inform the audience about these events, facilitating registrations when necessary.
Market research insights
When creating the VelvetSpa website, I worked closely with the client's top management to evaluate the market landscape and pinpointed 5 key competitors.
While their websites were well-crafted, they appeared to use standart template designs, providing an opportunity for us to differentiate ourselves with more distinctive design solutions.
One key observation was that the majority of our competitors primarily focused on product sales, with limited visibility on any additional services or activities they offered. This presented a valuable competitive advantage that I aimed to emphasize.
Strategy was to create a holistic online destination where users wouldn't just find an e-commerce platform but a place where they could enhance their professional skills and grow.
My goal was to provide site visitors with the impression that they had entered a platform that comprehensively caters to all aspects of their professional life.
Style solution
As the brand lacked a well-established corporate identity, the decision was made to leverage elements and from its existing products. Specifically, I drew inspiration from the color palette and reimagined certain graphic elements. This approach allowed me to create a website that maintains consistency with the brand's current flagship product line, ensuring a cohesive and visually appealing online presence.
Website structure
Concept solution
During the website development, I tailored each page to emphasize specific sphere of the client's business, ensuring a unique user experience in each area while maintaining design consistency. I designed a new page structure from the scratch, following presentation and approval of Low-fi and Hi-fi wireframes.
The primary emphasis was on enhancing the information architecture of the pages to guide users progressively towards essential information and gradually cultivate their desire to convert.
It's worth noting that the client opted not to integrate online payment processing. Instead, their business model relied on post-order confirmation payments via phone through a third-party service.
Pages structures examples
Main page Hero section
In the hero section of the main page, I showcased all the business spheres in which the company operates, offering users a comprehensive view of its services. I emphasized the design and visibility of the prioritized company spheres to capture user attention while still mentioning all of them.
1
A brief company description, highlighting the most profitable sectors, particularly product sales and the expansion of the partners network.
2
A block of buttons, allowing users to instantly proceed with purchasing products or learning more about becoming an partner.
3
This main bullet points block, located at the end of the first section, provides additional information on how the company can be useful for the user.
Product list block
This section displays the top positions from each category. This interactive widget grabs the user's attention and helps them quickly grasp the diversity of positions available on the site.
1
Tabs menu
2
Top 4 products from category
Course Section
In this section, I highlighted the primary benefits of enrolling in courses offered by the company.
1
Title with call to action
2
Key bullet points that are relevant to all courses.
3
A brief overview of courses, along with added advantages. Clicking the [ENROLL NOW] button directs users to the courses page, where they can select the most suitable option.
Results
The website was created with easy navigation and a user-friendly structure, considering the unique requirements of each business sphere of the company. I also conducted usability testing after the release to gather feedback from users.
The feedback was positive, with users finding the online shop easy to navigate and purchase from, and the course section attractive and informative.
In the first few months of launching the new website, the Google Analytics metrics reveal substantial user engagement and a remarkable conversion rate.
Bounce Rate varied in range of 45-55%
The average session duration stands at aprox. 3 minutes.
E commerce Conversion Rate (lead submit) combined from all traffic sources didn't drop below 3%
Page per Session stands at 5+ pages
My future ongoing contribution in project
Further development of the website relied on metrics, regular feedback from the sales department, and insights provided by Hotjar. I constantly track product metrics through Google Analytics.
In addition to website development, I played an active role in marketing activities. I created numerous static and video banners for advertising campaigns and collaborated with developers for various requirements related to future development, such as integration of products feed to external markeplaces.
