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.

Clone an example scene

Instead of creating a new scene from scratch, you can clone one of the existing example scenes and use that as a starting point.

To do so:

  1. Find an example you like from the ones listed below.
  2. Open the Code link to visit its GitHub repo.
  3. From there you can either:
    1. Fork the repo to work on your own version of it, that will exist in a cloned GitHub repo that belongs to you.
    2. Click Clone or Download and select to download it as a .zip file, to work on the files locally, without GitHub being involved.

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

Puffer fish

This simple scene shows how to use the utils library to scale an entity gradually.

  • glTF models
  • scaling an entity
  • delaying a function
  • adding a sound clip

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

Explore the scene

Basic interactions

A scene with a simple example of each way in which players can interact. Each shape’s color is activated by interacting with it.

  • Click events
  • PointerUp and PointerDown events
  • Player position
  • Global pointer events
  • Animations

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

Explore the scene

Smoke

This scene shows how to handle a particle system to create smoke. Each smoke puff is an entity that moves in a specific direction. These entities are reused from an object pool instead of creating a new entity for each. When an entity floats away from the fire, it’s removed from the scene and waits in the object pool to be reused.

Code

Explore the scene

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

Explore the scene

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:

Swimming shark

This scene shows a shark moving around in circles along a curved circular path, using lerp over each segment of the path. It also rotates smoothly with a spherical lerp function.

The speed of the shark and the intensity with which it swims depends on the steepness of the segment.

Code

Explore the 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

Picture frame

A scene that displays a crypto collectible NFT in a picture frame. See display a certified NFT for more details.

Code

Custom UI

Mining rocks

A simple scene that shows how to build a custom UI that can be interacted with by the player and that is upated as the player interacts with the world

Code

Explore the scene

Blockchain transactions

MANA Transfer

A simple scene that uses the MANA smart contract and the EthConnect library to send the user MANA on the Ropsten test network.

Code

Explore the scene

MANA Burning Altar

Fees collected by the Marketplace are stored in a wallet. This scene interacts with the MANA contract to burn this MANA that was collected.

The flame is created as a particle system, handling various entities that spiral around as they change colors.

Code

Explore the scene

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

Escape room

A full escape room game, where each room is a puzzle to be interacted with in different ways.

This scene is showcased by a video tutorial series that walks you through all the mechanics, starting from the basic concepts.

Code

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