Ex: The Collector

Template for The Collector

Setup Layout

Setup game defaults

• SD Landscape 16:9

  • 854 x 480

• Use default settings

• Set size of Layout 1 to match 854 x 480

Setup Layers

Separate game characters from background layers

• Select Layer 0 change name to Background

  • Change Background color property of Layer 0

  • Pick any color you like

• Create new layer named PlayerLayer

Main Character

Create and add main character

• On the Player layer

• Create and add a new Sprite object

• Name the object-instance TheCollector

• Resize Image Canvas to 100 x 100 pixels

• Draw your character

Behaviors: Movement

Add behaviors to main character

• Select Player instance

• Properties panel

  • Behaviors -> Add new behavior

  • Select / search for 8 Direction

• Take note of default controls

• Change and experiment with Max Speed, Acceleration, etc.

  • e.g. higher Deceleration for quick stops

• Experiment with `Set angle

  • What kinds of games can you make with these limitations?

Behaviors: Bounding

Prevent player from leaving viewport

• Select Player instance again

• Properties panel

  • Behaviors -> Add new behavior

  • Select / search for Bound to layout

• From properties panel

  • property Bound by

  • value Origin

Keyboard Object

Invisible Object to make keyboard controls possible

• Go to Player sprite

  • Behaviors -> Default controls -> Uncheck

• Insert invisible Keyboard object to project

Events: Keyboard Controls

Disable default controls. Reassign keyboard controls.

• Go to Event sheet 1 sheet

• Condition:

  • Keyboard object -> Key is down -> press W key

• Action:

  • Player -> Simulate control -> ⬆︎ key

• Repeat these Conditions and Actions for:

  • A is ⬅︎ key

  • S is ⬇︎ key

  • D is ➡︎ key

Event: OR Blocks

Move player with WASD keys OR arrow keys

• Go to Event sheet 1 sheet

• Select W key condition -> right-click Make OR block

• Right-click Add -> Add another condition

  • Keyboard object -> Key is down -> press ⬇︎ key

• Repeat these Conditions and Actions for:

  • A is Left key

  • S is Down key

  • D is Right key

Event: Organization

Organize with folder and comments. Write to your future self.

• Go to Event sheet 1 sheet

• In empty areas, right-click + Add Group -> named Keyboard Controls

• Select all four keyboard events and drag into the Group

• Select Group Keyboard Controls -> right-click + Add Comment -> add comment "Custom controls to the player" or whatever you like

New Object Sprite

New object sprite to be a token, enemy, collectible, power ups, etc.

• Go to Layout 1 sheet

• Insert new object -> Sprite

• Resize to 50 x 50

• Draw anything for the sprite

• Name/rename sprite to Token

Event: On start of layout

When the game starts, randomly place tokens.

• Go to Layout 1 sheet remove Token sprite from Layout

• Now, go to Event sheet 1 sheet

• In empty areas, right-click + Add Group -> named System

• Condition: Add Event -> System -> On start of layout

• Action: Add Action -> System -> Create object -> Select Token

  • Layer: "Player"

• Prevent being placed off screen

  • X: random(50,834)

    • 50 is width of Token

    • Note: 834 is width of Layout minus Token sprite width

  • Y: random(50,470)

    • 50 is height of Token

    • Note: 834 is height of Layout minus Token sprite height

Check-Check: Game Loop

Update the game every second aka tick.

• Note: On start of layout initially runs once versus Every tick once a second.

• Go to Event sheet 1 sheet

• Test condition for the Game Loop

  • Condition: Add Event -> System -> Every tick

  • Action: Copy Action from above to randomly place Token

• Does it create and randomly place Tokens on screen?

  • If yes, delete test condition

  • If no, fix, then delete.

Timer Function

Functions are named and reusable events

• Go to Event sheet 1 sheet

• In empty areas, right-click + Add Group -> name My Custom Functions

• In empty areas, right-click Add Function

• Condition: New named function CreateToken

• Action: Copy Action from above to randomly place Token

• Put in My Custom Functions group

Modifying Each Instance

When each instance is created, modify the instance.

• Go to Event sheet 1 sheet

• In My Custom Functions group

• Create a single condition with multiple actions

• Condition: Token -> On created

  • Action: Token -> Set angle -> random(0,360) i.e. between 0 and 360 degrees

  • Add a second Action

    • Token -> Set opacity -> random(20,100) i.e. between 20% and 100% opacity

  • Add a second Action

    • Token -> Set scale -> random(.5,15) i.e. between 50% and 150% opacity

Player vs Tokens Layer

Separate the Player layer versus Token layer

• Go to Event sheet 1 sheet -> Layers - Layout 1 panel

• right-click -> Add layer at top

• rename to > TokensLayer

• order Layers top to bottom

  • PlayerLayer

  • TokensLayer

  • Background

• Go to CreateToken function, double click on the Action

  • Set Layer to "TokensLayer" to ensure the Player is on top of the Tokens

Player Destroy Tokens

Object to destroy other objects

• Confirm Layers are in correct order

• Confirm Tokens spawn to TokensLayer

• Add new Event

  • Condition: Player -> Is overlapping another object -> select Token for object

  • Action: Token -> Destroy

Variables to Keep Score

Keep track of destroyed objects

• Go to Event sheet 1 sheet

• Right-click -> Add global variable

  • Name is ScoreCount

  • Type is Number

  • Inital Value is 0

• Global variables are added to the top of the sheet

• Go to Event for Player is Overlapping another object

• Add a second action

  • System -> Add to -> Score -> Value is 1 add one to the score

Text Object to Display Score

• Go to Layout 1 sheet

• Add Text object -> rename object TheScore

• Go to Event sheet

• Go to Event for Player is Overlapping another object

• Add a third action

  • TheScore -> Set text -> ScoreCount

• Custom display of the score

  • "Score: "&ScoreCount show static text "Score: " then append with & the dynamic ScoreCount

HUD Layer

Put score on it's own layer.

• Go to Event sheet 1 sheet -> Layers - Layout 1 panel

• right-click -> Add layer at top

• rename to > HUD

• Go to Layout 1

• Select TheScore

• Changer Layer property to HUD