Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Summary: This project is still under construction! Please forgive spelling errors, broken links and other formatting problems.

Run and Jump Game: A Web Design Project using Flash, Photoshop and Dreamweaver

    ●   Create Run and Jump game using Flash, create a background for it in Photoshop, and upload the whole thing in Dreamweaver.

The Project Happens in Stages:

Stage #1: Create a Player ~

Learn the basics of frame by frame animation.


Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Create your character and make it walk by doing this tutorial:

http://digitalartanddesign.org/81_player_Fl.htm


    ●   Your character can be almost anything you want.

    ●   Just make it small enough to fit on the screen.


Stage #2: Build an index page ~

Make a New Folder inside your Root Folder


Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Create your character and make it walk by doing this tutorial:

http://digitalartanddesign.org/create_new_folder_index_dw.htm


    ●   Create a New Index Page for your new project and keep it in that new folder.



Last Part: The Final Product ~

All

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

  •  

  •  


Other People's Work:

These are examples created by students following this project.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

run-and-jump-game-example1.fla

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

run-and-jump-example2.fla

Run and Jump Game - Day 1

New Project Begins Today  ~ 

Introduce this PBL project by reading the Entry Document with the Class -

Reflection Journal - Attach the previous project to your portfolio (if necessary) and defend your learning by reflecting upon what you have learned from the project.

Tutorial #1 - Animated Player in Fl - Not Due Today - But Get Started Now.

Assignment #1 - Create a New Folder and an index Page at the Root Level of your sites In DwNOTHING TO ATTACH - Just Do it!


Run and Jump Game - Day 2

"Run and Jump Game - Day 2"  ~  

Journal - Create a New Entry in Your Portfolio - Begin class with this warm-up writing prompt.

Tutorial #1 - Finish Player in Fl - Attach by Due Date.

Tutorial #2 - styles.css - Attach your CSS file by the End of Class.

Tutorial #3 - Game Background in Ps - Attach by Due Date.

Finish Assignment #1 - Create a New Folder and an index Page at the Root Level of your sites In DwNOTHING TO ATTACH - Just Do it!

Workshop - Edit Multiple Frames - Your Run and Jump Character may need to be shrunken down!


Run and Jump Game - Day 3

"Run and Jump Game - Day 3"  ~  

Journal - Name Your Game - Begin class with this warm-up writing prompt.

Tutorial #1 - Game Background in Fl - Attach by Due Date.

Tutorial #2 - Brushes Background in Ps - Attach by Due Date.

Tutorial #3 HTML Tag - Attach by Due Date.

Workshop - Editing Multiple Frames.


Run and Jump Game - Day 4

"Run and Jump Game - Day 4"  ~  

Journals - Your Character's Backstory - Begin class with this warm-up writing prompt …

Tutorial #1 - Platform in Fl - Attach by Due Date.

Tutorial #2 - Container - Attach by Due Date.

Workshop - ?


Run and Jump Game - Day 5

"Run and Jump Game - Day 5"  ~  

Journal - What's your Back Story? Begin class with this warm-up writing prompt.

Tutorial #1 - Header - Attach by Due Date.

Tutorial #2 - Game Visuals in Fl - Attach by Due Date.

Workshop - ?


Run and Jump Game - Day 6

"Run and Jump Game - Week 2"

Journal - What makes a good platform game? Begin class with this warm-up writing prompt.

Tutorial #1 - Nav Div Tutorial -Attach by Due Date.

Workshop - Attach your Game to your index page.


Run and Jump Game - Day 7

digitalartanddesign.org

"Run and Jump Game - Day 7"

Journal - ? … Begin class with this warm-up writing prompt..

Tutorial #1 - Content Div Tutorial -Attach by Due Date.

Tutorial #2 - Grass Background in Ps - Attach by Due Date.

Workshop - ?


Run and Jump Game - Day 8

digitalartanddesign.org

"Run and Jump Game - Day 8"

Journal - ? - Begin class with this warm-up writing prompt.

Tutorial #1 - Parallax Background in Fl - Attach by Due Date.

Tutorial #2 - Untitled Documents - Nothing to attach - Just Do it because the Rubric says …

Workshop - Insert your Game into your Content Area.


Run and Jump Game - Day 9

digitalartanddesign.org

"Run and Jump Game - Day 9"

Journal - Name 2 Things you would fix to make this website Better! Begin class with this warm-up writing prompt.

Tutorial #1 - Tree in Fl - Attach by Due Date.

Tutorial #2 - Semi-Transparent Backgrounds for your div - Attach by Due Date.

Tutorial #3 - Untitled Documents - Nothing to attach - Just Do it because the Rubric says…

Workshop - Insert your Game into your Content Area


Run and Jump Game - Day 10

digitalartanddesign.org

"Run and Jump Game - Day 10"

Journal - Why Learn Code - Begin class with this warm-up writing prompt.

Tutorial #1 - Text Size - Attach by Due Date.

Tutorial #2 - Google Fonts - Attach by Due Date.

Workshop - Insert your Game into your Content Area.



Run and Jump Game - Day 11

Digital Art and Design

"Run and Jump Game - Day 11"  ~  

Journal - Review this example and Comment - Begin class with this warm-up writing prompt.

Tutorial #1 - Scenes and Stop Commands - Attach by Due Date.

Tutorial #2 - Flower Power - Attach by Due Date.

Workshop  - 4 Things Every Flash User Should Know! What things do Flash and Photoshop have in Common? Answer = Lots!

OR

  •   workshop - Blur Backgrouds - What does it do for your foreground images?


Run and Jump Game - Day 12

Digital Art and Design

"Run and Jump Game - Day 12"  ~  

Journal - Photoshop-Illustrator-Flash - Begin class with this warm-up writing prompt.

Tutorial #1 - Borders in Fl - Attach by Due Date.

Tutorial #2 - Rounded Boxes in Fl - Attach by Due Date.

Tutorial #3 - div Borders in Dw - Attach by Due Date.

Workshop  - 4 Things Every Flash User Should Know! What things do Flash and Photoshop have in Common? Answer = Lots!

OR

Workshop - Rubric Requirements - What does the Rubric say? How would you grade this example?


Run and Jump Game - Day 13

Digital Art and Design

"Run and Jump Game - Day 13"  ~  

Journal - The Hardest Part - Begin class with this warm-up writing prompt.

Tutorial #1 - Key and Door in Fl - Attach by Due Date.

Tutorial #2 - Borders in Fl - Attach by Due Date.

Tutorial #3 - Rounded Boxes in Fl - Attach by Due Date. - Attach by Due Date.

Workshop - ?


Run and Jump Game - Day 14

Digital Art and Design

"Run and Jump Game - Day 14"  ~  

Journal - ? - Begin class with this warm-up writing prompt.

Tutorial #1 - Rotating Shadow in Fl - Attach by Due Date.

Tutorial #2 - Borders in Fl - Attach by Due Date.

Tutorial #3 - Rounded Boxes in Fl - Attach by Due Date. - Attach by Due Date.

Workshop - ?


Run and Jump Game - Day 15

Digital Art and Design

"Run and Jump Game - Day 15"  ~  

Journal - ? - Begin class with this warm-up writing prompt.

Tutorial #1 - Rotating Shadow in Fl - Attach by Due Date.

Tutorial #2 - Borders in Fl - Attach by Due Date.

Tutorial #3 - Rounded Boxes in Fl - Attach by Due Date. - Attach by Due Date.

Workshop - ?


Other Resources: https://as3gametuts.com/2011/11/11/platformer-1/