To give my website a unique user experience I will be incorporating JavaScript with the idea of having the landing page look like in the example I have created below in Photoshop. I will use the jQuery library Ripples in order to make my homepage interactive with a water ripple effect in the background with a plastic bottle floating on top. As the user scrolls down the life cycle of the water bottle begins. http://sirxemic.github.io/jquery.ripples/
I have now finalised the project and create a website which displays the life cycle analysis of a plastic water bottle and then presents the user with a map containing locations of reverse vending machines, and also gives them the option to add their own reverse vending machine location and then share this link.
In order to make sure my parallax website flows correctly I have taken it upon myself to sketch out the layout and order that each page will be displayed in, you can see this below. This will help me visualise better where certain things will be positioned and how transitions will work. At the end of the site it will either have the option to locate further recycling locations dependant upon your location, or a map containing open data visualising the issue of plastic pollution from OpenLitterMap, a scheme which involves blockchain technology to reward users with Littercoin and give them an incentive to recycle and post photos building a library of open data.
Comments
Post a Comment