UX Case Study about E-Commerce Design

Introduction:

My second Design Project at DevMountain was to design an e-commerce website. This was a group project where I worked with my partner, Amy. The challenge was to create an online consignment store where people can buy and sell clothing. Since there are already several online consignment stores in existence, we focused on researching those other sites for their pros and cons, and then looked for ways that we could improve upon them to give our users a better experience.

Research:

To start out the project, we did a literature review and competitive analysis. I did the literature review by reading articles and blogs about people’s experiences with online consignment stores. I found this information very useful since I had little previous experience using online consignment stores. I got a good idea of how online consignment stores operate and their process. I also read about the things that people like and don't like about other online consignment stores. Reading about people’s experiences helped give me ideas for research questions that I should ask people in our upcoming survey and interviews.Amy was in charge of the competitive analysis. She looked up the policies on security, quality, and returns for the competitor companies (Poshmark, Threadup, Depop, The RealReal, Tradesy, and e-bay) and organized it all in a spreadsheet. It’s helpful to know what competitors are doing, because we can learn from their success and failures.

Surveys:

Then we created a survey for people to take. Half of the survey was about buying, and the other half was about selling. We made this survey using Google Forms and posted it to social media for people to see. We got a total of 34 responses. What we learned from our survey is that most people have had good experiences shopping from online consignment stores. On a scale of 1–10 ( with 10 being “very pleased”) of how pleased people were with shopping from online consignment stores, 84% rated their experience higher than a 7, with the most common rating being a 9. We also learned that the 2 most common hesitations about buying from an online consignment store are scammers, and not being able to return items. The main hesitation that people have about selling to an online consignment store is that it will be too much of a hassle, however, most people rated the selling experience as quite simple (73.7% rated the selling experience with an 8 or higher).

Interviews:

I was able to find a few people that have used online consignment stores and I made phone calls to interview them about their experiences. For the interviews we had 4 different sets of questions. A set for people that have sold to online consignment stores, a set for people that have not sold to online consignment stores, and also sets for people that either have, or haven’t bought from online consignment stores. With the interviews we were able to get more insight about the hassles and frustrations that people have with buying and selling. We organized people’s responses in a spreadsheet.
How we organized Information from Interviews
How we organized Information from Interviews
From the interviews we learned that the hardest thing about selling for people is managing all of their listings. We also got suggestions about what could make the buying process better. For example, getting notifications if a certain item they were looking for came in. Or having standards for the pictures in listings, and the response time from sellers.We took all of the information that we had learned, and thought of ways that we could mitigate people's’ concerns and hassles about online consignment stores. We incorporated these solutions (described later in this case study) into our designs so that people feel more comfortable using our website.

Mapping:

We then created user story maps for the process that a user goes through both in selling and buying. The user story map was helpful in making the site map because it helped us know all the necessary pages that we would need for our e-commerce site.
Buying Story Map
Site Map
Once I started making wireframes though, I felt like our website could have a better layout, so I got some help doing a card sort.
Card Sort for Website Layout
First, I came up with all the different pages that the site should have, and then I wrote down the title for each page on an index card. I gave the cards to the participant, and had her sort the cards in the way that made sense to her. If it seemed like she was struggling I would ask her questions like, “Does it make more sense to have this card in category X, or category Y?” She also felt like a few more pages should be added. After the card sort I had a much better idea of how the website should be laid out.

Why Style Swap is a Better Option:

In our design, we focused on the points that made people timid about online consignment stores to begin with. As mentioned earlier, the 2 biggest hesitations for buyers were scammers, and returns.Solution to help people feel more confident they won’t getting scammed: We implemented a few things into our design that will make customers feel more confident. A few ways is by allowing the people to “rate” the sellers, and also see how other people have rated the seller. Customers can also have the option to report any problems that they have with the sellers, or even contact the seller directly. To checkout, we made an option to pay with paypal. With paypal’s purchase protection, it gives the shopper piece of mind that they won’t lose money if they are scammed.
View of Product Screen
View of Check Out Screen
Solution for return concerns: To solve this issue about returns, we indicated next to each item if returns are an option based on if the seller will allow it or not. To physically return the item, we decided to have shipping labels that will automatically be filled out and only need to be printed. However, now I would implement a different process for shipping, since a lot of people don’t even have printers. Instead I would try to set up a partnership with a mail carrier where the customer can take return items the store, show a QR code on their phones for the mail carrier to scan, and it will automatically print a shipping label there in the store.Solution for seller hassle: Since a lot of people don’t want to deal with the hassle of constantly shipping their own products, interacting with customers, and managing their listings online we thought of a way for sellers to avoid this. Sellers can have the option to send their items in to have style swap manage everything for them, but they will only receive a potion of what the items sell for. Amy and I should have done research to see if enough people would be interested in this option before implementing it. If most people prefer to manage their own listings, then it doesn’t make sense to hire staff to do it for them.Below is a screen shot of the page used for sellers to manage their listings. The boxes to fill in make it easier for buyers to shop around by different categories.
Seller's Listing Page

Designing:

The drafting and prototyping for this project was done using Figma. I was in charge of making wireframes for the buying portion of the website, and Amy was in charge of the Selling, and Profile side of the project. With the Low fidelity wireframes I did a guerrilla, casual style of testing. This type of testing is good because the entire website doesn’t have to be prototyped. Instead you can test just one user flow at a time and quickly make the changes. Since most people are already familiar with buying online, navigating the site was pretty intuitive for people and they didn’t seem to have many problems.For the High Fidelity I came up with a few different color schemes and showed them to my partner Amy for her opinion. We decided to go with a very light blue and olive green for the color scheme. My class had a couple design reviews, and I got some suggestions about where to place things on the web page. For example, the “About” and “Contact” buttons could go at the bottom instead of always taking up space at the top of the frame. I also got suggestions about how to make the drop down menu better. Originally it would require many more clicks before the shopper gets to the page she wants, but with this new and improved drop down menu, the shopper won’t have to click around as much.
Search Results for Men
On the home page, we immediately shows relevant things (i.e. sweaters for upcoming holiday parties) that will spark the shoppers interest to encourage more buying.

Conclusion:

For this project, I learned about the importance of improving on something that already exists. The last UX design project I did, I created a totally new product. I was trying to solve a life problem by using technology. For this project though, the life problem is already solved, the challenge was just making it better. I learned that the best way to do that is by getting feedback from people. Getting feedback from people, whether it is by doing research or by testing the product is key to UX design.

Read More Case Studies: