JEANIE: E-COMMERCE MOBILE WEBSITE FOR JEANS
This case study began with a problem. Women's jeans are extremely hard to shop for.
My experience matched that of every woman I spoke with: the process was difficult and disheartening. There is definitely room to improve the user experience, and I conducted research and prototyping to dream up Jeanie, a model mobile website that would provide the best user experience for women looking to find and buy jeans that fit great.
My experience matched that of every woman I spoke with: the process was difficult and disheartening. There is definitely room to improve the user experience, and I conducted research and prototyping to dream up Jeanie, a model mobile website that would provide the best user experience for women looking to find and buy jeans that fit great.
USER INTERVIEWS
I knew what opportunities I saw around the experience of purchasing jeans:
However, I knew this might not be all women's experience, and so I set out to doing user interviews with women who wore jeans multiple times a week in order to make sure I was designing from a broad perspective.
In the interviews, I catalogued the experience of women purchasing jeans with the intent of finding what worked well and what were pain points.
Common threads in the user interviews:
- The overall process of buying jeans should be easier, quicker, and sympathetic to how demoralizing it can be to find well-fitting jeans.
- A way to remember my sizes at different brands, (because they're always different at different brands.)
- Get real reviews about sizing from people, not just brands.
- Recommendations for brands with similar fits to those that work for my body. (Ex, give me suggestions for jeans for a short and athletic build)
However, I knew this might not be all women's experience, and so I set out to doing user interviews with women who wore jeans multiple times a week in order to make sure I was designing from a broad perspective.
In the interviews, I catalogued the experience of women purchasing jeans with the intent of finding what worked well and what were pain points.
Common threads in the user interviews:
- Buying jeans brought up emotions of frustration, stress, and insecurity. (2 users cursed while describing their experience &%$!)
- The information provided on brand websites about sizing and style is confusing.
- Reviews and photos that are representative of multiple body types are preferred and helpful.
- Most users go to the store in order to determine fit, at least initially for a brand.
- If they are ordering online, users feel that they are guessing at their size.
AFFINITY DIAGRAMS & USER PERSONAS
I organized user's thoughts, feelings, quotes, and observations by grouping in this affinity diagram, color coded by user. This allowed me to find common groups and create user personas.
USER JOURNEY MAPS
I visualized the user's experience purchasing jeans, from the beginning spark (finding jeans that no longer fit) to the end purchase and review of the product. I followed the user through the experience of purchasing jeans in store and online, as several interviewees had a strong preference between in store and online.
ANALYSIS & COMPETITOR RESEARCH
In reviewing my research, I began with the list of opportunities from the user journey maps and also combed through other shopping sites for features that worked well, especially those brands my users specifically called out.
I came to the following list of goals for this hypothetical best jeans website:
Clear, helpful and approachable interface
Personalized Fit Recommendations
I came to the following list of goals for this hypothetical best jeans website:
Clear, helpful and approachable interface
- Clear information about sizing and styles.
- Reviews and photos that are representative of multiple body types
- User reviews that can be sorted by body type, height, weight, and user-submitted tags
- An friendly user interface that allowed users to help and be helped by their fellow jeans-searchers
Personalized Fit Recommendations
- A favorites system that would allow users to save a shortlist of jeans while browsing
- The ability to create a profile that would save personalized filters
- Integrates with software already in use on clothing websites which recommends best size, (True Fit is one example) to recommend other styles based on similar users purchase and review history
- Website would collect information on returns about how and where the fit was off, and would be able to use that for refining sizing suggestions
INFORMATION ARCHITECTURE, WIREFRAMES & PAPER PROTOTYPES
Once features were determined, I laid out how the page would be organized, began to plot the user flow to purchase jeans, and created wireframes to sketch out the initial pages.
INITIAL DIGITAL PROTOTYPES & USABILITY TESTING
After sketches and paper prototypes, I moved to creating digital iterations of Jeanie in Adobe XD.
The current working prototype can be viewed here.
The current working prototype can be viewed here.
|
Iteration 1
In the first version, I started by creating the home screen and user sign-up flow. During testing, users found the design appealing and the flow logical, but I quickly found that the filter creation buttons were too small--they were difficult to click and sometimes resulted in the wrong button being pressed. |
|
Iteration 2
In the second version, I edited the filter buttons to be larger, and continued with the browsing flow. Users could now complete their profile and be taken to their home page, where Jeanie would allow them to browse with their saved filters. During testing, the buttons were easier for users to interact with, but they found the sign-up process to be overly long, and didn't notice that the second part, filter selection, was optional. Also, the review username creation seemed out of place on the filter page. On browsing, the pre-applied filters appealed to them, and they emphasized they wanted the ability to see models of different sizes and find reviews that most directly applied to them. |
|
In version three, I completely changed the flow for signing up by splitting it into two parts: a standard account sign up page with personal and login information, and a profile setup that was highlighted at the top of the page after account setup. This allowed me to simplify the initial account creation, and then make the profile setup easier and quicker to interact with.
From there, users would go to their personal account page, where they could shop recommended styles, their favorites, and all jeans, as well as make account changes or check on orders. Browsing has not been changed, but in the next version, I may change the button styles and interaction to be more in line with profile setup. Note that I forgot to apply my own filters in choosing example jeans, and apparently thought those brown jeans were swell enough to break Jeanie’s filtering system. Next focus will be on developing the review system to allow user reviews to be sorted by body type, height, weight, and user-submitted tags. |
WORKING DIGITAL PROTOTYPE
My current working prototype of Jeanie can be viewed here.
Smartphone frames Designed by Freepik