Hyperstudio:Hyperstudio:A Beginner’s A Beginner’s

TutorialTutorial

ByByJudy SwaimJudy Swaim

HyperstudioHyperstudio to make a stack.to make a stack. to make cards.to make cards. to make borders.to make borders. to add pictures.to add pictures. to add text.to add text. to add buttons.to add buttons. to add sound.to add sound. to add animation.to add animation.

LearnLearn

Useful TipsUseful Tips Tools in this tutorial is Tools in this tutorial is

referring to this menu.referring to this menu. Clicking on the Clicking on the hand on tools puts hand on tools puts your presentation your presentation in a Play mode.in a Play mode.

Clicking on the Clicking on the arrow on tools puts arrow on tools puts your presentation your presentation in an Edit mode.in an Edit mode.

Useful TipsUseful Tips A Stack is a group of cards, in other A Stack is a group of cards, in other

words, it is the program you are words, it is the program you are creating.creating.

A Card is the individual screen you A Card is the individual screen you are creating.are creating.

Buttons are objects that allow you Buttons are objects that allow you to move from one card to another, to move from one card to another, add sounds, add animation, etc.add sounds, add animation, etc.

PreviewPreview In this tutorial, you will create a short math In this tutorial, you will create a short math

program. program. The first card is a multiple choice question. The first card is a multiple choice question. By clicking on the correct answer, you move to By clicking on the correct answer, you move to

Card 5 that says great and plays an animation.Card 5 that says great and plays an animation. By clicking on an incorrect answer, you move By clicking on an incorrect answer, you move

to Cards 2, 3, & 4 which show the correct way to Cards 2, 3, & 4 which show the correct way to work the problem. Then it moves back to to work the problem. Then it moves back to Card 1 to give you a chance to answer Card 1 to give you a chance to answer correctly.correctly.

Making a Stack.Making a Stack. Open Hyperstudio Open Hyperstudio

by clicking on by clicking on progams and progams and clicking on clicking on Hyperstudio.Hyperstudio.

Click New Stack.Click New Stack. Click File.Click File. Click Save StackClick Save Stack Type add.Type add.

Making a StackMaking a Stack

Click and Click and drag tools to drag tools to the left.the left.

Click and Click and drag colors drag colors to the right.to the right.

Notice your stack is now named Notice your stack is now named ADD.STK and you are on Card 1ADD.STK and you are on Card 1

Add a BackgroundAdd a Background Click on File.Click on File. Click on Import Click on Import

Background.Background. Click on Disk File.Click on Disk File. Click OK.Click OK. Click on Music.Click on Music.

Add a BackgroundAdd a Background On tools, click on On tools, click on

dotted rectangle.dotted rectangle. Click and drag so Click and drag so

the rectangle the rectangle encloses all encloses all musical symbols, musical symbols, but not the but not the border.border.

Hit the delete Hit the delete key on the key on the keyboard.keyboard.

Add a BackgroundAdd a Background On color menu, On color menu,

select pale select pale yellow.yellow.

On tools, select On tools, select the fill tool (the the fill tool (the paint bucket) .paint bucket) .

Click on the Click on the screen to turn screen to turn it pale yellow.it pale yellow.

Add New CardsAdd New Cards On tools, click On tools, click

arrow.arrow. Click Ready Click Ready

made cards - made cards - Same Same Background.Background.

Repeat until Repeat until you have cards you have cards 2, 3, 4, & 5.2, 3, 4, & 5.

Move to Another CardMove to Another Card Move back to Card 1 by clicking Move, then click First Move back to Card 1 by clicking Move, then click First

Card.Card. Or move back to Card 1 by pressing the Ctrl key on the Or move back to Card 1 by pressing the Ctrl key on the

keyboard. While holding the Ctrl key, also press the < key keyboard. While holding the Ctrl key, also press the < key until you get to Card 1.until you get to Card 1.

Add a PictureAdd a Picture Click FileClick File Click Add Clipart, Click Add Clipart,

