# Velocity

**URL:** <https://phaser.discourse.group/t/velocity/14919>\
**Category:** Phaser 3\
**Created:** [November 8, 2024, 2:21pm UTC](https://phaser.discourse.group/t/velocity/14919 "2024-11-08T14:21:47Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![pooja](https://avatars.discourse-cdn.com/v4/letter/p/a5b964/32.png) [@pooja](https://phaser.discourse.group/u/pooja)\
**Post date:** [November 8, 2024, 2:21pm UTC](https://phaser.discourse.group/t/velocity/14919/1 "2024-11-08T14:21:47Z")

</div>

How can I make snake movement smoother with respect to velocity?

---

<div class="post-metadata">

**Author:** ![scottwestover](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/scottwestover/32/7442_2.png) [@scottwestover](https://phaser.discourse.group/u/scottwestover)\
**Post date:** [November 11, 2024, 1:04am UTC](https://phaser.discourse.group/t/velocity/14919/2 "2024-11-11T01:04:35Z")

</div>

By chance, are you able to share your code, or a demo of the issue you are looking to fix?

---

<div class="post-metadata">

**Author:** ![pooja](https://avatars.discourse-cdn.com/v4/letter/p/a5b964/32.png) [@pooja](https://phaser.discourse.group/u/pooja)\
**Post date:** [November 11, 2024, 4:33am UTC](https://phaser.discourse.group/t/velocity/14919/3 "2024-11-11T04:33:06Z")

</div>

when the snake moves, it looks like it ‘jumps’ rather than moving smoothly. How can I fix this?

Below are some functions I’ve implemented for my Phaser snake game: update, move, setBodyPartTexture, and grow

```javascript
update(time) {
    if (time >= this.moveTime && this.gameStarted) {
        this.keyLock = false;
        if (this.moveEvents.length > 0) {
            this.direction = this.moveEvents.shift();
        }
        this.move();
        this.moveTime = time + this.speed;
        return true;
    }
    return false;
}

move() {
    let oldHeadPosition = { x: this.snakeHead.x, y: this.snakeHead.y };
    this.directions.unshift(this.direction.clone());
    this.snakeHead.x += this.direction.x * this.bodyPartLength;
    this.snakeHead.y += this.direction.y * this.bodyPartLength;

    if (this.snakeHead.x > this.scene.game.config.width || this.snakeHead.x < 0 || this.snakeHead.y > this.scene.game.config.height || this.snakeHead.y < 0) {
        return;
    }

    for (let i = 1; i < this.body.length; i++) {
        let oldBodyPosition = { x: this.body[i].x, y: this.body[i].y };
        let oldBodyDirection = this.directions[i];
        this.body[i].x = oldHeadPosition.x;
        this.body[i].y = oldHeadPosition.y;
        oldHeadPosition = oldBodyPosition;
        this.setBodyPartTexture(i, oldBodyDirection);
    }
    this.setTailTexture();
    if (this.positions.length > this.body.length * this.bodyPartLength) {
        this.positions.pop();
        this.directions.pop();
    }
    this.moveTime = this.scene.time.now + this.speed;
}

setBodyPartTexture(i, oldBodyDirection) {
    if (!oldBodyDirection.equals(this.directions[i - 1])) {
        let prevDirection = `${this.directions[i - 1].x},${this.directions[i - 1].y}`;
        let currDirection = `${oldBodyDirection.x},${oldBodyDirection.y}`;
        let textureMap = {
            "1,0,0,-1": "bodyUpRight",
            "0,1,-1,0": "bodyUpRight",
            "-1,0,0,1": "bodyRightUp",
            "0,-1,1,0": "bodyRightUp",
            "0,1,1,0": "bodyRightDown",
            "-1,0,0,-1": "bodyRightDown",
            "0,-1,-1,0": "bodyDownRight",
            "1,0,0,1": "bodyDownRight",
        };
        let directionKey = `${prevDirection},${currDirection}`;
        this.body[i].setTexture(textureMap[directionKey]);
    } else {
        if (oldBodyDirection.y != 0) {
            this.body[i].setTexture("bodyVertical");
        } else {
            this.body[i].setTexture("bodyHorizontal");
        }
    }
}

grow() {
    let newPart = this.scene.physics.add.sprite(-1 * this.bodyPartLength, -1 * this.bodyPartLength, "tailRight");
    this.scene.physics.add.collider(this.snakeHead, newPart, this.endGame, null, this.scene.snake);

    this.bodyParts.push(newPart);
    this.body.push(newPart);

    this.eat.play();
    score++;
    scoreNumber.innerHTML = score;
    if (score > highScore) {
        highScore = score;
        document.querySelector("#high-score p").innerHTML = highScore;
        document.getElementById("highScoreNumber").innerHTML = highScore;
    }
}

```

This is the video showing issue i am facing  
[https://www.awesomescreenshot.com/video/33408786?key=90beb12f2ca0ed729a0133a2b7ad36a6](https://www.awesomescreenshot.com/video/33408786?key=90beb12f2ca0ed729a0133a2b7ad36a6)

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [November 12, 2024, 3:52pm UTC](https://phaser.discourse.group/t/velocity/14919/4 "2024-11-12T15:52:24Z")

</div>

```js
class Snake {
  // …
  update(time, delta) {
    if (this.gameStarted) {
      this.keyLock = false;
      if (this.moveEvents.length > 0) {
        this.direction = this.moveEvents.shift();
      }
      this.move(delta);
      return true;
    }
    return false;
  }

  move(delta) {
    // …
    let distance = 0.16 * delta;
    
    this.snakeHead.x += this.direction.x * distance;
    this.snakeHead.y += this.direction.y * distance;
    // …
  }
}

```