Project Goal: Create a Gif animation that demonstrates, (1) tweening, (2) variations in speed and direction, (3) use of animated graphic or photographic imagery, (4) use of animated text, (4) color cycling, & (5) size transformation. Gif Animation will be used to supplement the current masthead that is being used within your web site template.
For this assignment, you will be challenged to create a graphic representation of a web template using Adobe Photoshop and reconstructed using CSS and HTML coding language.
Step One: Research a pre-existing web site based on your own personal interests.
Step Two: Using a sheet of paper, create a Wire Frame that indicated how the layout of your web template will be broken up. At minimum there should be an allocation for (1) mast head, (2) nav bar, (3) content area, (4) footer. * Be sure to indicate with pixels the width and height of each section created within template.
Step Three: Using Adobe Photoshop create a new document @ "1200px" x "900px". Resolution should be set to 72dpi.
Step Four: Based on the wire frame layout and dimensions, use Photoshop to create an original graphic representation of a web template.
Step Five: Individually crop each section of the web template and save into the asset folder located within your sites Root folder. Save each file as a ".jpg".
Step Six: Using your knowledge of HTML and CSS, reconstruct individual sections of web template into a single viewable document.