Slice, code, and upload as a live site the following (html example provided): Widget Box
- Your example should be an accurate reflection of the .jpg comp provided.
- You MUST use the provided sprites for the nav elements on the page.
Due by Thursday, June 10.
Please read chapter 1 in your Flash CS4 book, complete all the practice exercises, and share them with me (preferably zipped/archived) via Dropbox @ andre@ampmusic.com.
You can bring them in on a thumb drive if you have any problems getting them to me electronically.
As we transition from CSS/html to a focus on Flash, a summary of what we’ve covered and have yet to cover seems appropriate. We’ve come a long way, baby!
Topics discussed:
Topics left to discuss:
Flash
Other
May 25
http://www.smashingmagazine.com/2010/05/25/bizarre-websites-on-which-you-can-kill-time-with-style/
Some amazing flash animation websites for inspiration.
Google font API and the google font directory is a project aimed at offering more choices in web fonts, the legal way!
Benefits of the Google Font API include:
* A choice of high quality open source fonts.
* Works in most browsers.
* Extremely easy to use.
The line of fancy script text above was created with this code:
<link rel=”stylesheet” type=”text/css” href=”http://fonts.googleapis.com/css?family=Tangerine”>
<style>
.fancy{
font-family: ‘Tangerine’, serif;
font-size: 48px;
}
</style>
Please go through (meaning type in the actual code!) tutorials 1-3 on this site:
Floatutorial
A more thorough float exercise project will be assigned in the near future, so brush up!
Here’s a great design and markup exercise for those of you looking to further expand your skills:
Create a sleek, high-end web design from scratch
Extra credit will be awarded to those who complete this tutorial FROM SCRATCH; you may not use the source files from the exercise as your own.
Additional interface design exercises:
Web 2.0 tab design
Semi-transparent menu design
Simple, sleek footer design
May 19
Sites we looked at:
Good resource for Beginners: