Game Lab
Upcoming SlideShare
Loading in...5

Game Lab






Total Views
Views on SlideShare
Embed Views



1 Embed 5 5


Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

Game Lab Game Lab Document Transcript

  • DPP B2 (c) JOB SHEETCOURSE : DIPLOMA IN DIGITAL MEDIA DESIGNSESSION : JAN - JUN 2012 SEMESTER : 4CODE/SUBJECT : DDM 4323 - GAME DESIGN SHEET NO : JS-8NO OF STUDENTS : 30 WEEK : 8LECTURER : AZMI BIN MOHAMEDTOPIC : 8.0 SPACE SHOOTER 8.1 Research and create a basics of movie clips and character movement for space shooter gameSUB-TOPIC : 8.2 Add an interactive elements; lives and score for game 8.3 Add sound effects using ActionScript. After completing this topic, students should be able to:LEARNING 1. Develop their own space shooter games with random enemies.OUTCOME : 2. Create an interactive element; lives and score for their games. 3. Add a sound effects using ActionScriptTOOLS / 1. ComputerEQUIPMENTS / 2. ProjectorMATERIALS : 3. Adobe Flash CS4INSTRUCTION : 1. Research the ActionScript for creates a space shooter game, character movement and shoot control using keyboard. 2. Follow step-by-step tutorial below to create a space shooter game. Page | 1
  • DPP B2 (c)PROCEDURE :STEP KEY POINTMovie Clip and Movement1. Open Adobe Flash and create new document (ActionScript 2.0)  Size: 800x600px  Frame Rate : 24fps  Background Color: Black2. Create a Movie Clip by right clicking your library tab and selecting "New Symbol...", make sure "Movie Clip" is selected and choose a name.3. Flash will create and open the Movie Clip for editing, so just paste an image or draw a space ship with Flashs drawing tools. After drawing your ship, get back to the main timeline by click on "Scene 1": At properties panel; put a variable name as “ship”.4. Right click the first frame in your timeline this.onEnterFrame = function() and select "Actions". Type this: { if (Key.isDown(Key.RIGHT)) { Ship._x += 10; } else if (Key.isDown(Key.LEFT)) { Ship._x -= 10; } else if (Key.isDown(Key.UP)) { Ship._y -= 10; } else if (Key.isDown(Key.DOWN)) { Ship._y += 10; } } Page | 2
  • DPP B2 (c)Shooting5. This is the second part of the tutorial and we are going to enable the ship to shoot. Previously we made our ship fly; now we are going to make it shoot and set limits to where it can go. First we need to make our bullets, right click the library tab, select "New Symbol" and give it the name "Bullet". Before clicking OK, click Advanced, select "Export for Actionscript" and make sure the identifier is "Bullet".6. We do this because we need to export the Bullet Movie Clip during running time to create many bullets and we will use the name determined in identifier to call it later. Draw a small bullet, and position it like this: This is called registration point, in the stage this is the position of the Bullet Movie Clip.7. Now open the actions window of the first this.onEnterFrame = function() frame of the Movie Clip, insert this code: { this._x += 12; if (this._x > 800) { this.removeMovieClip(); } }8. Now go to the main timeline, select the var i = 0; first frame and open the actions this.onEnterFrame = function() { windows. You will see the previous . codes that we have written. Add this . code to the old one so we can fire our . bullets: else if (Key.isDown(Key.DOWN)) { Ship._y += 5; } if (Key.isDown(Key.SPACE)) Page | 3
  • DPP B2 (c) { i++; _root.attachMovie("Bullet", "Bullet" + i, _root.getNextHighestDepth()); _root["Bullet" + i]._x = Ship._x + 3; _root["Bullet" + i]._y = Ship._y; } }9. Before we finish this tutorial, lets put if (Key.isDown(Key.RIGHT)) some limits to where our ship can go, we { dont want it to get off the screen. Make if (Ship.hitTest(800, Ship._y, these changes: true)) { Ship._x -= 5; } Ship._x += 5; } else if (Key.isDown(Key.LEFT)) { if (Ship.hitTest(0, Ship._y, true)) { Ship._x += 5; } Ship._x -= 5; } else if (Key.isDown(Key.UP)) { if (Ship.hitTest(Ship._x - 40, 0, true)) { Ship._y += 5; } Ship._y -= 5; } else if (Key.isDown(Key.DOWN)) { if (Ship.hitTest(Ship._x - 40, 600, true)) { Ship._y -= 5; } Ship._y += 5; } if (Ship.hitTest(800, Ship._y, true)) { Ship._x -= 5; } Page | 4
  • DPP B2 (c)Enemies10. This is the third tutorial of a series about developing a Space Shooter game, in this tutorial we are going to make enemy ships. Create a new Movie Clip and draw your enemy ship, dont forget to set the identifier to "Enemy" and select "Export to Actionscript".11. Now drag the enemy Movie Clip to the onClipEvent(load) stage, give it an instance name of { "Enemy0", right click it and select function reset() "Actions". Insert this: { var timer = 12; this._y = Math.random() * 300 this._x = 550 mySpeed = Math.ceil(Math. random() * 6) + 1; } reset(); } // This part of the code creates a function called reset() when the Movie Clip loads for the first time. Inside reset() we set this._y to a random number between 0 and 600, this._x to 800 and the speed of our enemy to a random number between 1 and 6.12. Then, insert this code: onClipEvent(enterFrame) { this._x -= mySpeed; if (this._x < -10) { reset(); } if (timer >= 12) { Math.ceil(Math.random() * 2) timer = 0; Page | 5
  • DPP B2 (c) } if (dir == 1) { this._y -= 3; } else if(dir == 2) { this._y += 3; } timer++ }13. Add this code in the main timeline before var nrEnemies = 3; the rest of the code. for (i = 1; i < nrEnemies; i++) { _root.Enemy.duplicateMovieClip ("Enemy" + i, _root.getNextHighestDepth()); }Lives and Score14. This is the forth part of the development of a Space Shooter game. In this tutorial we will add lives, scores and game over to our game. Lets start with score.Open the main timeline code and add this variable: var score = 0;15. Now open the Bullets code and add this: this.onEnterFrame = function() { this._x += 9; if (this._x > 550) { this.removeMovieClip(); } for (i = 0; i < _root.nrEnemies; i++) { if (this.hitTest (_root["Enemy" + i])) { _root["Enemy" + i].reset(); _root.score += 10; this.removeMovieClip(); } } } // This is the code we used before to know if a bullet hits an enemy, so we can put the score for killing an enemy there. Page | 6
  • DPP B2 (c)16. The score is done; we just need to show the player his score. To do that, select the Text Tool and draw it on the stage. Write "Score:"17. Now draw another Text box on the stage. Select this new Text box and change these properties:18. Now lets make our ship have lives. Add var lives = 3; another variable in the main code:19. And make these changes in the code if (this.hitTest(_root["Enemy" + i])) that checks if the player crashed with an { _root.lives -= 1; enemy: reset() for(k = 0; k < _root.nrEnemies; k++) { _root["Enemy" + k].reset(); } } Page | 7
  • DPP B2 (c)20. Draw two text boxes again21. We can see the ship losing lives now, but nothing happens when it goes lower than zero. To change that we tell the player when its game over. Create a new movie clip.22. Write "Game Over" using the text tool and go back to the main timeline. Page | 8
  • DPP B2 (c)23. Add this to the Ships code: if (this.hitTest(_root["Enemy" + i])) { _root.lives -= 1; if (_root.lives <= 0) { _root.attachMovie("GameOver", "GameOver", 100) _root.GameOver._x = 275 _root.GameOver._y = 150 this.swapDepths(10); this.removeMovieClip(); } reset() for(k = 0; k < _root.nrEnemies; k++) { _root["Enemy" + k].reset(); } }Timer24. Before we start with sound we need to make some changes. You may have noticed that our ship shoots bullets as much as the player press the space bar, thats not right as it makes the game much easier. To prevent that, we are going to add a timer and the ship will shoot as much as we want. First add a new variable: var timer = 8; Then, make this changes: this.onEnterFrame = function() { timer++; . . . if (Key.isDown(Key.SPACE)) { i++; if(timer >= 8) { _root.attachMovie("Bullet", "Bullet" + i, _root.getNextHighestDepth()); _root["Bullet" + i]._x = Ship._x + 3; _root["Bullet" + i]._y = Ship._y; timer = 0; } } } Page | 9
  • DPP B2 (c)The code runs like this: Before:  If timer >= 8 then shoot a bullet and set timer to 0  Now that timer = 0, the bullet wont shoot, so the player has to wait all the code to run at least 8 timer to shoot again (timer++ will increase timer by 1 every frame)  Timer will be bigger than 8 again and the player can shoot. After:Sound 25. We can add the sound now. You need to have an mp3 file thats going to be the sound played when you fire. Now that you have your sound, click File > Import > Import to library...Select your mp3 file and click open, a new file should appear on the library. Right click it and click "Linkage..." Check "Export to ActionScript..." and set the Identifier to "shoot". This is the same thing we did previously with the Bullet Movie Clip, we need the linkage to call this on the code. Page | 10
  • DPP B2 (c)26. Add this to the shooting code: if (Key.isDown(Key.SPACE)) { i++; if(timer >= 8) { _root.attachMovie("Bullet", "Bullet" + i, _root.getNextHighestDepth()); _root["Bullet" + i]._x = Ship._x + 3; _root["Bullet" + i]._y = Ship._y; var shoot_sound = new Sound(); shoot_sound.attachSound("shoot"); shoot_sound.start(); timer = 0; } }27. The game is done! Hope you enjoying developing and playing it.REFERENCES : 1. Andrew Rollings, Ernest Adams (2003). Andrew Rollings and Ernest Adams on Game Design. USA: New Riders Publishing. 2. Andrew Rollings, Dave Morris (2004). Game Architecture and Design:A New Edition. USA: New Riders Publishing. 3. Patrick O’luanaigh (2006). Game Design Complete. USA: Paraglyph Press. Page | 11