Disk File, OK.Disk File, OK. Click Addy.Click Addy. Click lasso button.Click lasso button. Draw a circle Draw a circle

around the first around the first dog.dog.

Click OKClick OK

Moving a PictureMoving a Picture Move cursor Move cursor

over the dog over the dog until the cursor until the cursor becomes a becomes a cross arrow.cross arrow.

Click and drag Click and drag the dog to the the dog to the left corner. left corner.

Moving a PictureMoving a Picture On tools, click the On tools, click the

dotted rectangle.dotted rectangle. Click Edit- Copy.Click Edit- Copy. Click Edit-Paste.Click Edit-Paste. Click and drag the Click and drag the

dog.dog. Click Edit-Paste Click Edit-Paste

again. Drag the again. Drag the dog.dog.

You now have 3 You now have 3 dogs.dogs.

Add TextAdd Text On tools, double click on the T.On tools, double click on the T. Choose Times New Roman, Choose Times New Roman,

Bold, 28, Red.Bold, 28, Red. Move cursor under first dog Move cursor under first dog

and click.and click. Type 1+2 =__.Type 1+2 =__. Mover cursor under numbers Mover cursor under numbers

and click.and click. Double click on T. Change color Double click on T. Change color

to Green and size to 26.to Green and size to 26. Type Click the correct answer.Type Click the correct answer. Change to Red and type 2, 3, Change to Red and type 2, 3,

4.4.

Click on the dotted Click on the dotted rectangle.rectangle.

Select the dogs.Select the dogs. Click Edit- Copy.Click Edit- Copy. Click Move- Next Card.Click Move- Next Card. You are now on Card You are now on Card

2.2. Click Edit- Paste.Click Edit- Paste. Click T.Click T. Type 1 under first Type 1 under first

dog.dog.

Pasting to Another CardPasting to Another Card

Pasting to Another CardPasting to Another Card Copy and paste dogs Copy and paste dogs

and 1 from Card 2 to and 1 from Card 2 to Card 3.Card 3.

Type 2 under the Type 2 under the second dog.second dog.

Copy and past dogs Copy and past dogs and numbers from and numbers from Card 2 to Card 3.Card 2 to Card 3.

Type 3 under the third Type 3 under the third dog.dog.

Type Try Again.Type Try Again.

Pasting to Another CardPasting to Another Card Copy and paste dogs from Card 4 to Card 5.Copy and paste dogs from Card 4 to Card 5. Type 1 + 2 = 3Type 1 + 2 = 3 Type Great Job !!!!Type Great Job !!!!

Adding Card 6Adding Card 6 To add Card 6 To add Card 6

with a plain white with a plain white background, click background, click Edit- New Card.Edit- New Card.

Click Move- Click Move- Previous Card to Previous Card to go back to Card go back to Card 5.5.

Adding a ButtonAdding a Button Click Objects.Click Objects. Click Add a Button.Click Add a Button. Click top, left button.Click top, left button. Click Show Icon.Click Show Icon. Choose hand pointing to the Choose hand pointing to the

right.right. Under Name, click red.Under Name, click red. Under Background, click Under Background, click

green.green. Position your cursor in the Position your cursor in the

rectangle beside Name.rectangle beside Name. Click and type Next.Click and type Next. Click OKClick OK

Adding a ButtonAdding a Button Click and drag the Next Click and drag the Next

button to the bottom, right button to the bottom, right corner. corner.

Click outside the button or Click outside the button or double click inside the double click inside the button and a menu will button and a menu will appear. appear.

Click the circle beside Next Click the circle beside Next Card and another menu Card and another menu will appear where you can will appear where you can choose the type of choose the type of transition effects you transition effects you prefer.prefer.

Click Iris close, Medium, & Click Iris close, Medium, & OK.OK.

Adding Sound with the Adding Sound with the ButtonButton

Click Play a sound.Click Play a sound. On the menu that pops On the menu that pops

