Viasox | E-commerce
Project overview
Role
UX Designer
Team
1 UX Designer
1 Developer
1 Business Analyst
1 SEO Analyst
1 Graphic Designer
Duration
6 months
Company
Viasox
Viasox Canadian Diabetic Sock Company
Since 2019, Viasox has sold over 1 million socks for individuals with diabetes. Their product range consists of: Compression, Non-Binding now EasyStretch™ (2024), Ankle compression (2024) and Ankle socks.
Business Impact
New Users vs. Regular Users
Based on Google analytics, majority of Viasox's visitors are new visitors. The site traffic indicates that they arrive at Viasox through social media not through organic traffic.
Initially stakeholders were concerned about Viasox's product offerings and whether the company needed to branch out into a different types of products .
Shown below is a breakdown of site traffic, types of visitors and platforms used. Knowing how users arrive at Viasox is important because it indicates what page they will land on based on a specific funnel.
Since there are a large amount of new users, stakeholders wanted to optimize the site and see how to convert the new visitors into regular users.
Site Traffic
Site Visitors
Platform Usage
73%
Mobile
17%
Desktop
10%
Ipad
Main Goal
How can we convert the large influx of new users on the site into regular customers?
Solution TL;DR
User interviews and user testing helped identify key issues such as how users identify product navigation and site skepticism. These issues resulted in new users abandoning cart or not proceeding to checkout.
The underlying problem users addressed was decision paralysis based on how much time was spent trying to navigate the site.
Through multiple iterations and collaboration through user testing, the solution appeared.
By guiding the user through consistent icons and breaking down product offerences and it's differences from the homepage and throughout the site led to increased conversion rates and sign ups.
Discover
How do users engage with the site?
Building a starting point for understanding how users engage with the site helped determine what drives purchase decisions and what are users primarily looking for.
Through frequent collaboration with stakeholders, the developer, and the business analyst; we decided to focus on examining new users which would have the most impact. Moreover, I conducted an audit of the current website to identify current friction points.
Triple Whale provided analytics on how users engaged with the site, 70% of users engage with Add to Cart but there's a considerable number who don't progress and complete a purchase. Numerous users abandon their carts. I wanted to uncover the reasons through user interviews and feedback.
To better understand Viasox users, I conducted 15 user interviews split into 2 user segments (new and old users) to test with the existing site. Understanding what new and old visitors from the site require gives a foundation on what to improve. I wanted to capture qualitative information such as demographics along with their thoughts, motives, and pain points.
I correlated the topics surfaced from the user conversations with the information yielded from Google Analytics, Triple Whale, and heatmaps.
The Customer Journey is based on the information acquired and built alignment amongst the team and increased empathy for our ideal user.
Understanding our users
When conducting the user interviews via Google Meet: I made sure to capture the users ailments, concerns, feedback and issues in their overall experience with the site. The user interviews captured several themes such as confusion over product recognition and what the product is.
Technology
Suprisingly a large amount of elderly visitors were using mobile phones
Over 50% of users relied on their mobile phone to visit the site because they always had it on them. The focus on accessibility and clear instructions were important when creating the design system along with how interactions were incorporated within the site. People expressed their preference for mobile phones due to convenience and were inclined to use more often during evening or weekends.
Restructuring to improve Product Discovery
Breaking down the information architecture of the current site informed how users navigate between the pages and content. Social media draws most of the users using reels and directs them to 3-4 specific landing pages.
The primary landing page bring users to the Collection page which promotes 3 product types: Non-Binding, Compression and Ankle. Understanding where to integrate the Collections page was based on how the media ad funnel. From the main menu and landing page it was difficult to find the Collection pages.
Scaleability was also taken into consideration. Discussions with Stakeholders to determine where they can place new products and how it is accessed. Research and Development was growing and there was a possibility of launching of a new product.
The launch of the Membership and New Ankle product during the site redesign required additional integration. This is represented by white boxes in the image shown below.
See below the revamped version of the site breakdown. I incorporated the Collections page on the homepage to see if that would increase the opportunity for users to access all of the products and even discover new offerings. This would be further examined in the usability testing.
Focus was primarily on mobile first designs because of the high percentage of users that use mobile over desktop.
How do users engage with the site?
Analytics indicate that user retention improves after the initial purchase. Users typically revisit the site and engage in more substantial transactions once they had already purchased an item. Once an item has been purchased, it reduces and address the problem of drop offs because a relationship between the customer and company has been formed. It is important to take this into account because the product differences and offerings have to be clear inorder for users to make a purchase.
Problem statement
How do we remove the barrier for new users to make their first purchase?
Engagement
Areas of Impact
Through collaborating with the developers on the primary challenges, we reached an agreement on the changes that would significantly affect the website, based also on viability and business objectives.
The user interview responses captured several themes, but these 3 had the largest impact connected to purchasing decisions and retention.
1 | Spot the difference
Users had difficulty understand the purpose and benefits of Non-Binding vs Compression. When they viewed product pages, users said they had to read multiple pages of information to understand the product offering.
*Old collections page
3 | Lack of trust*
Users could not understand what kind of provider and policies were available
*Old Product Page
2 | Navigation Unclear*
When users navigated through the site, initially they just scroll the home page. Users would infinitely scroll or go through the site searching or reading information. Many found the Menu not intuitive and difficult to locate a specific item.
*Old Menu
Reiterate & Test
Redirecting users to guide decision making
I developed a design system to provide consistency for branding and to create uniformity throughout the site. Working alongside the developer and graphic designer regarding viability and how we would scale updated components. A focus on accessibility and compliance was also adhered to but with some pushback from stakeholders. Users subconsciously can tell differences amongst text and have mental models regarding pattern recognition and layout. Removing decorative typefaces that were difficult to access with screen readers was a factor when working with the SEO analyst.
After several design and user flow iterations, user testing was conducted amongst 12 people. It was much more difficult to acquire New users to test the prototype. The testers were acquired from Viasox socials and email blasts. It is noted there may be a bias in terms of expectations of the site but users do not frequently visit the site except for once a month for new pattern rollouts.
Final Solution
Being informed by analytics, user interviews and user testing revealed New visitors painpoint. Many new users abandoned cart and did not proceed to checkout. The underlying problem users addressed was decision paralysis because of how much time users spent trying to navigate the site.
Users voiced concern to label icons such as cart or search for increasing clarity about the purpose of the icon. Accessibility was important to also provide users with larger icons and buttons. The purpose of interactions had to direct users to help them navigate the site.
Below displays only some of the key changes to the site. If you want to see full solution please click on the Go to Prototype.
Old Menu
Initial feedback from users found the Menu unclear because of the slider interaction shown above that kept many products hidden. Many new users wanted to know what the Bestselling socks were. along with what products are offered.
Old Collections
The Collections page was used to funnel visitors from ads. At a glance users found it difficult to understand what the differences between each product was. Also the summary required users to spend alot of time reading and understanding each product.
**Halt Design for New Product Name and Product Release**
After showing initial designs and the results of the usertesting, discussion with the team and stakeholders halted production. Based on the findings the feedback from the initial prototype revealed the need to rebrand a specific product. The rebrand of the word Non-Binding into trademarked name EasyStretch™ required new image changes along with content writing. The change was incorporated because users had difficulty understand the word Non-Binding and it's purpose.
Rollout was paused to incorporate the changes which allowed for more user testing and interviews to occur before finally updating the site.
Next Steps
There is still alot more to do to revamp the site based on user feedback to the first initial iterations.
There needs to be a separate funnel for regular users that visit the site vs. new users. Based on the user interview findings regular users focused on seeing new patterns and usually purchased at time of release due to the limited inventory. Also users tend to save their money to purchase on new release pattern dates at the end of the month. Regular users also were inclined to look at sales because many were retired they wanted to save money due to limited earning capability.
The site also requires further updates for Accessibiliy purposes. Information such as media and some design elements needed further updates. This would have to be changed in the future.
