2.2.2 Cycle 2 - Movement

Design:

Objectives

In the second cycle, my objectives are to implement the basic controls and allow the player's character to move around the screen. Completing the steps in this order should lay out a strong, progressive structure for my game. The layers don't need to be too detailed at this point, graphics quality improvements can be adjusted later on.

• Implement Player movement

• Utilise basic controls for the movement as specified in 1.5 Success Criteria.

Usability Features

Implementing my simple game controls into the project. This will allow the user to move their character around the map as discussed in 1.5 Success Criteria.

Key Variables

Variable Name	Use
moveSpeed	Defines the value for player movement speed.

Pseudocode

define(moveSpeed)
if up arrow pressed: { 
  move player up by moveSpeed
};
if left arrow pressed: {
  move player left by moveSpeed
};
if down arrow pressed: {
  move player down by moveSpeed
};
if right arrow pressed: {
  move player right by moveSpeed
};

Development:

Outcome

• The player is now able to be controlled once they have been rendered, the code for this can be viewed below:

// MOVEMENT

// Define player movement speed (pixels per second)
const moveSpeed = 320

// jump when player presses "space" key
onKeyDown("space", () => {
    // .jump() is provided by the body() component
    player.jump()
})

// jump when player presses "up" key
onKeyDown("up", () => {
	player.jump()
})

// onKeyDown() registers an event that runs every frame as long as user is holding a certain key
onKeyDown("left", () => {
	// .move() is provided by pos() component, move by pixels per second
	player.move(-moveSpeed, 0)
})

onKeyDown("right", () => {
	player.move(moveSpeed, 0)
})

onKeyDown("down", () => {
	player.move(0, moveSpeed)
})

Challenges

Some challenges I faced during this cycle:

• Finding the correct code to correspond with the selected key bindings.

• Allowing multiple actions at once (jump and direction).

Testing:

Tests performed in this cycle are evidenced below, they were a crucial aspect of my development.

Tests

Test	Instructions	What I expect	What actually happens	Pass/Fail
1	Run code.	The game to start, boundaries still rendered and player still placed.	As expected	Pass
2	Movement keys: WASD are pressed.	The player is able to move in all directions. This includes the ability to jump.	As expected	Pass

Evidence

The screen recording below shows the rendered sprite after moving from its original position, it completes the following tasks for this cycle:

• Implement Player movement

The code snippet below shows Javascript for the basic controls used, it completes the following tasks for this cycle:

• Utilise basic controls for the movement as specified in 1.5 Success Criteria.

// jump when player presses "space" key
onKeyDown("space", () => {
    // .jump() is provided by the body() component
    player.jump()
})

// jump when player presses "up" key
onKeyDown("up", () => {
	player.jump()
})

// onKeyDown() registers an event that runs every frame as long as user is holding a certain key
onKeyDown("left", () => {
	// .move() is provided by pos() component, move by pixels per second
	player.move(-moveSpeed, 0)
})

onKeyDown("right", () => {
	player.move(moveSpeed, 0)
})

onKeyDown("down", () => {
	player.move(0, moveSpeed)
})