Shade Savant

Shade Savant is the ultimate guide to finding the perfect products for you! With every use, our smart algorithm keeps getting better, helping you discover the perfect shade for all of your products.

Comment

Inspiration

As we delved into the world of online makeup shopping, we noted a lack of consistency in how beauty companies help their customers select foundation shades online. Through user research, we found that many customers struggled to find the perfect shade of foundation online, despite extensive research and consultation with beauty experts.

As we continued to evaluate how beauty buyers overcome challenges when shade matching online, we found that access needs are not well considered when providing resources for buyers to learn more about a makeup product. For example, many websites rely heavily on visual content, such as images and video tutorials, to showcase the features and benefits of their products. However, this approach can be problematic for people with visual impairments, who may not be able to see the images, read the small text descriptions of the products, or perceive the nuances in shades. Similarly, people with hearing impairments may struggle to access video tutorials that rely heavily on audio commentary or background music.

This realization served as a catalyst for us to take action and come up with a solution to help others overcome these hurdles. We felt inspired to create a solution that would provide reliable and accurate guidance to help customers of all abilities and disabilities select their ideal foundation shade with the confidence that it will suit their skin tone.

In the end, our inspiration was fueled by a desire to empower others to feel confident and beautiful in their own skin. We wanted to put an end to the frustration and confusion that often accompanies online makeup shopping, and instead provide a seamless and enjoyable experience for everyone.

What it does

Shade Savant is a beauty app designed for those who love to experiment with makeup but struggle to find their perfect shade match. By leveraging machine learning technology, Shade Savant helps users find the exact shade of foundation, concealer, lipstick, or any other beauty product that best suits their skin tone and complexion.

The app offers a user-friendly interface that analyzes your skin tone using an AI shade finder and suggests a list of shades that match perfectly. The more you use the app, the better it recognizes your skin tone and suggests ideal shade matches. The app also offers in-depth product information and reviews from real users, so you can make an informed decision about which product to purchase.

With Shade Savant, you no longer have to worry about wasting money on beauty products that don't match your skin tone. You can confidently shop for your favorite beauty products knowing that you'll be getting the perfect shade match every time.

How we built it

Shade Savant was developed through a rigorous UX design process that prioritized user needs and accessibility while incorporating continuous feedback and iteration. We began with user research, where the team talked to potential users to understand their beauty buying patterns, challenges, and needs. Based on the user research insights, the team created user personas and user journeys to guide the design process.

We used an iterative design approach, starting with low-fidelity wireframes and prototypes, testing them with users, and gradually refining the designs based on feedback. Throughout the design process, the team followed Web Content Accessibility Guidelines (WCAG) to ensure that the platform is accessible to all users, including those with disabilities.

The team also analyzed existing shade-matching solutions to identify pain points and opportunities for improvement. We also explored various technologies and techniques that could potentially be leveraged to simplify the process of selecting the right shade.

Challenges we ran into

We understand that a strong concept meets user and business needs. When it came time to begin ideating on features of our solution, after completing our market and user research, we struggled to initially strike the balance of designing a solution that had market viability in addition to also meeting user needs. Once we were aligned on a problem and a how might we statement that served as our north star, the team decided to individually ideate on features through sketching and then came back together to review in a design studio. We quickly noted a theme among our designs. With this common ground in mind, the design vision began to flow and we were able to prioritize features that elevated both user and business needs.

Accomplishments that we're proud of

We are incredibly proud of the strides we’ve each made as designers in learning about accessibility and inclusivity. We have gained a deeper understanding of the challenges faced by individuals with disabilities and have learned how to approach design in a way that is inclusive for everyone.

What's next for Shade Savant

Development & Implementation

We are so incredibly proud of this project and what our team was able to accomplish together. Looking to the future, we would be excited to move forward with development and implementation, which we have broken down into four phases:

Pre-Launch

  • Review the vision, supporting research, and design strategy for Shade Savant with a development team to identify the best approach for development.
  • Identify quality standards for development.
  • Conduct additional user testing with a larger pool of participants in order to further identify any existing usability and accessibility issues.

Front End Development

  • Translating pre-launch visions and UX/UI designs into code.
  • Review designs, architecture, and interfaces with front-end developers.

Back End Development

  • Building of the system architecture, databases, servers, application programming interfaces (APIs), security, and any additional necessary background processes.

Post Launch

  • Quality Assurance testing
  • User Acceptance Testing (UAT)
  • Test Driven Development (TDD)

This is only the beginning

During the design process, we had a number of features and integrations in our technology backlog that we are seeking to explore further through user research and usability testing.

  • Comparison chart highlighting product features of similar products for greater discoverability of new products.
  • QR code to connect our virtual try-on via a mobile device to be used in ads, in stores, or via an affiliated collaboration for PR.
  • Adding an “add to cart” button in the snapshot feature for quick purchases.
  • Exploring the possibility of creating a browser plug-in for desktop.

Built With

Share this project:

Updates