Tweet
Tweet

Slide 1

Slide 1 text

BUILDING A MULTIPLAYER VERSION OF SPACE INVADERS SRUSHTIKA NEELAKANTAM | HALFSTACK CONF ONLINE 2020 | ABLY REALTIME @Srushtika

Slide 2

Slide 2 text

HELLO! I’M SRUSHTIKA Developer Advocate @Srushtika [email protected]

Slide 3

Slide 3 text

BUT FIRST, LET’S PLAY THE GAME! - This game demo is capped at 10 people (to make sure my system doesn’t crash), so fastest fingers first! - Open the link in a computer browser. For best experience, maximize the window and set the magnification to 100% or less. - This video stream that you are looking at is about 15-30 seconds behind what’s actually happening in the real world. So I’ll join the game myself, the people who aren’t participating can have a look at that. I’ll try to do things slowly and try to stay alive by the time everyone actually joins. So let’s see how this goes. @Srushtika | HalfStack Conf Online 2020 https://go.ably.io/play-space

Slide 4

Slide 4 text

CORE COMPONENTS OF A REALTIME MULTIPLAYER GAME Physics Networking Assets @Srushtika | HalfStack Conf Online 2020

Slide 5

Slide 5 text

ASSETS AND PHYSICS GAME COMPONENTS @Srushtika | HalfStack Conf Online 2020

Slide 6

Slide 6 text

GameScene extends Phaser.Scene { } WORKING OF PHASER GAME COMPONENTS @Srushtika | HalfStack Conf Online 2020 gameConfig = {}

Slide 7

Slide 7 text

WORKING OF PHASER GAME COMPONENTS @Srushtika | HalfStack Conf Online 2020 preload() gameConfig = {} GameScene extends Phaser.Scene { }

Slide 8

Slide 8 text

GameScene extends Phaser.Scene { } WORKING OF PHASER GAME COMPONENTS @Srushtika | HalfStack Conf Online 2020 preload() create() gameConfig = {}

Slide 9

Slide 9 text

GameScene extends Phaser.Scene { } preload() create() gameConfig = {} WORKING OF PHASER GAME COMPONENTS @Srushtika | HalfStack Conf Online 2020 update()

Slide 10

Slide 10 text

@Srushtika | HalfStack Conf Online 2020 NETWORKING GAME COMPONENT server player1 player2 player3

Slide 11

Slide 11 text

GAME COMPONENTS @Srushtika | HalfStack Conf Online 2020 HTTP WEBSOCKETS vs. NETWORKING

Slide 12

Slide 12 text

NETWORKING GAME COMPONENT @Srushtika | HalfStack Conf Online 2020 Some open-source options Socket.io Socket Cluster faye- websocket SockJS Websocketd

Slide 13

Slide 13 text

GAME COMPONENT @Srushtika | HalfStack Conf Online 2020 NETWORKING

Slide 14

Slide 14 text

@Srushtika | HalfStack Conf Online 2020 NETWORKING GAME COMPONENT player1 player2 player3 server

Slide 15

Slide 15 text

GAME COMPONENT @Srushtika | HalfStack Conf Online 2020 NETWORKING

Slide 16

Slide 16 text

@Srushtika | HalfStack Conf Online 2020 GAME ARCHITECTURE GAME COMPONENT 1. Game Room channel 2. Death notifications channel 3. One channel each for every player that’s playing the game

Slide 17

Slide 17 text

@Srushtika | HalfStack Conf Online 2020 GAME ARCHITECTURE GAME COMPONENT death notifs channel player2 channel player1 channel gameRoom channel player2 player1 server gameRoom channel gameRoom channel . . . player n channel player1 channel player2 channel death notifs channel death notifs channel

Slide 18

Slide 18 text

THANK YOU! @Srushtika [email protected] https://github.com/Srushtika/ realtime-multiplayer-space-invaders