# Bounce and Collision Based scene in Phaser3

**URL:** <https://phaser.discourse.group/t/bounce-and-collision-based-scene-in-phaser3/7819>\
**Category:** Phaser 3\
**Created:** [October 21, 2020, 12:27pm UTC](https://phaser.discourse.group/t/bounce-and-collision-based-scene-in-phaser3/7819 "2020-10-21T12:27:40Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Shivam\_Paliya](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/shivam_paliya/32/4115_2.png) [@Shivam\_Paliya](https://phaser.discourse.group/u/Shivam_Paliya)\
**Post date:** [October 21, 2020, 12:27pm UTC](https://phaser.discourse.group/t/bounce-and-collision-based-scene-in-phaser3/7819/1 "2020-10-21T12:27:41Z")

</div>

Hey community, this is my first post here, I am sharing my scene in which I have used bounce and collision effect of phaser 3 , I have marked comments in order for understanding and reference purposes. The code I have laid down is as follows:

```javascript
window.onload = () => {//creating game window.
    class MainScene extends Phaser.Scene {
        preload() {// the following function preloads the image asset required in scene
            this.load.image("bird", "bird.png");
        }
        create() {
            this.player = this.add.group();//grouping the sprite in order to load them at different positions
            this.time.addEvent({ delay: 1000, loop: true, callback: () => this.addBall() })//calling back addBall function after
            this.physics.add.collider(this.player, this.player);//setting collider object between every object
        }

        update() {
            if (this.player.getChildren().length > 10) {// if qty of objects/player is >10
                const bird = this.player.getFirstAlive();//getting 1st instance of player
                this.tweens.add({targets: [bird], alpha: 0, duration: 500, onComplete: () => bird.destroy()});//deleting first instance of player
            }
            this.player.getChildren().forEach(bird => bird.setAngularVelocity(bird.body.velocity.x * 1));//to produce spiral motion
        }

        addBall() {
            const bird = this.physics.add.sprite(game.config.width / 3, 150, "bird");//assigning sprite to bird vairable
            this.player.add(bird);//assigning ball to
            bird.setBounce(0.7);//setting bounce value ,
            bird.setDrag(1);//setting drag value
            bird.setCollideWorldBounds(true);//to enable collision setting bounds
            bird.setVelocity(Phaser.Math.Between(-800, 800), 0);//setting velocity 
            bird.setScale(Math.random());//so that the objects are of random, not same size,
        }
    }

    const game = new Phaser.Game({
        type: Phaser.AUTO,
        width: 600,//frame width
        height: 600,//frame height 
        physics: {
            default: 'arcade',
            arcade: {
                gravity: {y: 1000},//setting up gravity value
            }
        },        
        scene: [MainScene]
    });
};

```

![Screenshot (198)](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/b/b40052abe2f2f05bff3971893082af8c8d2699e9.png)  
So thats how my scene looks and all the birds disappear after a certain time, as mentioned in the code, Feel free to suggest what more I shall improve upon in order to grow and devlop, and how you feel of this scene.  
Thank You 🙂