MOBILE APP DESIGN • E-COMMERCE
Relyst
Simplifying the thrill of the hunt
Role
Lead product designer and
UX researcher
Tools
Adobe XD • Google Forms • Pen & Paper • Google Slides • Zoom • Otter
Deliverables
User Interviews • Personas • Product Prioritization Process • Market Research • Competitive Analysis • SWOT • UX & Visual Design • Sketches • Wireframes • Prototyping • Usability Testing • Validation
Overview
The re-commerce market has been seeing major growth in the past few years as more people are going online to shop for secondhand. How are shoppers navigating this new resale landscape and is it actually easier for them to find what they are looking for?
Solution
It was discovered that online shoppers spend an inordinate amount of time searching and comparing product listings. To help users find the best deal for their ‘one in a million’ all on one site, I designed a mobile app named ReLyst that can make shopping for secondhand fashion a seamless and speedy experience from search to checkout!
The Current User Behavior
With a focus on secondhand fashion, these are direct quotes from online shoppers during the interview phase.
It was discovered that online shoppers shared the same motivations and habits when shopping online for secondhand:
Users shop with intent because it’s too easy to go down the internet rabbit hole searching endlessly.
Users will research products and compare prices among different sellers and marketplaces to ensure that they are buying the best item for the value.
These motivations coupled with the many variables associated with secondhand items (e.g. availability, condition, and inconstant price structure) actually make the shopping experience time consuming, contrary to their expectations of online shopping being fast and easy with a click of a button.
How might we facilitate online secondhand shopping so that people can search & shop quickly and efficiently?
Market Research
From my research, I discovered an indirect competitor named Lyst, which is an aggregator that allows shoppers to search for new items among many retailers under one site. The framework seemed perfect since it gathers various sources across the internet, resulting in better odds of finding a specific item.
After brainstorming other possible solutions, a product prioritization exercise with dot voting confirmed my idea that an aggregator would be a useful tool to help solve users’ frustrations with search.
A window of opportunity.
Lyst’s platform is focused on new and trending fashion. It does have a small selection of secondhand that is mixed in with the new, but it is not robust enough for the growing sector who are only looking for secondhand.
Why Lyst?
65 Million Users
Among Lyst’s massive following, it would be interesting to see how many of them shop secondhand or are likely to shop secondhand but since this information is not readily available, I hypothesize that a good portion of them will shop or have shopped secondhand. Research has shown that 51% of consumers plan on shifting their spending to secondhand and the rate of adoption increases with every age group.
Express Checkout
Lyst has a feature where buyers can purchase items from multiple vendors in one transaction but its use is limited to only those retailers that give Lyst access to their inventory. Even though it’s not quite universal, it is a nice-to-have feature that can decrease cart abandonment (which I can see being a major buy-in for stakeholders!).
Mobile App
I wanted to focus on a mobile app since more people are using their mobile phones for online shopping. According to prnewswire.com, mobile accounted for 8% of Lyst’s overall site traffic and grew to 25% by the end of [2012] and sales leads generated on mobile have grown ten-fold in that same year. For this project, I decided to focus on iOS since 6 out of the 7 interviewees own iPhones.
HYPOTHESIS
Designing a resale feature in Lyst to aggregate search results will help users shop quickly and efficiently.
Lyst Usability Test
Before jumping into the design, I conducted a usability test on the current Lyst mobile app to see if there was room for improvement. I approached 7 people from the ages of 16 to 40 years at a local vintage store to perform specific tasks on the Lyst mobile app.
5 of 7
Users found the available tools helpful when searching for an item.
If the initial search didn’t give the users the results they wanted, they struggled to come up with other search terms for the second trial.
3 of 7
Users found it easy to comparison shop from multiple vendors by price.
Users expressed frustration when there was no easy function to keep track of the items beyond clicking the link to open a new window and toggling through multiple windows to compare products.
1 of 7
Users found the shipping and delivery information readily accessible.
Users really disliked having to parse through each retailer’s website for shipping policies after being redirected there from the Lyst site.
Transforming Lyst into ReLyst
As I worked through the user flow, I realized that I needed to design a separate platform dedicated to secondhand instead of adding a ‘pre-worn’ section on Lyst. There were way too many variants in the re-commerce market that mixing new and used items would inundate the user with too many steps.
Using the Lyst app as a guide, I kept the typeface, the general layout and color palette the same but took some liberties in the application in order to differentiate it from the sister product.
I focused first on the button placements and pagination since these prompt action. I made sure that these elements were placed in areas that did not distract from the product itself while being intuitive to the users’ actions.
Once I had a high fidelity mock up, I conducted more usability tests to improve the information architecture, user flow, and the copy write all the while iterating and redesigning certain features in order to get a working prototype of ReLyst, an aggregator and a market place for secondhand fashion.
The ‘Search’ screen was simplified so users can begin their search without distraction.
Designing A New Experience
Features, screens and pathways for comparison shopping and checkout were designed anew since they were missing from the Lyst mobile app.
Comparison Table
A comparison table is an easy way for users to check products side by side. I sketched different CTA options and ways users can access the comparison table until I finally settled on the ellipsis. To notify users about the additional features within the ellipsis, a tooltip appears right before the aggregated search results.
Searching for the sweet spot! It was challenging to find space for the comparison feature CTA on an already crammed product page but...
…with the use of the ellipsis, users can select and compare products when needed.
Express Checkout
My initial intent for the checkout process was to make the process fast and easy. But after synthesizing the results of the usability test, it turned out that changes needed to be made on how the content was presented so users can focus on each task to avoid mistakes when inputting their information.
The product detail page needed more explicit information so users did not have more questions than answers.
The cart must quickly summarize and confirm the contents without causing additional confusion.
The information hierarchy for shipping was consolidated into easily digestible parts.
Design Solution and Validation
With the prototype in hand, I was ready to test the app with another set of users at my local vintage store. Using the same criteria from the Lyst usability test, there was a marked improvement with the added features in ReLyst.
7 of 7
Users found the available tools helpful when searching for an item.
7 of 7
Users found it easy to comparison shop from multiple vendors by price.
5 of 7
Users found the shipping and delivery information readily accessible.
Instead of spending 30+ minutes shopping, the user can now spend less than 10 minutes from search, compare to checkout.
Searching for a specific item should not be a guessing game.
Instead of spending time visiting multiple sites and figuring out key search terms to find what you are looking for, ReLyst is an aggregator that will ‘scan’ the web and pool the results onto one site.
At a loss for words? Use the image search feature in the search bar to search an item by an image or photo instead of text.
See something you like? Select ‘See Similar Items’ to narrow down the results to the exact item you want to see.
People comparison shop to validate their purchases.
With an improved product list page that factors in shipping details, you can confidently assess the best price between items without being surprised by “hidden” costs.
And with a feature that enables an easy-to-read comparison table, you can see how products stack against each other to ensure you are getting the best value and condition available on the world wide web .
The checkout process should be easy, simple and secure!
Not only an aggregator, you can also shop directly on ReLyst. With Express Checkout in the mobile app, you can purchase items from different vendors in one transaction. To make checking out quicker, create an account to safely save your payment and shipping information so you can snag that one of a kind item before anyone else.
Shipping shouldn’t be a mystery (and people like choices)!
Choose how and when you want your item shipped and delivered during check out. With select sellers, a nice-to-have option is the ability to safely pick up your item in person so you can avoid the risks associated with shipping such as lost packages or damaged products (the usual culprits)!
Reflection
Shopping secondhand online is a unique experience and requires a different approach than regular retail platforms. With so many variables in secondhand fashion, it was a challenge to find that balance of giving the users the pertinent information they need without intimidating them with too much information on a mobile screen. Given more time, I would like to continue to:
Test with a larger pool of people to see what can be improved and solve for other pain points.
Investigate safety measures that will protect sellers and buyers from risks that can come with in person Local Pickup.
Design layouts and user flow in other scenarios besides the ‘happy path’, such as error states or how the platform would function without Express Checkout or for a guest.
Explore ways to transform the platform into a circular economy by converting buyers into sellers and interviewing established secondhand sellers to determine their pain points and needs so that ReLyst can become the premiere platform for their listings.