ART 346 Z: Interactive Design

For Tuesday, Oct. 3

Wednesday, September 27, 2006

For Homework:

Read - Chapter 11, pgs. 185-196, from Learning Web Design

Assignment #3 - Create a mock up of your ebay page using whatever desktop publishing software you prefer (i.e. quark, indesign). Focus primarily on the layout -- how will you arrange your content and photos? You may use dummy photos and text for placement. I will collect a print out of your design at the beginning of class on Tuesday.

Christie   /   0 comments

For Thursday, Sept 28

Monday, September 25, 2006

For Homework:

Blog - Describe the item you are going to "sell" for your eBay assignment.

Read - Read "Typography" from the Web Style Guide

Note: Please bring Dreamweaver book to class on Thursday.

Christie   /   0 comments

For Tuesday, Sept 26

Wednesday, September 20, 2006

For Homework:

Assignment #2 - Complete and post on the web.

Blog - Write a self-evaluation for your second assignment. Which ad do you think is more succesful? What parts of each design are you satisfied with? What, if anything, do you think you could have done better? Be sure to include the links to each banner ad.

Christie   /   0 comments

Swap Fun

Tuesday, September 19, 2006

Ok last one I promise ... recreate this swap image.

Christie   /   0 comments

For Thursday, Sept 21

Monday, September 18, 2006

For Homework:

Blog - Browse the web and find:

1) a site that successfully uses a rollover, animation, or swap image
2) a site that unsuccessfully uses a rollover, animation, or swap image

Write at paragraph for each example. Explain why it is successful/ unsuccessful. Be sure to include the URL for each website.

Christie   /   0 comments

For Tuesday, Sept. 19

Tuesday, September 12, 2006

For Homework:

Assignment #2 - Storyboard your two banner ads using the handouts provided in class. Determine how each animation will work, by breaking it down frame-by-frame. Your sketches should be thorough -- include all the text and graphics you intend to use. Remember each animation should have a minimum of 3 frames.

Christie   /   0 comments

Good Site, Bad Site

1) Tod Gross

- BAD: Too much info on one page (too much scrolling)
- BAD: Takes to long to load
- BAD: Not creative enough - lose interest
- GOOD: Good photographs/images
- BAD: Hard to navigate, too much clutter
- BAD: No cohesive, content lost, nothing separated
- BAD: Too many links on one page

VERDICT: BAD

2) American Culinary

- BAD: Navigation bad, don't know what they mean
- GOOD: Good color palette, looks modern
- GOOD: does not clutter the page
- GOOD: Navigation icons are good, includes site map on bottom
- GOOD: Design is consistent, photo on left text on right
- GOOD: very well organized
- GOOD: design is pleasing to eye, easy to navigate, makes me hungry

VERDICT: GOOD

Christie   /   0 comments

Animation Fun

Monday, September 11, 2006

Examples to recreate during class today.

Christie   /   0 comments

For Tuesday, Sept 12

Thursday, September 07, 2006

For Homework:

Read - Chapter 17, from Learning Web Design

Assignment #1 - (Optional) Revise and incorporate suggestions made during critiques.

Blog - Post your ideas for your animated banner assignment -- what 2 companies will you use and what service/item are you selling. Include a draft of the content for each ad.

Christie   /   0 comments

Rollovers and Swap Images

Wednesday, September 06, 2006

Adding behaviors to a webpage is good way to give visual feedback to the navigational elements. For instance, a hotspot doesn't give much feedback to the user that there is something to click.

A rollover however can provide important cues as to how the site functions. A rollover functions by replacing one image with another when your cursor rolls over it.

A swap image behavior is used to create a disjointed rollover -- moving your cursor over the trigger area displays an image elsewhere on the page.

Difference between hotspots, rollovers and swaps

Some examples of swaps and rollovers:

PetSmart

Brian Williamsom

J. Crew


Examples to recreate in class:

Four Rollovers

Christie   /   0 comments

For Thursday, Sept 7

Tuesday, September 05, 2006

For Homework:

Assignment #1 - Complete and post on the web.

Blog - Write a self-evaluation for your first assignment. What parts of the design are you satisfied with? What, if anything, do you think you could have done better? Be sure to include the link to your webpage.

Christie   /   0 comments

Image Optimization Examples

JPEG or GIF?

JPEG Quality Setting

JPEG Progressive Setting

GIF Number of Colors Setting

GIF Palettes Setting

GIF Dither Setting

GIF Transparency Setting

Class Examples: Please copy the "optimize" folder on gambit (gambit/FA06/art346pm/class) to your hardrive drive.

Christie   /   0 comments