COMUNITYmade
UX/UI
COMUNITYmade
Project: E-commerce Website Redesign
Client: COMUNITYmade
Tools: Sketch, InVision, Photoshop, Trello, Slack, RealTime Board, Whimsical, Google Analytics, Lucky Orange, Shopify, Whiteboard, Pen and Paper
My Role: UX/UI Designer, UX Researcher, Analytics
The Company
COMUNITYmade is a Los Angeles based footwear company. They are focused on providing jobs by manufacturing handmade shoes in downtown LA and giving a percentage of sales to local charities.
The Challenge
While their Downtown brick and mortar location still accounts for the majority of their sales, OMUNITYmade’s online site has struggled to meet Shopify's proposed industry standard conversion rate of 2%. Our goal was to identify the friction leading to a less than 1% conversion of their online visitors and design solutions while keeping within the Shopify E-Commerce platform.
The Solution
Tasked with increasing the conversion rate by over 100%, we began with research. Why are users leaving the site? We discovered a few main friction points, redesigned, retested, and created hi-fidelity prototypes of our proposed changes.
RESEARCH User Interviews C and C Analysis Affinity Mapping User Personas Journey Mapping User Flow
User Interviews
We started by conducting surveys, user interviews, and user testing of the existing website. COMUNITYmade manufactures a fashionable, high-quality handmade shoe in Downtown Los Angeles, at a higher price point than many other online footwear sites. We wanted to talk to users that were not only fashion conscience and familiar with purchasing shoes online, but also comfortable paying over $200 per pair.
Competitive and Comparative Analysis: E-Commerce Features
We did a C and C Analysis to compare the current site’s features with several competitors in an effort to determine if basic or current feature trends were causing the high exit rates and low conversion. We found users wanted more detailed photographs and videos of the product.
Affinity Mapping
We constructed an Affinity Map to group our findings into categories to help us deduce which features we needed to prioritize and more importantly to identify the pain points our users experienced navigating through the existing site. The area circled below highlights the main point of friction our user tests uncovered. COMUNITYmade donates a portion of every sale to a local charity. From the product detail page, customers are asked to select one of three local charities before the product can be added to the cart. The process was confusing and frustrated the users during testing.
User Persona
By synthesizing the data, interviews, and affinity mapping, we created a user persona to determine the needs, goals, and frustrations of the target user. Our research lead us to create two distinct personas. The first was based on COMUNITYmade’s commitment to providing jobs and supporting local charitable organizations. The second was a more fashion conscience user looking for the latest trends.
Journey Map
We created a Journey Map to highlight some of the difficulties and pain points the users experienced during our user testing of the existing site. We created a scenario for our user tests asking users to navigate the site and complete a purchase of a pair of black men’s shoes size 11. At the time many products were sold out, creating a great deal of frustration for the users. We raised this issue in an early meeting with the stakeholders. They quickly addressed the problem and moved these items to a limited stock page.
Original User Flow
The original user flow showed the confusion caused by the charity selection process. Users wanted more information and did not understand that a selection was required before adding the product to the cart.
DELIVER Revised User Flow Hi-Fidelity Prototype
Revised User Flow
The revised user flow removed the friction and confusion caused during the charity selection process. We designed a separate page with more information about the different charities as well as links to their home pages and a link to COMUNITYmade’s charitable mission.
Hi-Fidelity Prototype
Our finished prototype included redesigns of several features we discovered were pain points during our research and user testing. We removed a promotional pop-up window that we found users did not read before closing and placed the promotion prominently on the home page. We change at page titled “limited stock” to reflect that these were items on sale. We also added the customization feature and made it assessable from the dropdown as well as on the home page. We streamlined the checkout process, redesigned the product pages, product detail pages, and created a seamless process to select a charity and find additional information. Please click on the image below to view the prototype.
ANALYTICS Report Mobile vs Desktop Facebook Effect Reflection
Analytic Report
As I discussed earlier, we were determined to get COMUNITYmade’s e-commerce conversion rate increased to the goal they set of 2%. Throughout the entire redesign process, we realized we were unlikely to achieve that goal. I decided to use the access they had given us to Google Analytics and Lucky Orange to see if I could find anything our research, interviews, and testing missed. This was going to require going a little beyond the original scope of the project. I found that during a two-month period the site had 19,335 total sessions, but more than half lasted less than 10 seconds.
Mobile vs Desktop
I discovered that the majority of users were coming to the site via mobile devices. The conversion rate was considerably less for mobile vs desktop. The question was now “Where are all these mobile users coming from?” and “Why are they leaving so quickly?”
The Facebook Effect
I discovered that the client had invested in a social media marketing campaign to drive traffic to their site. It worked. About 73% of their traffic was coming from social media and an incredible 95% was directly from Facebook. I discussed this with the client and they explained the specific customer demographics they were targeting through the Facebook marketing strategy. The users they were targeting were much younger and with considerably less disposable income than the users we identified and tested through our research. We all agreed that a change in marketing and user acquisition strategy would significantly increase the conversion rate.