Hello! Please choose your
desired language:
Dismiss

Scene examples

To get you up and running, and to illustrate what kind of experiences you can build using the SDK, we’ve put together some code and scene examples.

Some of these scenes feature a link to a version of the scene that’s deployed on a remote server. There you can interact with it just as if you were running dcl start locally.

Static XML Scenes

Static XML Scene

A completely static scene. It’s built entirely using XML, which makes it easier to write and edit, but doesn’t support any changes over time or interactions with the user.

Code

Essentials

Static Scene with Animations

A simple static scene that just displays 3D models. The 3D models include animations to move the butterflies, flames, etc.

Code

Explore the scene

Hypno wheels

This simple scene features a couple of wheels that you can spin by clicking them.

  • rotate an entity
  • glTF models
  • click events
  • textures
  • custom components
  • component groups

Code

Explore the scene

Read a tutorial blog post about this scene.

Shark animation

This simple scene shows how to add animations to a GLTFComponent and handle click events.

  • glTF models
  • animations
  • click events

Code

Explore the scene

Open the door

A simple interactive scene with a door that can be opened and closed.

  • Slerp() function for rotation
  • click events
  • materials
  • parent entities
  • custom components
  • component groups

Code

Explore the scene

Sliding door

A simple interactive scene with a two-sided door that can be opened by clicking.

  • Lerp() function for moving
  • click events
  • materials
  • parent entities
  • custom components
  • component groups

Code

Explore the scene

Jukebox

A scene where you can play different songs by pressing buttons on a jukebox.

  • audio
  • glTF models
  • Lerp() function for moving
  • click events
  • materials
  • parent entities
  • custom components
  • component groups

Code

Dance floor

A scene with animations, sound, and tiles on the floor that randomly change color to the beat.

  • audio
  • glTF models
  • animations
  • materials
  • custom components
  • component groups

Code

Memory game

A Simon Says game, with click interactions and sequenced actions. The game generates a random sequence of colors and you must click buttons to match those.

  • glTF models
  • materials
  • click events
  • custom components
  • component groups

Code

Movement

Hummingbirds

A scene where hummingbirds spawn when you click a tree. Each bird moves on its own to random positions.

Code

Explore the scene

Gnark patrolling

A scene that shows a character walking along a fixed path, using lerp over each segment of the path. If you approach it, it will switch to yelling at you.

Code

Explore the scene

Read a tutorial blog post about this scene:

Network connections

Weather simulation

A scene that checks a weather API for the weather in a location and displays that weather condition, showing rain, thunder or snowflakes Use real weather data from different locations by changing the coordinates, or change the value of the “fakeWeather” variable to see different weather conditions manifest.

  • Call external REST API

Code

Explore the scene

Remote door

A scene that uses a server and a REST API to sync a scene state amongst multiple users. It’s built around the basic “open the door” example.

  • Create a REST server
  • Call REST API

Code

Remote mural

A scene that uses a server and a REST API to sync a scene state amongst multiple users. You can paint pixels in a mural that other users can see. The colors of each pixel are stored in a remote server.

  • Create a REST server
  • Call REST API

Code

Advanced

Block Dog

A scene with a simple AI character. It randomly chooses what action to take: follow you, sit or remain idle. You can also tell it to sit or stand up by clicking it, or tell it to drink water by clicking its bowl.

Code

Explore the scene

Tower defense game (WIP)

A fully-fledged game where a random 2d path is generated along which enemies walk, and where traps are randomly placed. You need to activate the traps as the enemies advance along the path to kill them. It’s all about timing.

Code

Castaway 2048 (WIP)

A fully fledged game, based on the popular game 2048, where the values are represented by a series of gems of increasing values. Click and drag to displace the gems on the board and merge them into greater values till you reach 2048.

Code