BODS

BODS isn’t just for consumers — it’s disruptive tech for retail, too. Fashion brands use the software on their websites, so BODS’ branding needed to be tech-forward but brand-neutral, discreetly blending in with any luxury label’s existing design styles. Since it also had to feel approachable to audiences of every age, our team zeroed in on the logomark and iconography, badges that websites can use to indicate BODS’ tech is available to shoppers.

We created eight black-and-white styles for BODS to choose from, each simple and straightforward; they’re made to be easily recognizable elements that draw users in. Some iterations include CTA copy (“Try with BODS”), and given the global reach fashion brands often have, we shared in situ examples of how they pair with different languages.

Our multiple rounds of design gave BODS the flexibility to test different directions and provide its partner brands with the option that best fits their aesthetics. The branding and design systems are modern yet minimalistic, brimming with foundational components BODS can build on.

It’s standard practice for us to try our clients’ digital products before we start a project, but it was especially important for BODS, a novel concept that relies on technological precision. As we reworked the wireframes and information architecture, we understood BODS’ value lay in the user experience.

Before users can get to the fun stuff (think Cher Horowitz’s virtual closet from the movie Clueless), they first need to make 3D avatars of their bodies. To streamline the onboarding process and help users quickly acclimate to photorealistic fitting, our design team completely overhauled BODS’ user flows, adapting its information architecture to have a series of states instead of a traditional page structure. The multi-state IA reflects the sequence users follow to create their virtual avatars; once they provide their core information (height, weight, and age range), users can choose to scan their bodies or manually input their measurements.

The photo scan sequence is built for mobile devices (both iOS and Android), so we provided a QR code that connects desktop users to the mobile experience. After they review instructions on how to capture full-length images of their bodies, users are directed to place their phones on the floor against a wall. Since users need to step away from their devices during this stage, our full-screen designs guarantee everything is viewable from a 10-foot distance; the screen turns red when users aren’t within the frame, shifting to green when they are. Post-capture, users can confirm whether or not their scans are accurate.

Users who prefer to enter their information themselves are taken through a chain of required dimensions (bust, waist, and hip), with guidance on how to find their correct measurements. When users reach the Build phase, they can adjust the muscle tone in their arms, thighs, and abdomen. BODS’ UI uses toggles and sliding scales to select measurements and proportions to prevent perpetuating notions of “ideal” body types, a nuanced reminder that the way clothing fits is unique to every person. Users can also personalize their avatars’ skin tones, allowing them to visualize how an item’s colors may look on their bodies.

The user experience remains anonymous until the end, with customers encouraged to save their avatars for future use only after they’ve seen BODS’ value. Body measurements and photo scans are sensitive information, so BODS’ user flow also provides customers with a Privacy Policy that details how their data is used and stored.

Luxury fashion labels ally with BODS in the hopes of selling more of their products, and purchases are a clear marker of success. For BODS’ UI/UX updates to tactfully increase conversions, our designers optimized the features that prevent drop-off and motivate shoppers to click “Add to Cart,” the action that helps clothing companies track how beneficial BODS’ tech is. 

Just like brick-and-mortar stores, BODS’ drawer system allows users to “try on” single pieces or build entire outfits, a practical feature when shopping for a specific occasion. Customers can explore different clothing categories, browse available colors, and compare sizes, with BODS suggesting other items that pair well with the ones they’ve already chosen. Shoppers can then add the full look to their carts or select items individually.

Avatars are presented in 3D with a full 360-degree rotating view, so customers can assess fit and appearance from various perspectives. BODS’ Fit Map and Fit Notes indicate how a single garment might look based on the user’s measurements for more accurate sizing. If BODS predicts a skirt will be tight around a person’s waist but loose around their thighs, it acts like a stylist on a showroom floor and recommends other sizes to help them find their best match.

Coupling premier customer service with a fashion brand’s sales goals, these features deliver a fully fleshed-out experience that stocks BODS’ virtual fitting room with the hallmarks of in-person shopping. It’s a balance that highlights convenience without depriving shoppers of the thrill of finding their perfect fit, the feeling that prompts them to click the button that matters most to clothing companies: “Buy Now."