As the Visual Designer overseeing Avatars, one of my projects was bridging the Avatars Design and Art teams by art directing eye-catching modules for the Storefront Collections’ Discover Tab featured on Facebook, Instagram and MetaQuest. Avatars would model clothing collections from well-known brands ranging from top fashion names, video games, sports leagues to popular shows. i.e. Puma, NBA, Diesel, Street Fighter, Stranger Things, Luxxotica, Madhappy and many more. It was important to capture the essence of the respective brand, the Meta brand and the expressive world of Avatars.
This product feature kept evolving as Avatars were constantly being improved. We adapted quickly rendering diverse avatars, dynamic poses, hand-picked outfits and custom backgrounds for each module.
Here are selects featured in-product early 2023:
While these modules were visually appealing and gave users a generous preview of the clothing/brand, they weren’t scalable. They took up too many resources to generate, took up too much valuable vertical real estate on the apps, provided little information about the collections and lacked any call to action.
For the next update, I worked alongside the product designer to ideate possible solutions. We presented several and after extensive A/B testing and data, this condensed, easily scalable version performed the best and is seen in-product today.
This solution displays a new CTA button, a customizable title, fun tagline and allows several collections banners to display at once. Overall this increased click through rate and decreased load time, both key metrics to improve the Avatar user experience.
On the back end, these can be scaled quickly by having a consistent layout with just one posed avatar.
A handful of the newer modules featured in-product (design only, sans text).
Both the avatar and background were carefully selected per collection, keeping diversity in mind and complimentary color palettes for that month.