Take-Home Test Instructions


The materials and design provided are not used and will never be used in our app. Similarly, none of your submitted files or code will be used in our product. They are for evaluation purposes only.


The point of this exercise is to test the following;
* Coding ability
* Comprehension - How well do you understand the task?
* Decision making skills - How do you handle ambiguity or difficulties?
* Resourcefulness - What if assets are missing or don't match the spec?


Files
* Wireframe.png - A wireframe for the screen to be built. Includes explanations of various UI components.
* UILayout.png - The screen you are to build.
* Assets folder - Assets provided to you by the "designer"


Task
* Using vanilla JavaScript/HTML/CSS, build the screen from UILayout.png as a simple webpage
* Create the file: index.html
* Make the page responsive (see below for how to setup Responsive Design Mode in the browser)
* Functionality: Tap on a star to toggle the fill image.
* Functionality: Make the happy face bar a draggable slider
* Functionality: Use a carousel to cycle through clothing items
* Bonus functionality: Pick something to implement without compromising the designed UI layout. You have creative freedom here.
* Note: You are allowed to use 3rd-party libraries that are under MIT or Apache licenses, especially for functionality.


Deliverables:
* Please provide all the files necessary to run the webpage.
* I will test your submission by running index.html in Safari.


Responsive Design View
* Chrome: https://developers.google.com/web/tools/chrome-devtools/device-mode/
* Safari: https://thesweetsetup.com/use-responsive-design-mode-safari/
* Firefox: https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_Mode