Beauty Beyond Barriers

Estee Lauder Landing Page featuring BBB
BBB Makeup and Skincare Page
BBB Video Tutorial's Page
BBB Mission Page

Inspiration

We were inspired by beauty influencers with disabilities who are working to be the representation in beauty they didn’t have growing up, who are showing that makeup doesn’t have to be about perfection and can be fun. These influencers show how to use products designed for people with disabilities and products that are “accidentally accessible” - products that were not initially designed for people with disabilities but happen to work well.

Brands like Haus Labs, Fenty, and Rare Beauty are currently being established as “accidentally accessible.” We think this is a fantastic opportunity for Estee Lauder to similarly position itself as accidentally accessible, by highlighting current products that would be easy for people with disabilities to use.

To create something amazing, we looked at competitors’ websites. Brands like GuideBeauty and VictoriaLand create products for people with disabilities, and their websites are accessible. Lancome has a section of makeup tutorials with text descriptions. On YouTube, Google provides links to the products used in YouTube makeup tutorials.

What it does

We created a section of Estee Lauder’s website, Beauty Beyond Barriers, to house a collection of Estee Lauder’s most accessible products so that people with disabilities don’t have to comb the website or guess what might be accidentally accessible to find something that works for them.

The people we talked to said that they didn’t know a product would work for them unless they saw someone with a disability using it. So, we created a section for tutorials by and for people with disabilities. We placed the products used next to each video so that viewers could simply add them to their carts from that page. Google and YouTube have something similar.

We integrated accessibility icons next to product names to highlight which products were accessible for certain disabilities. For example, highly pigmented products are great for people who have difficulty with repetitive motion and fatigue. That way, while browsing the website, people with disabilities won’t have to guess which products are accessible and which are not.

How we built it

This application was built using the MERN stack (MongoDB, Express, React, and Node.js). We started by setting up a MongoDB database with all the products for the website and connected it to our Node.js server using the Mongoose library. Then, we used Express to create RESTful APIs for the data to be used by React on the front-end. With the site's structure set up, we used the designs from our UX/UI team to style the website. To deploy the site we used Netlify for the front-end and Fly.io for the back-end.

Challenges we ran into

We initially built out a section of Estee Lauder's website that could be easily integrated into their current website. We wanted to make sure our design was entirely feasible and possible for Estee Lauder to implement. By the time we realized that the design was meant to be a technical solution, it was too late to change what we had designed. However, we believe that the strength of this design lies in the fact that it is achievable.

We wanted to make sure that the BBB section of the website felt as though it was still part of Estee Lauder’s website. But some aspects of the current site can be difficult to navigate with a disability. So, we struck a balance between making the Beauty Beyond Barriers section more accessible and maintaining the feel of the website.

Accomplishments we’re proud of

When we tested our design, users found it easy to use and navigate. Our design is consistent with Estee Lauder’s current brand. We believe that it is a feasible design that could be integrated with Estee Lauder’s current site.

What we learned

We learned that people with disabilities want to be included, that they want to have the same experiences as everyone else, and that many modern experiences and products were not designed for them. We see this as a great opportunity to design inclusive products and experiences for people with disabilities, so that they can be included."

What’s next for Beauty Beyond Barriers

Beauty Beyond Barriers is an amazing opportunity for Estee Lauder to position itself as an accidentally accessible brand. By partnering with people with disabilities, Estee Lauder will demonstrate inclusion and diversity. We think this is a fantastic opportunity for Estee Lauder to send products to people with disabilities to test so that Estee Lauder can determine which products are accessible and which are not. By showing that Estee Lauder cares about the disability community, Estee Lauder will win brand loyalty among people with disabilities and expand its customer base.