UXDI Project 2 — Etsy Feature Integration
Background
On December 4th, 2017 the second General Assembly UXDI Project was assigned to my cohort. The assignment was to integrate a feature into an existing app.
The Feature Brief
A feature brief was given to simulate what it would be like to work with stakeholders. The problem presented was that Etsy wants to make it easier to sell custom items on their mobile app, by easily identifying sellers who take requests for customizations and also allow those same sellers to easily take requests. Features to include were:
- Users should be able to easily find items that are customizable
- Customers should be able to see the types of customizations that are available for an item
- Sellers should be able to specify which attributes are customizable and to indicate the expected shipping times for customized items
Screener Survey
A screener survey was designed to filter for the most accurate participants for our user interviews. This was to make sure that the people interviewed would be able to give relevant information. A great user interview is the basis for the design and can change the entire process.
User Interviews
With the feature brief in mind, a User Interview guide was developed with questions tailored towards getting the right answers. We made sure to ask the same questions in each interview to create accurate results however, we did not shy away from improvising and seeing where the conversation was led by the interview participants.
4 user interviews were conducted. All females in their 20’s and 30’s. This is ok because Etsy’s client base is primarily female. All four of the participants were Etsy customers and two of those four had sold items on Etsy as well.
Our key insights gathered from the infinity map are as follows:
◦ Customers go to Esty for product discovery
◦ Some for browsing and some for specific products in mind
◦ Etsy users love direct contact with the artist creating their product
◦ Shipping times are an issue
Research Synthesis
Affinity mapping was the method used for synthesizing user interviews. Each observation was written onto a post-it and then grouped according to similarities. This method is used to see emerging trends in the research. The largest trends that emerged were discovery, communication, and style.
Personas
Three personas were developed from the research we conducted. The primary user was split into two categories. One is the primary Etsy user who comes to Etsy with a specific gift in mind. The other being the secondary Etsy customer who comes to Etsy to be inspired. The tertiary persona was the Etsy artist creating the products.
According the research conducted, Clarissa would be the focus of the application’s design. We made sure to take the other two personas into consideration when appropriate and possible.
Problem Statement
After synthesizing the observations and data from user interviews we were able to come up with the following problem statement:
Clarissa goes to Etsy to find unique and specific products. Clarissa has trouble easily finding Etsy sellers that can meet all her requirements for her customized product. How might we streamline the process of connecting Clarissa to the right sellers for her specific needs?
Design Studio
With a problem statement created our team was ready to start ideating on possible solutions. Our team time-boxed an ideation session for one hour, generating as many design ideas as possible. We met together and discussed what we agreed was working and wasn't working in our sketches. Often times bad ideas would lead to good ones. We created a pressure-free environment where all ideas were welcomed to be discussed.
Key takes aways from Design Studio
- We would create a customized home page that generates customizable content for discovery
- We would allow users to create a post for customized product requests that all Etsy artists could see and respond to
- We determined what required fields would be in that post such as quantity, description, image.
Feature Prioritization
Using the documentation of potential ideas generated in our design studio rounds, we created a list of potential features. The MoSCoW method was used to determine which features we would include and in what order we would focus on developing them.
Paper Wireframes
The next steps were to refine our sketches into paper wireframes.
Mid-Fidelity Prototype Iteration 1
Using Sketch, a mid-fidelity prototype was created. We used Etsy’s current app as a template to maintain brand identity. The prototype was put into Invision to create a clickable prototype for usability testing.
Usability Testing Round 1
The first round of usability tests had four participants, one male, and three females in their 20’s and 30’s. They were each given a task scenario to help get into the mindset of the primary persona.
Scenario: Imagine your friend’s birthday is coming up. You really want to get her something special that she’ll never forget, and you’ve heard that Etsy just launched a new feature that will help you get her the perfect present.
Task: Open up the Etsy app and find a way to get a customized necklace made. You have a photo on your phone of how you want it to look.
The results from our first round of usability testing were as follows:
- The other 3 users were able to complete their task
- One user was unable to complete the task
- 100% of users encountered one error
- 75% of users tested had trouble seeing the attach image link
- 75% of users were confused on where the custom request was going
- Users are confused about who is receiving her request for a product
- Users want to be able to search and choose their artists
- Users are having difficulty seeing the attach image link
Mid-Fidelity Prototype Iteration 2
In response to the data we received, the mid-fidelity prototype was redesigned. A second task and user flow were created. This new flow allowed the user to communicate with the artist who has accepted their request through direct messaging.
Usability Testing Round 2
After redesigning we conducted a second round of usability testing. For our second round of usability tests we had four participants, two men and two women in their 20’s and 30’s. We continued to test the first task scenario above and added on the following task scenario.
Scenario: You have a notification, an Etsy artist is willing to make the necklace for you.
Task: Use the app to communicate pricing, expected shipping times, and confirm the order.
- All tasks completed (an improvement from round 1)
- 75% experienced one error (an improvement from round 1)
- 25% of users still struggling to see the attach image link
- 25% of users still unsure who the product request is going to
- One user X-ed out product form before submission
- One user did not click on request custom product, clicked on search instead
Qualitative Analysis
The Usability Tests included the same opening and closing questions for each participant. We gathered a lot of qualitative data from this and decided to synthesize that information through a Delta Map seen below.
On the left side of the map is all of the things that went well and what participants liked. On the right are things that can change and have room for improvement. What is most important to note from this Delta Map is that Navigation is the largest category on both sides.
Our major insights from our qualitative data synthesis:
- We will focus on navigation moving forward
- Users are still having difficulty locating the “attach image” link
- We will consider adding a categories option to the request product form
- Usability of new task confirmed
Quantitative Analysis: KPIs
Search versus Navigation
- Usability Testing Round 1: Task 1 = 50%
- Usability Testing Round 2: Task 1 = 25%
- Participants were using the search icon less in the second round of usability testing. This indicative of better navigation because search is often a last result.
Error Occurrence Rate
- Usability Testing Round 1: Task 1 = 11%
- Usability Testing Round 2: Task 1 = 6%
- Usability Testing Round 2: Task 2 = 0%
Final Prototype
- The final prototype can be located through InVision and has three user flows in high fidelity
- There are 38 screens all together with multiple paths and solutions
- Current Task 1: https://invis.io/7PEWSZ2RC
- Current Task 2: https://invis.io/4MEYQQHQD
Next Steps
- An important next step is considering at what point the buyer will get overwhelmed with accepted requests and how we will filter those results.
- We will need to usability test our most recent iterations of the prototype and bring it to high fidelity.
- We will need to develop this feature on the seller's side and implements it into the Etsy seller app and test how the sellers are responding to it.
- We have developed a third flow where users can search for artists who customize and view what products are customizable. A next step would be to usability test this flow.