build and expand your personal style
status
"New Event, New Fit", a space where users describe an event they're attending and receive outfit recommendations tailored to both the occasion and their aesthetic.
spring - want to explore more, but end up wearing summer clothes. want to explore more floor length flowery dresses
IDENTITY MIRROR
Top three style attributes of the user, in their own words
Top aesthetics with scores calculated like so:
Match facets against archetype presets.
Weight by confidence
Score each independently out of 100, normalized later.
Iteration #1
This section of the Style Space was pretty intuitive from the get-go. The user would clearly be able to see their top three style attributes extracted from their photos and/or written description. Underneath, they could see their "aesthetic stats" - in a view similar to a bar graph, pie chart, or progress bar-like visuals.
This section of the Style Space was pretty intuitive from the get-go. The user would clearly be able to see their top three style attributes extracted from their photos and/or written description. Underneath, they could see their "aesthetic stats" - in a view similar to a bar graph, pie chart, or progress bar-like visuals.
Iteration #2
I wanted the identity mirror to visually look like a mirror, so in the final iteration for this section I added a basic structure for how this section would look like in the lo-fidelty wireframe.
CONTEXT CARDS
Iteration #1
Each context card would contain insights about the user's style for this specific context, e.g. what a user's style looks like for a night party.
The context cards needed to be very clearly displayed & clickable to reveal specific insights about each. Here were the first set of iterations for the context card section:
Essentially, the idea was the the user could click on a context card, such as "Party", and see their photos in this context they uploaded, their level of confidence (if illustrated in the description), plus all of the aesthetics (e.g. ethnic-formal, romantic) that make up this context, and lastly all the seasons that the user wears this context in.
The problem with this iteration was that it was just a view, and no clear actions if the user wanted to take any.
Iteration #2
After doing some iterations on the model, the final structure of a context would display the user's photos, outfit parts, confidence level, and the aesthetic ratio for each relevant season. This section would be clearly for insight display, and they would be able to take actions in the next section - "Gaps".
LOOSE THREADS
Top three style attributes of the user, in their own words
Top aesthetics with scores calculated like so:
Match facets against archetype presets.
Weight by confidence
Score each independently out of 100, normalized later.
Iterations
The gap cards originally only displayed differences in the user's descriptions and photos. For example, in some people's responses (including mine), a couple of described aesthetics didn't match up with the user's photos. So, in order to include those mismatches, I created gap cards
Here are some examples of those gaps:
The main problem with these gap cards is that there was no clear distinction between an "insight" (which would displayed in the context cards), and what would qualify as a "gap." For example, if a user didn't have a mismatch between their descriptions and their photos, would we not have any gaps?
Another problem is that there were too many actions that the user could take, which could lead to cognitive overload.
This would be re-explored in the next iteration, both on the model and the wireframes.
Iteration #2
After doing some iterations on the model, the final structure of the missing elements in their style profile would be based on if a context was missing a fit / aesthetic ratio for a relevant season.
For example, the "everyday" context can have aesthetic ratios for summer, fall, and spring, but not for winter - so this would be a card under the gaps section, which I decided to name "Loose Threads."
Clicking on a card would reveal an insight about that gap (an AI-generated message based on the detected gap), and allow the user to upload a fit specific to that. This would trigger a reload of the homepage after the analysis is done.
EXPLORATIONS: Aspirations & Frictions
A set of cards that would be displayed to the user consisting of all the outfits / clothing they would want to try out, divided into aspirations and frictions.
An aspiration would be something that the user would want to explore, "I want to wear more mid-thigh length skirts.
A friction would be something that a user is struggling to style, e.g. "I'm not sure how to style a scarf"
