Posture Wings
Advanced Sports Bra
Case study
Overview: Posture Wings™ is a startup athletic bra manufacturer producing patented garments that are bio-mechanically engineered to reverse poor posture.
The Problem(s): Even though the initial run of its flagship product sold out, producing a second production run and setting up an e-commerce site is not financially feasible at this juncture. The company needs investment capital to grow.
The Solution: Develop an informational "smoke-test" site to generate product interest, capture leads, and set up a nurture campaign to demonstrate to potential investors the high demand for the product.
Deliverables: Customer research, an interactive wireframe, a hi-fi prototype, a new website, and marketing strategy.
My role: Strategic Vision, Visual Designer, Information Architect, Interaction Designer, and Project Manager. Teamed with another UX Designer who performed in-depth user research and tested the interactive wireframes.
Time frame: 2 Weeks
Whiteboard brain dump
Current-state analysis
To develop a concrete, executable road map that would address the bulk of the business points, my colleague and I dove in to understand the complexities forming online bra sales.
Posture Wings has a unique product that differentiates itself in the marketplace:
Comfortably supports breasts, spine, and shoulders.
Allows freedom of movement.
Improves posture while reducing bounce.
Increases muscle strength and memory.
Reduces disk and joint inflammation.
Reduces back pain.
Website homepage before redesign.
Previous website analysis
Observations
Posture Wings logo and branding are not present.
Navigation terms are not user-focused.
It’s unclear what the actual product is or what it does.
No clear hierarchy of information.
Textual content is disjointed.
Photography does not highlight the product.
Conclusion
A total overhaul and redesign of the website is needed to establish brand credibility online.
Approach plan
Analyze the existing market and establish target audience.
Develop a "smoke test" marketing strategy to capture leads.
Present the bra as comfortable.
Highlight the product's revolutionary benefits.
Create a community through social media.
Target interested female buyers.
Attract investors by collecting data.
Online Survey
To set the research in the right direction, our researcher crafted an online survey to discover our user's needs and unpack the insights.
There were a total of 19 questions (#5 “I don't buy sports bra” was the screener question). We received a total of 243 responses and followed up with 11 participants one-on-one.
The researcher conducted affinity mapping to uncover more product perception insights.
Important factors users consider when purchasing bras online:
Cost
Quality
Features
Design
Users perceive Posture Wings as:
Expensive.
Unavailable for purchase.
Not fashion-focused.
The current website not trustworthy.
Solutions:
Emphasize quality over price.
Employ smoke test strategy.
Focus on the athletic market.
Position as a high-end engineered garment.
Redesign the website.
Alignmed.com (competitor) site audit
Competitive Analysis
I conducted thorough research of potential competitors and discovered a few brands that have similar products and e-commerce experience that is comparable to our goals.
Alignmed.com is their biggest competitor.
Also investigated Third Love, Intelli Skin, Adore Me, and of course, Victoria Secret.
Card Sort
I compiled navigation terms and held a total of 6 closed card sorts. I asked participants to group the terms in a way that made sense to them if they were going to a learn about a new-to-them product on a bra site.
I learned user's want to get to the product features quickly and what risks there might be to sign up on the waiting list. Less important was the inventor's story or product's history.
Site map
Based on the survey, interviews, competitor analysis, card sort, and all collected research, I formed a mental model of how the Posture Wings site should work and created the site map.
My frame of reference is always “what does the user need and what will make this process easier and more pleasurable for them?”
Business Analysis
Research has shown that most women do not wear a suitable bra, therefore they are inflicting pain on shoulders, back muscles, and spine that negatively affects every aspect of women's lives.
Posture Wings revolutionary design provides comfortable support for breasts, spine, and shoulder, allows freedom of movement, and reduces painful bouncing.
Our client’s restrictions are:
The client has no funding to be used in mass production and/or marketing.
Posture Wings bra cannot be branded as a health product due to tight regulations and restrictions governing the medical claim coding.
How to sell something when you have nothing
The Smoke Test strategy
When a product may be in its infancy or may not even exist, a smoke test is a useful method of providing people interested in the product with insight into your product alongside an option to purchase or sign-up.
Our call-to-action is for people to sign up to be among the first people to be able to buy the product when it's produced. We are not asking for a deposit, just a name, and an email address. As an extra incentive, we're offering $25 off. We'll also use A/B testing to find test offers.
For the hi-fi prototype, we designed 3 pages: Home, Product, and Reserve My Bra".
Digital wireframe testing
After lo-fi paper prototype testing was concluded, we were made aware of several design flaws.
We iterated many versions and incorporated changes into the digital prototypes.
Design flaws I learned of during user testing
Users were looking for homepage or “home”
Prefer to see the bra colors side by side
The footer should be full length of the page
Want to see guarantee policy & social media channels
Users want to see the product pictures large and concise text description
Text blocks were too dense
Fixes made from user input
Moved logo to the center top
Added social media icons
Moved white and black side by side
Added guarantee section
Footer full width
Made the photo bigger
Added subscribe
Added guarantee
Added content cards
Added text under the photo
Moved "Reserve My Bra" to the far right
The goal: Increase the perceived value of Posture Wings through design simplicity.
After the researching, planning, sketching, and wireframing, now it’s time to visualize all the ideas and add a nice sheen to all that is planned.
Color swatch studies
Color studies
I tested 4 proposed color palettes that centered around the Posture Wings brand color.
Palette 1 was considered too neutral by most testers
Palette 2 was considered too masculine
Palette 3 was not feminine enough. One user suggested adding pink, which I had considered but discarded because I thought it to be pandering to the female market.
Palette 4 added a light pink and tested favorably with the test pool.
UI color palette
After the initial 5 base colors were picked, I refined the palette further and chose complementary tints, neutrals, text, and alert colors.
Font palette
I tested several font combinations and the font that scored highest with testers was Josefin Sans.
I used this font for headlines, and Open Sans for subheads, body copy, buttons, fields, and alerts.
Once I tested out all usability mistakes, I started designing the final screens in Sketch.
Layout development
From testing, we learned users prefer to scan a page with lots of pictures and short, concise copy. I created strips of information starting with the hero banner and simple styles with one or two headings and short paragraphs.
Then, I included other content elements like testimonials, lists, links, etc. That gave me a quick brand style guideline that gelled the site design continuity.
The main headline, subheads, and text (copywriting by Lisa Halpern) effectively focus on the pain-point and the solution provided by Posture Wings garments.
Keep evolving
A/B offer testing
Targeted FaceBook advertising
Create a community online through social media sites (FaceBook, Instagram, Twitter, etc.)
Start blogging (forward articles, bio-mechanical science, women’s rights, etc)
Keep in touch with interested users via e-newsletters or emails
Sell existing stock to responders
Consider a company name change and rebrand.