New experience for creating an illustrative character of yourself or alter ego

This project was completed for Microsoft's Rio website that launched coinciding the Rio Olympics in Rio, Brazil. With this interactive and inclusive design experience, people can celebrate their superpowers by making and sharing a #RioHero avatar. I owned this entire experience from conceptualizing to final product and worked closely with our illustrator to bring it to life. 

Through this project, we wanted to celebrate user-generated content for a greater good and empower people to share their own content that champions awareness for Colectivo do Esparte, a crowdfunding initiative by Microsoft to support pro-athletes improving the lives of Brazilian youth through sports.

MOBILE DESIGNS

The mobile experience for the Rio avatar went through a few stages of design. After researching face recognition technology and what is currently being done, I landed on a top-down format. I wanted the user to be able to immediately view the changes they are making to their avatar. To best solve this issue, it was optimal to have the avatar above the editing capabilities. The bottom bar serves as a roadmap for creating your avatar. 

In the initial phases of this project, the avatar was going to live within a panel on the hub page. The user would click a CTA and the avatar panel would slide over the previous content. This experience had limited real estate and would be problematic for accessibility users. Within the panel, the user would upload a photo and then add a mask layer on top of it, serving as a filter. After much consideration, I argued it would be a more successful experience if the avatar was its own experience,

where the user could create a digital version of themselves. An iterative design process was used throughout this project. User interviews were conducted and a prototype was created in partnership with a creative agency. Information from prototype reviews were integrated into the design. I identified usability issues that may arise while using the experience, and was able to solve these issues.