Case Study
Single Page Animated Website
About
This project was developed in the final semester of Interactive Media Design at Durham College. The task was to take photos and videos of three recipes given in class and design a single page website where the user can view these recipes. If you love to cook and bake, I recommend these recipes.
Tools Used
Adobe Photoshop, Illustrator, After Effects, Premiere, HTML, CSS, and JavaScript
Development
The project began with getting the ingredients and preparing the recipes. Each ingredient was set in different bowls. The camera was set up on the tripod facing down over the counter, recording my classmate mixing the ingredients in the right order. Using Adobe Premiere all raw footage was edited and compiled into a tasty video. Using Adobe After Effects, text and transitions was implemented into the edited videos. The logo was designed using Adobe Illustrator. The single page animated webpage was coded using HTML, CSS, and JavaScript. Each recipe is in its own section with the tasty video in the bottom right corner. Click on the button below to view the website.
NOTE: It's best to view the videos in full screen to get the better experience.
