ADS 560 Topics in Design
Flash and Dreamweaver

 

  intro :: syllabus :: week one :: week two :: week three :: final ::

:::::::::::::::::::::::::::::::::::::::::::::::::
email:
andrea wertzberger

:::::::::::::::::::::::::::::::::::::::::::::::::
:- Indexed Blog: great simple drawings
:- Good.is Infographics
:- Village of 100 people

:- Future Food
:- Feltron
:- Designer Daily

Flash as part of the site
:- 344: Stefen Bucher
:- Tomorrow
:- Range
:- Build Forest...
:- House Industries
:- Medium Bold

:- GE Grid
:- Wonder-wall
:- Also-online
:- The Adventure Schoo
:- Don't Click It
:- Hello Monday

Various Animations using Flash
:- Little red riding hood
:- Bembo's Zoo
:- Seven Wonders
:- Lemon Powered Clock
:- Bird Watching

::::::::::::::::::::::::::::::::::::::::::::::::::
:: class websites
:- Alex
:- Allie
:- Alyssa
:- Andres
:- Bradley
:- Christi
:- Crosby
:- Dela
:- John
:- Jon
:- Kira
:- Nancy
:- Mars
:- Matthew
:- Mo
:- Sam
:- Shannon

 

 

 

::::



 

 


 


 


::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
week two
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
IF YOU DOWNLOAD a free trial of Flash CS 5.5 you MUST save as CS 5. When you go to save as under FORMAT you can use the pull down to change from CS 5.5 to 5.0.

A FLASH CS 5.5 file will not open at school.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
tuesday

finish up e-card. working on problems, things not working, questions...

post on a new page in Dreamweaver. Background color or image.

cargo collective: everyone have an invite?

need you to gather and have with you for next classes
at least 4 digital images (can be projects, sketches, or family/friends)

short video or movie

Final project in Flash will be Teach Someone to do Something. A step by step, how to, can be about your major, can be somethign from Dangerous/ Darling Book. Examples. More Examples.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
wednesday
keep background images fixed.

body {
background-image:url(images/nature-blue_sky_1920.jpg);
background-repeat:no-repeat;
background-attachment:fixed;
}

cargo collective vs behance.net, served sites
both are great places to make a digital portfolio. You will want to showcase your work not have it clouded by an weak web design.

http://cargocollective.com/kuvisualcommunication
jordan jacobson
c
hris klee
jaclynco.com
kylevanloo.com

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

// to add an external link (link to another website)//
<a href=http://www.nameofwebsite target="_blank">website</a>

// to make a pdf download (resume, graphic...)//
<a href="http://people.ku.edu/~yourusername/images/yourfilename.pdf" target="_blank">Click here to download it as a pdf.</a>

// to embed a flash movie .swf file//
<embed height="400" align="middle" width="550" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" allowscriptaccess="sameDomain" name="myFlash" scale="noborder" quality="high" wmode="opaque" menu="false" src="http://http://people.ku.edu/~yourusername/images/yourfilename.swf"/>

*change height and width to match your .swf file

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
thursday
recovering from pull down menus.

- - - - - - - -
Bone tool.
IK animations

pieces must be movie clips

start where the anchor should be

- - - - - - - -
Slide Show

About images: Gif, Jpeg, PNG

How to make a slide show.
Open New: make the stage to the size/proportion you want your animation to be. Set frames per second to 12fps (12 frames per second so if you want an image to stay on 10 sec you need 120 frames of animation)

Grid, Rulers, pull to add guides
To make things easy have all your images in one folder.
Import to Stage
Modify > Timeline > Distribute to layers.

How to make a motion preset. Make your slide show stop and play by using go to and play frame label...

Make simple animationof one of your images: slide? fade? scale?
set a custom motion preset
apply

make 2 buttons (btn_play and btn_pause)

put each on its own layer

now we have to code the buttons
something fancy
click on your play button

So select buttons_mc on the Stage, open the Code Snippets panel, and inside of the Actions area double
click Click to Hide an Object.

btn_play.addEventListener(MouseEvent.CLICK, fl_ClickToHide);

function fl_ClickToHide(event:MouseEvent):void
{
btn_play.visible = false;
}

----------

btn_play.addEventListener(MouseEvent.ROLL_OUT, fl_ClickToHide);

function fl_ClickToHide(event:MouseEvent):void
{
btn_play.alpha = 0;
}

Actions Click to hide an object
change

btn_play.addEventListener(MouseEvent.ROLL_OVER, fl_ClickToHide_2);

function fl_ClickToHide_2(event:MouseEvent):void
{
btn_play.alpha = 1;
}

- - - - - - - -
Select your play button in the timeline

Event Handles
click on

Mouse Click Event

/* Mouse Click Event
Clicking on the specified symbol instance executes a function in which you can add your own custom code.

Instructions:
1. Add your custom code on a new line after the line that says "// Start your custom code" below.
The code will execute when the symbol instance is clicked.
*/

btn_play.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler_2);

function fl_MouseClickHandler_2(event:MouseEvent):void
{
// Start your custom code
// This example code displays the words "Mouse clicked" in the Output panel.
trace("Mouse clicked");
// End your custom code
}

change trace("Mouse clicked") to play()

- - - - - - - -
Select your pause button in the timeline

Event Handles
click on

Mouse Click Event

change trace("Mouse clicked") to stop()

- - - - - - - -
* adjusting photos so they are as small in file size as they can be but still look good. you should do each photo individually. double click on the image in libary. click on custom settings change number, test, repeat until you find something that looks good.

**if you want music import it to the libary or stage, place audio on its own layer. You can import .wav, mp3, aiff (you can use audacity or garage band to convert) default settings for sound are low quaility which is fine for sound effects but if you have music that you want to sound a bit better you need to switch settings. Go to Publish Settings. Change to about 80kbps for a song (this will make your file size larger).

- - - - - - - -
HOMEWORK
we will be doing th final project in flash. For Tuesday have your idea. What can you teach someone to do? And how will it look? Over the weekend make a visual reference frame (make one frame) and a storyboard. How will someone click through. How will you make it. Frame labels? What shoudl be a new scene? Find images or start making assets. We will work on in in class througout the week while learning some Dreamweaver.

A step by step, how to, can be about your major, can be something from Dangerous/ Darling Book. These are some examples by graphic students they look good but you know more about flash then they did, just expecting you to do the best you can. Better than you think you can.

Examples.( the websites don't work because the student have graduated)

More Examples.