OVERVIEW
Instagram Shopping Try On
2019 — 2020
Brands that sell their products on Instagram can now add an augmented reality try on feature to product pages, starting with makeup and eyewear product categories. Consumers can try products on Instagram anywhere and make more confident purchase decisions by seeing how it looks in context through the immersive experience. Consumers can even buy directly on Instagram in augmented reality.
Goal: Help people build confidence in the products they're interested in. Design a seamlessly integrated and differentiated augmented reality experience in Instagram Shopping, Android and IOS.
Users: All Instagram users, beauty and fashion brands in Checkout.
Why: Users want to be able to try things on when online shopping because they’re unable to evaluate in person before they commit to a purchase. Brands want to add efficiency to the customer experience, aquire more customers and stimulate conversation about the brand.
My Role: Lead Designer, end to end UX/UI design process, prototyping, user research, marketing materials, product vision and strategy.
Collaborations: As an external designer, I collaborated with an Instagram Shopping Designer point-of-contact, an Instagram Camera Designer point-of-contact, received input and feedback from the Instagram Interests surface team ICs and Managers, Head of Instagram Design, Instagram Design Systems team, Instagram Shopping, Camera and Interests product managers and Head of Instagram Product. Within the Facebook Spark AR team, I collaborate with a PM, a technical artist, a researcher, multiple front end engineers (Android and iOS) and the partnerships team.
Process: Extremely agile, the project was ambiguous and broad in scope. To get a new feature (Virtual Try On) in a new product (Instagram Shopping) as an external team (Facebook Spark AR), I led the effort with product managers and designers on multiple Instagram teams, as well as communicated design decisions with product, marketing and partnership teams across different time zones. I researched prototypes I developed in collaboration with a technical artist, identified high-level problems, defined solutions and organized reviews to ultimately get consensus up to Head of Instagram Product on an end-end solution.
Outcome: Try On is live today on the product pages of MAC Cosmetics, NARS Cosmetics and Warby Parker and RayBan with more to come!
USER-CENTERED APPROACH
The Customer
For the Spark AR platform (Facebook’s creation platform for mobile augmented reality), we had 3 main customers who we often referred to as a triple sided market: consumers, being users of Instagram, Spark Platform Integrators, being Instagram, and AR Content Creators, being Businesses or Brands.
Top Customer Frustrations with current experience
Consumers are frustrated by inconvenient product returns when online purchases don't meet their expectations. In-store can also be just as inconvenient, like unsanitary real try on of beauty products.
Spark Platform Integrators (Instagram) are frustrated by the limited ways to differentiate themselves as a new product in a highly competitive market where other platforms have much more tried and true retail experiences.
AR Content Creators (Businesses) are frustrated by the costs and losses associated with dissatisfaction and returns from consumers.
Customer Problem/Opportunity
Consumers want to be able to try things on when online shopping because they’re unable to evaluate in person before they commit to a purchase. At least 30% of all products ordered online are returned as compared to 8.89% in brick-and-mortar stores. One of the highest reasons being the product looks different.
Instagram wants to create a differentiated shopping experience and increase user confidence to engage with and buy products directly in Instagram.
Businesses want to add efficiency to the customer experience, ensure customer satisfaction with the final product, acquire more customers and stimulate conversation about the brand.
When I'm interested in a product, help me see it in context to build up my confidence to buy it.
AR Try On Job
Instagram Shopping Journey
The sufaces in Instagram map to the shopping funnel where users are in discovery when they have low intent on Explore and Feed, then their intent increases to consideration on Shopping Home and Shop Profile, to the highest intent of evaluation on PDP (Product Description Page). We knew we wanted to bring AR where customers already have high intent and are evaluating a product they're interested in.
Iterations for Peer Review
There are 6 different venues to review designs in Instagram's process. I would attend the different venues and often shared feedback across teams to seamlessly understand and integrate into the design system. I was also educating stakeholders on AR, to increase understanding of my solutions and keep visibility high.
Developing Pitch Decks for Partnerships
While I was designing the experience, Spark AR's partnership team was meeting with businesses to get commitment from them to participate in the Pilot launch. I created marketing collateral with the collaboration of my PM to be used to entice businesses to invest in AR and a partnership with Facebook and Instagram. I also worked with a vendor to ideate on visuals that would represent the opportunity for them and their customers. This was of importance especially for Luxottica/Ray Ban, who wanted to participate as part of a larger push for them to be Facebook's AR Glasses partner.
Usability Testing of Current Direction
I wanted conviction on the entry points and the expectations of users in a camera when in a shopping mindset versus a social sharing mindset. Instagram's design system and leadership wanted to maintain a consistent experience across camera interfaces which meant a prominent capture button, but I hypothesised that a purchase CTA should take prominence and that users would prefer to purchase directly in AR. I also tested the location of product information and worked with a technical artist to build an interactive prototype that brought the experience to life. It was also cricual to put AR in the hands of users in convincing Instagram of AR's unique value, to see that the realism/quality met user expectations.
Getting Final Sign-Off on the End-End Solution
Instagram Design review is a venue where designers receive feedback from Instagram's design leadership including Head of Design. I presented the research findings and how user feedback was incorperated as well as how feedback from Instagram Camera and Shopping design team peer review was incorperated. All proposed designs were accompanied by a prototype (created in Origami Studio).
TOP CHALLENGES
1. AR is almost never the only thing to ship a complete product
2. Instagram is not complex by design
3. Being ahead of industry means brands need education and convincing of value
Selected Works
Instagram Shopping Try On #Software #ARProduct Design
Facebook Spark AR Commerce #SpeakingProduct Design
Amazon StyleSnap #Software #VisualSearchUpload photos or screenshots to find visually similar styles on Amazon #VisualSearch #Mobile
Amazon Camera Modality #Software #ARBiggest redesign of Visual Search technology across Amazon #Mobile #AR #Camera
Amazon Package X-Ray #Software #ARSee which of your packages holds which gift, without opening them #Mobile #AR #Camera
Amazon Publisher Services #Desktop #CloudNew suite of cloud services, built to monetize and grow your media business #Desktop #Advertising
Amazon Visual Fashion Finder #Software #AIFilter the most important aspects when shopping for garments #Mobile #Internship #Fashion #AI
Photography #ArtDirection #PrintCollection of photographed International Editorials #Print #Digital #Identity #Photography
© 2024 Andrea Alam