The Client
Mens Gold Boxx is a risk-free retail & subscription for Big & Tall fashion that fits. Mens Gold Boxx is an e-commerce revolution with intuitive customer profile. Mens Gold Boxx Apparel proudly offers the clothes you want that you just can't find elsewhere – menswear designed for your build and your proportions. While other stores end at size XL, that's where MGBXX begins.
skip to the prototype?
Mens Gold Boxx doesn’t believe fashion for Big & Tall men should be as far behind as it is. They aim to remove the stigma associated with Big & Tall men and recognize Great & Tall men instead.
“We’re a family run business set out to LOVE all the Great & Tall men of the world.”
LUXURY FASHION
KILLER STYLE
The Basics
Team
3 designers
My Role
Lead UX Designer
timeline
3 weeks
tools
Figma | Sketch | Invision | Miro
Pre-Determined Goals
Create a functional e-commerce website that targets the Big & Tall market with an emphasis on subscription boxes.
Create an impactful and sophisticated design experience that positively affects users shopping the luxury brand.
Setting The Scope
I was determined to talk to and interview as many people as possible that have been struggling to purchase the right size clothing online. I surveyed users on their thoughts, pains, and gains on other existing e-commerce websites that provide a selection for Big & Tall men. One of the most important parts of my research became reading reviews and pain points online from different websites - there are tons of these.
Research And Discovery
Identifying user needs
As project manager I lead the research process and we started by analyzing online reviews as it was the easiest and most effective way to understand user needs. Because we were targeting the market of Big & Tall men, where the topic might be sensitive for users, we decided to synthesize the data already available online. By collecting reviews from different websites my team and I started working on identifying pain points, desires and needs using the “Affinity Mapping” technique.
Affinity Mapping User Experience And Reviews
“Not finding my size in store feels like I’m not an actual person.”
Identifying Pain Points
Top takeaways:
Limited selection of sizes
Price for XL+ higher than for smaller sizes
Lack of quality materials
Lack of communication post-transaction
Unclear return & exchange policy
Differentiation and stigma associated with Big & Tall
Lack of tips & assistance through the shopping
“Never being able to find anything in my size. I actually don’t even go shopping anymore because the Big &Tall selection is so ugly that it’s not even worth my time.”
The “Shopping Experience” online survey provided us with responses from 10 users. These were the main takeaways:
Target age: 27-69 years old
Annual income $80K +
70% buy clothes quarterly
90% have trouble finding clothes online
40% consider product collection the most important factor
40% are not comfortable buying from unknown websites
Competitive Market Analysis
During competitive market analysis our team compared three different e-commerce options for Big & Tall men: JC Penney, DXL, Men’s Wearhouse as well as three different subscription companies: Frank and Oak, Stitch Fix and Trunk Club. We also created three different categories to compare:
Market positioning
Website
Profile & Checkout process
Comparing market positioning showed us that most of the e-commerce options for Big & Tall concentrate on just offering large sizes but none of them are keeping up with the latest fashion trends.
From websites the key point we learned is that each of the competitors are offering some sort of specials such as coupons, loyalty program, etc. E-commerce website have product reviews present, but subscription services do not. Also, none of the existing subscription box companies on the market are offering larger sizes for their customers (the largest size is 3XL).
Profile & Checkout process tends to be similar, and return and exchange policies were easy located and clearly described. Our team was interested in how many companies offer the option to checkout as a guest. We found that most of the subscription services do not currently allow guest checkout.
Online reviews, interviews in person, and competitive analysis lead us to identify user personas.
Building Empathy
Defining User Personas
From the information gathered based on our research, I created two user personas to represent a mental model of our users. The first persona is the subscriber for regular box delivery and secondary persona is a regular or occasional shopper.
“The Subscriber”
Our primary persona is Adrian, a 52 year old attorney. For Adrian it is most important to receive quality, comfort and the right fit. Adrian is well respected in his community and wants to dress nicely. He has no time or desire to shop and would appreciate someone doing it for him.
“Occasional Shopper”
The secondary persona is Jarred Lorenzen. Jarred cares about his look and loves shopping. He is looking for unique and trendy items. Jarred is very social and looking for ways to impress people. He has trouble finding clothes that fit him nicely and doesn’t appreciate shopping in big department stores that rarely have anything special to offer. He doesn’t understand why fashion for larger men is so far behind.
Customer Journey
Our users were given a task to purchase a clothing item that would satisfy their taste and fit right. As a result of limited sizes and selection for Adrian & Jarred, their user journey ended on evaluation of product and they never achieved their goal to complete the given task of buying a product. From the user journey above we can see that users are not sure which size and style to select and give up before moving to the next step of their journey.
Problem Statement
Lack of an e-commerce experience for Big & Tall men that offers quality, modern selection, perfect fit and customized styles.
Developing Stage Or “Ideas to Action”
Minimum Viable Product
How did we prioritize design features to achieve the goal of the stakeholder? As a team of 3 UX designers with 3 weeks to complete this project we decided to use MoSCoW method to identify the minimum viable product. And based on the prior research we identified features the website Must have, Should have, Could have and Won’t have.
MoSCoW Method - Deciding On MVP
1. Mens Gold Boxx prioritizes having subscription boxes delivered and customized for each customer. With this main business goal, we decided to concentrate on creating an easy sign-up process for new customers to get started. In order for the company to personalize styles and sizes it has to have an intuitive user profile - accomplished by an account page.
2. The second goal of our stakeholder was to be able to sell single items along with subscription boxes. This would help the company manage inventory and sell more products. We had to make sure categories and customized product pages would be some of the main features on the website.
3. Mens Gold Boxx is a young and growing company on the market so I decided to redesign the about page. I wanted to place special importance on the story of the brand and highlight the excellent customer care they provide.
Information Architecture
SiteMap
Scenario #1
Adrian’s coworker recently found out about this new company calls Mens Gold Boxx and recommended to check it out. Adrian is going through the same struggle as his coworker when looking for a perfect fit and decides to visit the website. Adrian wants to read what makes this company unique and clicks on the About Us page. He likes what he learned and chooses to subscribe for a box of promised “custom fit” clothes selected by specialists for him every three months.
Scenario #2
Jarred is known for his style, and this is not the first time he uses Men's Gold Boxx. This time Jarred is getting a gift for his father and buying a dress shirt for him.
Scenario #3
Jarred wants to make sure the gift arrives on time and wants to check the status of his order. He might also want to update his account preferences and try a subscription box for once.
Low-Fidelity Sketches
I sketched countless ideas and brainstormed various possibilities with my design team and created low-fidelity wireframes and prototypes to test. My responsibility was to design and build:
Account (multiple pages)
Product Page
About Page
Account Page
Product Page
About Us Page
Mid-Fidelity WireframeS & Post-usability test iterations
Our team never forgot that we are designing for users. We were always open to each others critiques, changes, and ideas throughout the process. We performed usability tests on 6 people that met criteria of our personas and we were able to complete all the necessary iterations.
Account Page Variations And Changes
Account page iterations:
1. Removed user profile picture along with email address and phone number of the customer. These features seemed unnecessarily listed, as contact information could be found in one of the account sections.
2. Experimented with different designs and looks. Turns out that our users appreciated a simple and clean look.
3. Added icons to visually separate and differentiate sections of account without reading.
4. Added alternative shipping and payment methods. This would be helpful for users who want to use different cards and ship products to other addresses.
5. Added option to place subscription on hold for those who might travel or do not need a new shipment.
6. Added a new feature - “Referral Program” and explanation of how it works.
7. Combined sections into one to avoid heavy text in order to keep it clean and simple.
8. Added golden highlight to the section the user is currently interacting with.
Product Page Variations
Product page iterations:
Moved location of pictures from the bottom to the side. By researching worldwide brands I realized most modern websites would place product images on the side instead of the bottom.
Made call to action button stand out more.
Added option of customized video.
Separated the selection of sizes by making it clickable instead of drop down.
Replaced button favorites with a heart. It appears our users are familiar that heart represents favorites.
Added additional product information. We learned that most men are interested to read more about product and care.
Added feature to read and leave reviews.
About Page Variations
About Page iterations:
Break down heavy text into more paragraphs.
Added more images.
Added icons.
Added more white space.
Mens Gold Boxx is different from other businesses. Mens Gold Boxx cares about their customers and one of the company’s main goals is creating long term relationships based on respect, excellent customer care, and understanding. In general my goal was to create an About page that new customers will never skip. I wanted each user to understand what the company cares about - their value and goals. I wanted users to feel the care throughout the website.
Hi-Fidelity Wireframes
Responsive Mobile Design
Prototype
Afterthoughts
Success!
I couldn’t be more proud of the founder of Mens Gold Boxx - Cristina Rodgers - for winning this year's MassChallenge Texas Awards Ceremony.
My next steps to make this project and prototype better would be:
Creating pages with rating and reviews. This would help the company to understand what items are in demand and how to improve their business.
Providing tips & tricks. This would be a particularly important feature for our users as our research showed they are interested in learning how to match items, combine different pieces, and take care of their clothing.
Exploring live chat and assistance. As Mens Gold Boxx grows this will become a necessary feature to maintain customers and minimize returns.
Mobile app. Again, as business expands this is something to consider. A mobile app will simplify all actions including browsing, purchases and correspondence.
Guest Checkout might be an important feature for users interested in a single item. This will also decrease the risk of deterring new customers that are trying the company for the first time.
A Blog where customers could correspond with each other, supporting taste, needs, and gaining confidence.
