Windows 8 Windows Phone 8 Web Mobile … and WakeUpAndCode.com.

Slides:



Advertisements
Similar presentations
Go to your Event Sheet Click to Add Event Select “Monster” then Next!
Advertisements

Windows 8 Windows Phone 8 Web Mobile … and WakeUpAndCode.com.
Derived from Kirill Muzykov’s Rocket Mouse Tutorial WakeUpAndCode.com.
Copyright © 2012 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Starting Out with Alice: A Visual Introduction to Programming Third Edition.
© Anselm Spoerri Lecture 11 Flash –Build Flash Website with Animated Navigation Structure –Decide on Overall Navigation Layout, Import Images & Organize.
Windows 8 Windows Phone 8 Web Mobile … and WakeUpAndCode.com.
Create a Narrated Story with PowerPoint. Basics Enter Text. (Click in the text box and start typing. If a text box is not visible, go to Insert > Text.
Using Flash Animations In PowerPoint
Chapter 17 Putting It All Together. Viewing the Preloader To view the preloader, 1.CTRL-Enter to test the movie. 2.View > Simulate Download.
GameMaker.  A lot of Different Definitions  Easier to Say What is NOT a Game  Movie is Not a Game  No Active Participation  Final Outcome is Fixed.
Microsoft Visual Basic 2012 CHAPTER TWELVE (ENRICHMENT CHAPTER) Windows Store Apps.
Construct 2 Game Development Shahed Chowdhuri Sr. Technical Evangelist
Game Design Creating a game called PING Phase 3: Steps for building basic game.
BUILDING RICH MEDIA ELEMENTS. Design Decisions Based on Design Specification  Following the design specification will ensure that the application is.
Unit E. Image Measurements The size of an image can be measured 2 ways: Dimensions: the height and width, measured in pixels. File Size: measured in Kilobytes.
Introduction to TouchDevelop
Exercise : Animated Navigation Structure in Flash 1.Develop Answers to “What did you learn in ITI program?” “What do you have to offer?” “What are your.
CIS 205—Web Design & Development Flash Chapter 1 Getting Started with Adobe Flash CS3.
Tutorial 6 Working with Bitmaps and Gradients, and Publishing Flash Files.
Tutorial 5 Making a Document Interactive. XP Objectives Explore the different button states Add a button from the Button library Create a button Learn.
VIDEO GAME PROGRAMMING Video Game Programming Junior – DigiPutt INSTRUCTOR TEACHER’S ASSISTANT.
Tutorial 2 Drawing Text, Adding Shapes, and Creating Symbols.
1-1 OBJ Copyright 2003, Paradigm Publishing Inc. Dr. Joseph Otto Silvia Castaneda Christopher deCastro CSULA Macromedia Flash MX Introduction.
CIS 205—Web Design & Development Fireworks Chapter 1.
Learning Unity. Getting Unity
Working with Graphics – Lesson 21 Working with Graphics Lesson 2.
Right-click to Rename each sprite Name them: Player Monster Bullet Explosion.
Introduction to Flash Animation CS 318. Topics Introduction to Flash and animation The Flash development environment Creating Flash animations  Layers.
Game Maker Terminology
Shooters in GameMaker J Parker.
Chapter 9 Advanced Assembly Modeling Techniques. After completing this chapter, you will be able to perform the following: –Create sketch blocks –Create.
Game Maker Galactic Mail Advanced Group: Complete Galactic Mail, then start developing an independent project.
Game Maker Tutorial.
Derived from Kirill Muzykov’s Rocket Mouse Tutorial WakeUpAndCode.com.
Tutorial 3 Creating Animations. XP Objectives Learn the different elements of animation Create frames and layers Organize frames and layers using the.
Chapter2 Create animation. Objectives Import image Use the blank keyframe Add sound Publish the movie as an SWF file Use a motion tween animation.
Tutorial 7 Creating Animations. XP Objectives Learn about animation Create a timeline Add AP divs and graphics to a timeline Move and resize animation.
Chapter 9 Advanced Assembly Modeling Techniques. After completing this chapter, you will be able to perform the following: –Create sketch blocks –Create.
XP Tutorial 3 Creating Animations. XP New Perspectives on Macromedia Flash MX Elements of Animation Layers are used to organize the content of.
Construct 2 Game Development for Kids Platformer Tutorial: Part 1 Shahed Chowdhuri.
GAME:IT Junior Paddle Ball Objectives: Review skills from Introduction Create a background Add simple object control (up and down) Add how to create a.
XP New Perspectives on Macromedia Dreamweaver MX 2004 Tutorial 5 1 Adding Shared Site Elements.
Computer Programming with Scratch JAOIT 8. Scratch Scratch is a programming language that makes it easy to create your own interactive stories, animations,
Adobe Flash Professional CS5 – Illustrated Unit E: Optimizing and Publishing a Movie.
GAME:IT Mario Creating Platform Games Level 4 with GML Game Maker Language (GML) allows users more flexibility in game design. GML is similar to how real.
Adobe ® Photoshop ® CS6 Chapter 1 Editing a Photo.
Game Maker Tutorials Introduction Clickball IntroductionClickball Where is it? Shooting Where is it?Shooting.
Prof. Anselm SpoerriMultimedia Production Rutgers Lecture 11 Flash –Build Flash Website with Animated Navigation Structure –Decide on Overall.
XP New Perspectives on Microsoft Office FrontPage 2003 Tutorial 5 1 Microsoft Office FrontPage 2003 Tutorial 5 – Creating Tables and Frames.
Tutorial 3 Creating Animations.
OVERVIEW Objectives Follow a design document to prepare images for inclusion in a Web page Run a batch process to prepare multiple images in one step Use.
“ – Attribution (Difficult) Animated snow scene
Flash Interface, Commands and Functions
Game Development with Construct 2
Exercise 63 Use a Flash movie clip symbol to store an animation that you need to use more than once in an application. This is very important for keeping.
“Placeholder for a quote to be animated here.”
Fly-in marquee lights at picture entrance (Intermediate)
“Keep looking up…that’s the secret of life.”
… a white peppermint world as far as the eye could see…
DIRECTIONS: 1. Click Enable Editing in the yellow bar above.
DREAMWEAVER MX 2004 Chapter 7 Working with Layers
Animated picture collection: left picture moves to front center
ALASKA How did the U.S. acquire Alaska?
The work of moving ice Chapter 8 Animated snow scene (Difficult)
Intro to Construct 2 Game Development
Exercise : Animated Navigation Structure in Animate (= Flash)
So you want to be a Game Designer
TEXT FORMAT Textured and layered background with title - Advanced
Construct 2 Game Development: Flapping Bird
Exercise : Animated Navigation Structure in Flash
Presentation transcript:

Windows 8 Windows Phone 8 Web Mobile … and WakeUpAndCode.com

Prerequisites Ghost Shooter Tutorial Flapping Bird Tutorial Both available at: Construct 2 – Step by Step

Step 1: Save a New Project, “platformer.capx” Save! Enter File name

Step 2: Change Layout size Layout Size Width = 4000 Height = 2048

Step 3: Prepare Your Layers Bottom layer Rename it “Background” Remember to Lock it later! New layer Add new layer Rename it “Main”

Step 4: Add Background, update properties Update: Name Position Size

Step 5: Add New Sprite -> Tile Tips: Rename sprite object to “Tile” Check “Snap to Grid”. Ctrl-Click and Drag to create more.

Step 6: Add New Sprite -> Player Tips: Rename sprite object to “Player” Rename Default animation to “Idle” Set origin to bottom center point

Step 7: Add New Sprite -> PlayerBox Tips: Rename sprite object to “PlayerBox” Set origin to bottom center point

Step 8: Cover Player with PlayerBox Tips: Resize PlayerBox to match Player Position PlayerBox over Player

Step 9: Add Behaviors to PlayerBox Add the following behaviors: Platform ScrollTo

Step 10: Update PlayerBox Properties Update the following for Platform: Jump Strength = 750 Gravity = 2500 Also update: Initial visibility = Invisible

Step 11: Add Behaviors to Tile object Add the following behaviors: Solid

Step 12: Add Event for Player to follow Box Add Event Object: System Condition: Every tick Action: Object: Player Event: Set position to PlayerBox (image point 0)

Step 13: Add Keyboard Support Tips: Insert New Object  Keyboard Add 2 events for Left/Right

Step 14: Update Project Window Size Tip: Set Window Size: 800, 600

Step 15: Create More Tiles Tip: Ctrl-Click and Drag to create more tiles

Step 16: Add Run and Jump Animations Tips: Right-Click Animations window to Add each animation Import Sprite Strip as 4x4 for each Remove empty frames Clean up any stray pixels Rename to “Run” and “Jump”, respectively Set origin to bottom center point for all frames

Step 17: Add Events for Running and Stopping Add Events Object: PlayerBox Condition: (Platform) On moved Action: Object: Player Event: Set animation to “Run” Add Events Object: PlayerBox Condition: (Platform) On stopped Action: Object: Player Event: Set animation to “Idle”

Step 18: Add Event for Jumping and Landing Add Event Object: PlayerBox Condition: (Platform) On jump Action: Object: Player Event: Set animation to “Jump” Add Event with sub-events Object: PlayerBox Condition: (Platform) On landed Sub-events: (see details below)

Step 19: Add New Sprite -> Enemy Tips: Rename sprite object to “Enemy” Set origin to bottom center point

Step 20: Place enemies on blocks Tip: Ctrl-Click and Drag to copy enemy

Step 21: Add Behaviors to Player object Add the following behaviors: Flash

Step 22: Add New Event for Collision Add Event Object: PlayerBox Condition: On collision with another object  Enemy Action:

Step 23: Add New Event for Collision Add Sub-Event: Object: PlayerBox Condition: (Platform) is falling Add another condition: Object: PlayerBox Condition: (Compare Y) < Enemy.Y Add Actions: Object: Enemy Event: Destroy Object: PlayerBox Event: Set (Platform) vector Y Value: -700

Step 24: Add Else for Collision Add Else condition: Object: System Condition: Else Action: Object: Player Action: Flash 0.1 on 0.1 off after 1.0 seconds

Step 25: Add Behaviors to Enemy Add the following behaviors: Platform

Step 26: Update Enemy Platform Behavior Update the following: Max Speed: 50 Acceleration: 100 Deceleration: 100 Default Controls: No

Step 27: Add New Sprite -> Edge Tips: Rename sprite object to “Edge”

Step 28: Place along edges using Ctrl + Drag Tip: Make the Edge object Invisible

Step 29: Add New instance variable to Enemy Instance Variable: Name: action Type: Text Initial value: left Description (optional)

Step 30: Create Event for “right” movement Add Event: Object: Enemy Condition: (compare instance variable), action = “right” Action: Object: Enemy Action: Simulate (platform) pressing Right Object: Enemy Action: Set Mirrored

Step 31: Create Event for “left” movement Add Event: Object: Enemy Condition: (compare instance variable), action = “left” Action: Object: Enemy Action: Simulate (platform) pressing Left Object: Enemy Action: Set Not mirrored

Step 32: Create Event for Edge collision Add Event: Object: Enemy Condition: On collision with Edge Action:

Step 33: Create Sub-Event with Actions Add Sub-Event: Object: Enemy Condition: (compare instance variable), action = “right” Action: Object: Enemy Action: (Set value) action to “left”

Step 34: Create Else Condition Add Else Condition: Object: System Condition: Else Action: Object: Enemy Action: (Set value) action to “right”

Step 35: Add New Sprite -> Platform Tips: Rename sprite object to “Platform” Place it higher than a Tile. Ctrl-Click and Drag to create more.

Step 36: Add Behavior to Platform Add the following behaviors: Jump-thru

Step 37: Add New Event for Player falling out New Event Object: Player Condition: Is outside layout Action: Object: System Action: Restart layout

Step 38: Add Moving Platforms Add Behavior Sine

Step 39: Customize Graphics Download Free Graphics Free Bundle from Scirra: Top-down shooter + zombies: Tiled Backgrounds, etc:

Step 40: Export to HTML5 Website Export Project

Play Your Game!!!

(END of Platformer tutorial) Derived from ‘How to make a Platform game’ originally published by AshleyHow to make a Platform game Ashley Updated with different graphics and simplified animations