Goal: Expand your understanding of both Sass and User Interface basics, by developing more complex, responsive interfaces using the advanced Sass concepts introduced last night.
Many developers work for companies creating online stores. As such, it's a good idea to have interfaces for online stores in your own portfolio too. Select one of the following E-Commerce sites to recreate. Each has a different style, and sells a different type of product, but all have clean, accessible user interfaces that gracefully resize to adapt to all screen sizes:
After completing the store's homepage, clone at least one product detail page, and link the two together using multi-page HTML techniques discussed in this week's homework.
Take special care in implementing the advanced Sass features discussed in last night's homework, too, including Mixins, mathematical operators, partials, and color manipulation.
After completing the homepage, select more of the site's other pages to create (product detail pages, etc.). After crafting 3-5 total pages you may move on to the project below.
If you're able to complete multiple pages (at least 3-5) of an E-Commerce site clone with time remaining, go back and tackle another award-winning site featured on Awwwards, as suggested in yesterday's classwork.
If you already cloned the Awwwards site yesterday, select a different award-winning site featured by them instead. There's tons! You're bound to find something you're drawn to.
Recreate both its movement and structure with media queries, flexboxes, advanced Sass, and other CSS concepts covered thus far.
Lesson 34 of 36
Last updated more than 3 months ago.