up, click BOING.WAV.up, click BOING.WAV. Click OK on Tape deck Click OK on Tape deck

menu.menu. Click Done on Actions Click Done on Actions

menu.menu. To try your new button, To try your new button,

click on the hand on click on the hand on tools, then click on the tools, then click on the button you made.button you made.

Adding Animation with an Adding Animation with an Invisible Button.Invisible Button.

Click Objects - Add a Click Objects - Add a button.button.

Click the dotted rectangle Click the dotted rectangle to make the button to make the button invisible.invisible.

Click OK.Click OK. Click outside the button.Click outside the button. Click Animation, Disk Click Animation, Disk

Library, addyrun, & OK.Library, addyrun, & OK. Click and drag dog across Click and drag dog across

screen.screen. Click any key on the Click any key on the

keyboard when finished.keyboard when finished.

Adding Animation with an Adding Animation with an Invisible Button.Invisible Button. Under Frame options, Under Frame options,

check Show first frame.check Show first frame. Uncheck Erase when Uncheck Erase when

done.done. Click OK.Click OK. Click Automatic timer.Click Automatic timer. Click Activate button as Click Activate button as

soon as card is shown.soon as card is shown. Click OKClick OK Click Done an Action Click Done an Action

menu.menu.

Adding an Invisible Button Adding an Invisible Button for Incorrect Answer.for Incorrect Answer.

Click Move - First card.Click Move - First card. Click Object - Add a button.Click Object - Add a button. Position the dotted Position the dotted

rectangle around the 2.rectangle around the 2. Click outside the rectangle.Click outside the rectangle. Click Next card, Click Next card,

Transistion-Fastest, Speed-Transistion-Fastest, Speed-Fast, OK.Fast, OK.

Click Sound - Click.Click Sound - Click. Click OK and Done.Click OK and Done.

Copying a Button.Copying a Button. On tools, click on the On tools, click on the

arrow.arrow. Click inside the button Click inside the button

around the 2 until the around the 2 until the rectangle is flashing.rectangle is flashing.

Click Edit - Copy buttonClick Edit - Copy button Click Edit - Paste button.Click Edit - Paste button. Place your cursor over Place your cursor over

the flashing button.the flashing button. Click and drag it over Click and drag it over

the 4.the 4.

Making a Button for the Making a Button for the Correct AnswerCorrect Answer

Click Object - Add a Click Object - Add a button, OK.button, OK.

Click outside the Click outside the button.button.

Check Another card.Check Another card. Click on the right arrow Click on the right arrow

until you get to Card 5, until you get to Card 5, Click OK.Click OK.

Click Play a sound.Click Play a sound. Click Beam down, OK, Click Beam down, OK,

and Done.and Done.

More ButtonsMore Buttons Click Move - Next Click Move - Next

card (Card 2) .card (Card 2) . Add a button.Add a button. Choose Next card - Choose Next card -

Fastest.Fastest. Click Automatic Timer Click Automatic Timer

- After 2 sec.- After 2 sec. Copy this button.Copy this button. Move to Card 3.Move to Card 3. Paste button.Paste button.

More ButtonsMore Buttons Click Move - Next card Click Move - Next card

(Card 4) .(Card 4) . Click Object - Add a Click Object - Add a

button.button. Click outside the button.Click outside the button. Click Another card.Click Another card. Click left arrow until you Click left arrow until you

see Card 1. Click OK.see Card 1. Click OK. Click Automatic timer - Click Automatic timer -

3 sec. 3 sec. Click OK and Done.Click OK and Done.

Trying Your Program.Trying Your Program. Move to Card 1.Move to Card 1. On tools, click the On tools, click the

hand.hand. Click on an Click on an

incorrect answer incorrect answer and on a correct and on a correct answer.answer.

Watch the effects.Watch the effects.

Experiment and Experiment and have fun with have fun with HyperStudio.HyperStudio.

The EndThe End