Summer 2010 Governors School 
INTERACTIVE DIGITAL COMMUNICATION

Assignments

Description

2) Create a "freewebs" account (Or an equivalent free hosting account).  

Optional FREE hosting:

Lime Domains

Setting up Freewebs account: 

Simulation: Step 1

Simulation: Step 2

Setting up Lime Domains account: 
 

Simulation: Lime Domains Tutorial 

1) A picture of something important to you (a pet, place, landmark, building, vehicle, etc). The picture must be your property 
and should not be a person (including yourself). 

2) Create a title for your page (using the title tag)
3) A link to your favorite website.
4) A short description of why you are taking the class and what you hope to learn. 
5) Save as bio.html and upload to your hosting account/space.  

W3C website

Bandwidth Calculators 

File Size Calculator

Simulation: Tutorial 1

Simulation:  Tutorial 2

Simulation:  Tutorial 3

Simulation:  Tutorial 4

1) Create a basic web page and name it "index.html"
2) Add an image
3) Create an external hyperlink to another site
4) Create an e-mail hyperlink
5) Upload to your hosting site (ex, freewebs)

*Practice Images

Computers as social actors (CASA Computers as Social Actors paradigm)

           Cleverbot.com

        Avatars on Cleverbot

 Human like robot in Japan

Human like robot in England

Facial expressions with robots

Using Adobe Dreamweaver CS4 to create a spry dropdown menu.. 
1) Connect to your Google Sites account.
2) Create a page and call it dropmenu.html.
3) Save and create a link on your mywork.html website that connects to the dropmenu.html page.

Simulation: Creating menu bar using Spry technology

Simulation: Creating menu bar using Spry technology Part 2

Part 1: Creating a banner (using Adobe Photoshop)

1) Creating Static Banners Using Adobe Photoshop

2) Create 5 static banners - goal is to communicate a message via static graphics display (example: a product, theme, cause, etc). Each banner should consists of at least four layers or more.

3) Create a page in Dreamweaver and name it "banners.html" and create a link on the "mywork.html" page and call it "Banners."

4) Save each banner as a .jpg file and name each accordingly (example banner1.jpg, banner2.jpg, etc.).

5) Upload the "banners.html" page, "mywork.html," and the 5 static banners that you created. 

FREE Copyright Free Images

http://freestockphotos.com/

http://www.freedigitalphotos.net/

http://www.free-stockphotos.com/

http://www.public-domain-photos.com/

Informational Links:

Making money with banner ads (e-commerce), what are banners and how they works.

Digital Story Telling examples using still images: 

*American Photography: A century of Images (PBS Website)

Seven elements of digital story telling example (Video)

Vincent van Gogh Gallery (Website-still images)

Vincent van Gogh : Starry Night (Video)

*Practice Images

Simulations: Rectangular Marquee tool.

Simulations: Eliptical Marquee tool.

Simulations: Selecting a Color Range. 

Simulations: Magnetic Lasso tool.

Simulations: Magic Wand tool. 

Simulations: Moving selections between images

Working with Adobe Flash

Part 1: Intro to Adobe Flash

1) Create a Photo Essay - Using Adobe Photoshop and Adobe Flash (via keyframes) create a photo essay slide show about any topic: natural disasters (ex: mountain top removal, oil spill), animal extinction, nature, sporting events (ex: World Cup), people, places, etc). Save the project (from Flash) as "photoessay.fla."

2) Publish (save/export) the slide show as "photoessay.html" to your web folder for upload to Freewebs.com.

3) Link the "mywork.html" to the "photoessay.html" and upload all associated files to Freewebs account (it is crucial to upload the "photoessay.swf"as well).

Part 2:

Create an Intro page for "mywork.html"name the page "index.html"

Photo Essays (Time Magazine/CNN)

Photo Essays (http://www.jansochor.com/)

Photo Essay (UNICEF)

Photo Essay (U.S. Department of Defense)

Photo Essay (All Africa)

Photo Essay (Magnum Photos)

Creating Animated Banners Using Adobe Photoshop

1) Create 5 animated banner examples

Simulation: Importing the partially created static JPG banner

Simulation: Adding a text layer and adding a motion tween effect. 

Simulation: Making animated banner a link.

DOWNLOAD: Gas can image

Animated Banner example 

Digital Story Telling: seven tips (Website)

Seven elements of digital story telling example (Video)

Digital Story Telling - what its all about (Video)

Working with video clips