The purpose of this project is to create a feedback interface that combines API data (application programming interface) and user input for a mobile device app.
MISSION
My aim is to achieve a mobile Lipstick Finder app that allows users to find lip products from a variety of brands and websites.
Users can select a brand and a lip product type to find what they are searching for on the internet.
This API is beneficial for comparing prices, colours and products all in one place. (other websites are brand specific or only deliver the brand’s they stock).
RESEARCH
To create my own concept and design of an API make up application I had to find some current competitors on the market; as API's are used commonly in this industry.
This API app/website is similar to what I am trying to achieve but in relation to only foundations. The website uses the NYX product database API to create a custom output based on the users uniquely custom inputs.
Here’s another example of a user input website that utilises an API database; the Clarin’s lipstick finder. I found that the website's intuitively effective in finding the right lipstick for an occasion. Both example’s only use single brand results.
API IMPLEMENTATION AND APP DESIGN
USING CSS AND HTML
This mobile app works as a website, the ability to mimic an application with multiple pages is possible through javascript functions. This works as a switch between div's when certain interactions are made on the web app.
Below is an insight on how my Lipstick finder works along with the site map to reveal its logical hierarchy.
This is the API used for my lipstick finder, containing the details and links to products. I was able to use JSON codes to call out the parameters and string tags advised in their API call guide. After successfully testing and evaluating the API I am going to use I then implemented my visual app design in CSS.
I chose to append these parameters for my desired output and design:
product_category
product_type
image_link
brand
name
price
product_colors
product_link
CONCLUSION
I achieved my aim to create a mobile Lipstick Finder app that allows users to find lip products from a variety of brands and websites all in one place.
This makeup API is beneficial for users, easy to understand by the UI designers that wish to utilise this API and versatile with it’s content. Although some of the product links need to be updated, all the parameters used were successful.