DaBomb Bath Fizzers

This was an educational project where we had to choose a website/company that already existed and recreate them a new website with a new, fresh, clean design. Below are a few snapshots of my design, everything was coded with HTML5, CSS, and a little JS.

 
Screen Shot 2018-05-31 at 11.24.56 PM.png

Landing Page

This is the home/landing page, logo in the menu bar on the left and main navigation on the right. If you scroll the header starts to float over the images with an opaque background. 

Screen Shot 2018-05-31 at 11.27.14 PM.png

Feature Page - Bath Bombs

This is the first page you come to when clicking on "BATH BOMBS", there are additional pages to see jars of Bath Bombs and what the company calls Whoops Bombs. The header is uniform throughout the website with the opaque background as you scroll. 

Screen Shot 2018-05-31 at 11.27.29 PM.png

Feature - Pop Out Modal Box

This was designed with the thought it would potentially be a shopping page where customers would want to read the text on the product. I used JS to create this modal box to make the individual image larger and then you click on the blue "x" to go back to the main page. 

 
Screen Shot 2018-05-31 at 11.29.34 PM.png
 
Screen Shot 2018-05-31 at 11.29.52 PM.png
 
Screen Shot 2018-05-31 at 11.31.17 PM.png