emBODY

User Personas

Using the insights gathered from the interviews, I created two user personas: one of a habitual shopper who loves fashion and one who shops occasionally and buys the same things over and over.

Competitor Analysis

Immersiveness: the degree to which a person's unique body measurements are being incorporated. Fit accuracy: refers to how well the clothes are projected to fit virtually compared to how they actually fit in real life.

• Zeekit, a start-up company founded in 2013, developed the first dynamic virtual fitting room giving every person the chance to see themselves in any item of clothing found online. The company was acquired by Walmart with the retail giant stating that the AR technology will be available "soon." 
• Amazon aims to do something similar and is currently developing its own technology so that customers can try on clothes prior to purchasing them.
• Style.me, Asos, and Gap all have solutions available but are limited by the shopper only being able to use an avatar based on basic measurements and generic body shape selections.
• Uniqlo offers augmented reality mirrors which allow in-person shoppers to select and try on clothes of different sizes and colors without having to grab more clothes inside the store. The fit accuracy is low because of the rudimentary way the clothing is displayed on the person's body.

The Design Process

1

2

3

4

5

6

Feature Specification

Using the insights gathered from the user interviews, I identified the two main problems and listed the app features necessary to resolve them.

The Design Process

1

2

3

4

5

6

Wireframing

These are the low-fidelity wireframes that I sketched. The screens include the onboarding screens (top left and right), the checkout process (bottom left), the user account screen (bottom left), the screens to try on clothing (top and bottom right), the screens for outfit inspiration (bottom right), and the screens to shop (bottom right).

User Flow

The task (top) and user flow (bottom) illustrates an ideal user experience starting with the onboarding process to the user checking out.

The Design Process

1

2

3

4

5

6

Rapid Prototyping

The “Getting Started” screens are intended for app users to customize their experience by specifying their favorite stores and clothing items, typical sizes, and style preferences. In this onboarding sequence, the user will also be able to provide a 3D scan of themselves for trying on clothes later.

The “Explore” page was created so that app users can scroll through and search for fashion and styling inspiration before starting their own shopping session.

Being able to try on clothes virtually before purchasing them is the main purpose of the app with the "Try It On" screens being where this actually takes place. Once the user searches for and favorites items via the "Shop" screen, the 3D scan that the user was prompted to take during the onboarding process will be utilized when virtually trying on clothes.

The Design Process

1

2

3

4

5

6

Usability Testing

Unmoderated usability tests were conducted with three out of the four interviewees participating. The instructions that were provided to each interviewee are described in the figure below.

User Feedback

After conducting the unmoderated usability tests, I asked the participants to answer questions about their experience. Below are the key questions and the participants' subsequent responses.

How was your experience using the prototype?

• "I liked it. It was super smooth. It basically put the places that I would normally shop right at my fingertips. That was really helpful. I don't have to go and bounce around like five apps. I can do it all from one app."
• "I liked the option where you could see it styled in different ways like tucked in, not tucked in, sleeves rolled up, and sleeves not rolled up."
• "It's cool and easy to navigate."

What would you add to the prototype?

• "I'm not sure if when you're checking out, are you checking out directly from Nordstrom Rack or H&M? Because some of those places offer a rewards program. I'm not sure if I could tell if I was actually checking out directly from the website.”
• "Add customer reviews with pictures and within the reviews, give the option to upload pictures and specify height, weight, and body type so that other customers can compare themselves to the size that they're looking for."
• "I would deep dive into what a fit score means. I don't know if it's off a scale from 1 to 10 or 1 to 100. If the fit score is 70, I don't know if that's something someone should buy."

Would you use this prototype in real-life?

• "I would 100% use this in real life. That was probably the quickest I've found something as far as shopping goes. It was just all right there. There were like six stores total and that's as much as I do. And with a lot of these apps, it's a guessing game when you're shopping. But if you can go in there, take a full-body pic, and can see yourself in the clothes. That's half the fight right there. Probably more than half the fight. I would definitely use this."
• "As long as the fit score translates to being a good fit, then I think it could be a really good app."

Rate the effectiveness of this prototype for shopping for clothes online using a 1 to 10 scale, with 1 being very ineffective and 10 being very effective. Also, explain your reasoning for that score.

• "I'd say a 9. You take all of the guessing out of it. But then there's still that one chance a material fits tighter in real life than it looked on your body."
• "I would give it a 10. The only thing that I would add would be some customer review options."
• "I would give it a 9, because I don't know about the fit score. If the fit score is on point and people are able to get what they need and it reduces returns, then it's a 10. It's a 9 because I don't know what the fit score is, what's involved, and how it translates to the best fit."

The Design Process

1

2

3

4

5

6

Iteration

Fit Score (Now Called "Fit Rating")

One participants' feedback was that he did not understand what the fit score meant and how it translated to a best fit.

• To rectify this, I switched from using a quantitative scale (0 to 100 percent) to a qualitative scale using three possible ratings: "perfect fit," "okay fit," and "not for you." Each rating was allocated a specific color: green, orange, and red respectively.
• I also updated the information provided about the fit score in the onboarding screens to include the purpose of the fit rating, what the fit rating takes into account, and the color legend for the three ratings.

The Checkout Process

Another participant's feedback was about it not being clear if he was checking out from multiple stores or not. 

• For this app, the shopper will only have to checkout once with the proper information being communicated with the each store on the shopper's behalf. 
• However to make the distinction between different stores clearer, I added section headers that specify the store from which the item is being purchased, the number of rewards points being accumulated as well as the number of stores the user will checking out from on the checkout button itself. 
• I also added order numbers for the various stores on the "Cart" and "Order Summary" screens.