UX Designer



Case Study: UX Design, Content Strategy

Centerpiece: Helping every man find his style

The problem

When I worked in menswear retail, we were constantly fed data on our customers. And the biggest pain-point for men when it comes to getting dressed is: most men aren’t educated in how to put an outfit together.

Like it or not, how you look says something about you to others. And in a lot of situations, how you’re perceived is important. Whether at work, or when your partner wishes you “dressed your age”, people’s perception of you can be influenced by how you are dressed.



A tale of 2 men

I interviewed a group of 5 men. All were working professionals aging in range from their 30’s to mid 40’s. What I discovered in general is that there are 2 different types of men:

  • Men who are confident in their style: These men are very self-aware of how they look, and enjoy expressing themselves through fashion. They take the time to strategize what they are going to wear, but are always looking for styling suggestions.

“What can I wear with these shoes? This hat? This jacket?”
— Confident Chris
  • Men who are “fashion aloof”: To the dismay of their partners, these men aren’t aware of any guidelines to follow when putting an outfit together. But they do care enough to “get it right” when the occasion calls for it as to not embarrass themselves or their partners.

“My wife wishes I would dress better.”
— Alex Aloof


Affinity Mapping.png
  • Process: The users I interviewed that fit into the Conifdent Chris persona, all had a similar ritual of creating an outfit which centered around a single “anchor piece.”

  • Fit: Both personas didn’t always understand how their clothes should fit their body.

  • Style Influence: Social media, pop culture, friends and family are all big influences in their personal style.


Competitive analysis

There are many avenues online that men can take advantage of to get educated about menswear and how to dress. They range from e-commerce sites and social media, to interactive dressing apps.


Lookscope: Create outfits using your wardrobe.

Mr. Porter: High-end menswear e-commerce and lifestyle.


WEAR: Social media sharing of fashion looks.


YouTube: User generated video sharing.



Ven Diagram.png
  • WEAR’s social media model is great, since results are from “real people” which adds to it’s credibility. But the app caters more to a fashion-forward audience of both men and women.

  • LOOK’s interactive concept utilizes real images of your actual wardrobe for you to mix-and-match. The interactivity was interesting, but LOOK’s experience was “clunky”, and it takes a lot of effort to upload your wardrobe images.

  • Mr. Porter is a great e-commerce/lifestyle site for men, but as a “high-end” menswear experience it may feel intimidating for most people, especially for somebody in the Alex persona.

  • YouTube is always a wealth of information, but you never know what to expect when it comes to the credibility and quality of user-generated videos.

Of all the competitors, I felt that WEAR and LOOK were the most interesting because of the interactivity. Mr. Porter and YouTube could be very detailed and elaborate, but not as accessible to Alex type personas. I believe my opportunity to improve on current solutions lies in creating an app that is interactive, in-depth and menswear-focused only.


Design Approach

Dressing well is a skill

When considering both personas, I realized that Confident Chris may have been like an Alex Aloof at one point in time, but eventually got educated in how to dress. For Alex, learning how to dress never really mattered, but at some point in his life, having the skill of putting a look together will.

I believe, in creating an app which helps Chris find styling solutions I can simultaneously help Alex (or whoever is dressing him) with his need to become a better dressed man. If Alex chooses to continue and develop this new skill, my solution would need to be delightful and accessible enough to be of value to him, but also rich enough to be of value to Chris.


What is your centerpiece?

Chris’ testimonial was very insightful, “What do I wear with these sneakers? This hat? This jacket?” All the Chris personas I interviewed had a similar ritual when creating a look for the day. They would pick an “anchor piece” (sneakers, shirt, hat, etc.) then determine the rest of their outfit around that piece. The idea is very efficient and effective, yet simple enough for Alex to adopt as well, and a perfect idea to build my solution around.

I felt that WEAR’s social-media platform, and the interactivity of LOOK were the best competitor features. Keeping this functionality to facilitate finding a style solution would be ideal.


main user flow

The main user flow is the guided search for a “Centerpiece” garment through a large library of options to choose from. In an effort to add value to the experience, I’ve considered an editorial section (Learn More) for users that want to take a deeper dive into the history of the garment or “how-to’s”. This is something that wouldn’t need to be launched for the MVP.

Main User Flow.png

The images in the search flow should be large enough so users can easily find the piece they are looking for, or discover new types of clothing that might pique their interest.


Information Architecture

Since the guided search is the main feature of the app, it needs the most support. To truly act as a hub to discover menswear, the database must be very extensive and robust to accommodate as many options as possible for users to search.


Usability Testing

Login screen

Problem: When given the task to “create a profile”, multiple users would interact with the username form field, as opposed to tapping on the “create profile” button.


Solution: By removing the form fields on the first screen, there is less ambiguity as to what the next step to take is. A consequence of this edit is an additional screen for the login flow.


Quick Search

Problem: When given the scenario “Find results for a Blue Bomber Jacket”, Confident Chris type users, found it cumbersome to filter their search for blue, as they were expecting a filter earlier in the search flow. In this iteration, filters don’t come until step 4 of the search flow.

In addition, I had implemented two different types of search. One is for the main guided search (Home), and the other for a quicker search which bypasses a couple steps of the main search (Magnifying Glass). This can be very confusing.


Solution: I brought the Quick Search (Magnifying Glass) out of the bottom navigation so that it becomes a shortcut in the main flow, rather than a competing search flow altogether. In permitting search terms to act as filters, search results appear 4 steps earlier than our first iteration.

The “Quick Search” feature.

The “Quick Search” feature.


Final Screens

By offering an interactive, guided experience through the task of composing an outfit, CENTERPIECE can help all men learn how to be a better dressed man.

User-generated content ensures the inspiration is consistently fresh and relevant. In addition, editorial deep-dives and How-To’s give users the resources to increase their “Style IQ”.

The main user flow (Happy Path).

The main user flow (Happy Path).


Next Steps

Men’s style is in constant ebb and flow. CENTERPIECE will also have to evolve as trends come and go. There will always be a need for CENTERPIECE. Here are a few ideas as to where we can go to keep up with the pace of menswear’s evolution.

  • Color Theory Tool: An interactive tool to guide men in how to mix colors.

  • Tailored Menswear Supplement: A supplemental experience which dives into the detail rich area of Tailored Menswear.

  • Product Tags: Product tagging in order to allow for deeper dives into brand editorials or purchase links.