capstone-p4

whitetransparentunblur

✨Shady💄💅 - Foundation✨

Shady is your go-to, Vue front-end, beauty assistant designed to simplify the process of discovering the perfect foundation match tailored to your unique skin tone. This app takes the hassle out of endless swatching and guessing, bringing you a seamless and personalized experience. Users are able search their current foundation brand and shade and our app will provide a list of matches from other brands with the same shades! The database for foundation brands are constantly being updated.

Access the site here -> https://shadymatcher.netlify.app/ and find your matches today!

Screenshots

Starting here, users are able to select their current brand of foundation..
Screenshot-2024-01-21-at-7-13-02-PM
After selecting their brand, they'll be prompted to select the foundation name and their shade. Once the shade is selected, a list of matches will appear at the bottom.
Screenshot-2024-01-21-at-7-13-09-PM
Screenshot-2024-01-21-at-7-12-42-PM

Technologies

HTML | CSS | Node | Vue | Babel | Axios | Airtable

Future Features

  • Users will be able to match other types of makeup like concealer and blush
  • Users will be able to email their list to themselves for personal keeping
  • Users will be able to click the link to each match from their list and see a descriptions about the product and be able to order online using an external link
  • Users will be able to see relevant news about the latest makeup trends, products, etc.
  • Users who are beginners to makeup will have access to a page that has tips and tricks on how to use products, which tools to get and what stores are best