Object types

A ball in the world.

A brick in the world.

A cylinder in the world. Its symmetry axis is local Z.

A RigidGroup is a bunch of objects that move together. All Ball, Brick, and Cylinder child descendants are glued together and will move as one rigid body.

If you want to add animations, you must set followSkeletonId, use a SkAnimator to animate it, and add SkAttachment objects to glue objects to the SkJoints. There are some AI tools to automate this.

Use this as a Folder. There is no special behavior, it is simply for organization.

A mesh in the world.

To animate this mesh visually, you must set followSkeletonId and use a SkAnimator to animate it.

This is the simplest way to animate characters and complex objects.

It animates a Skeleton. You can have many animators on the same skeleton. Animations will be blended in order of decreasing priority until each item's weight reaches a total of 100. See also: AnimationService.

Start and stop an animation with ClockService.play(clockId, animationTimeSecs) and ClockService.pause(clockId) on this animator's clock, and fade it in and out with AnimationService.smoothlyChangeWeight(animatorId, targetWeight, durationMs).

The root of a skeleton.

It should contain a SkJoint child for each joint in the skeleton. Hierarchies are allowed.

You can (1) animate it and (2) glue objects to it. SkAnimation lets you define animations, and SkAttachment lets you glue objects. Play the animation using a SkAnimator.

This is how you define an animation.

It should contain a keyframe SkKeyframe child for each timestep in your animation.

Use this to glue an object in a RigidGroup to an SkJoint.

A child of Skeleton or SkJoint.

Note: the bindPose is the reference location that SkAnimation movements are relative to.

A child of SkAnimation.

For each desired joint in this keyframe, it should contain a SkKeyframePose child.

A child of SkKeyframe.

The pose of an individual joint.

Use this to smoothly animate one property on any object.

A clock is just an internal helper object that tells us how far along we are in a SkAnimator, PropertyAnimator, or SoundPlayer. Clock state can be changed by server or client scripts. Client-side changes stay local and may intentionally desync.

An image or "texture" that is shown on an object. Albedo is the main texture. The other fields are optional PBR properties.

You can never create a Player object yourself. It is automatically created and deleted when a player joins and leaves. It is important for you to set the head and controls, or the player won't be able to see or move.

Every Script is either a Server or Client script.

• Client scripts run on every client.
• Server scripts run on the server.
• Some APIs are only exposed to one or the other; read the docs.

Import/Export:

• It is valid to write import { functionName } from './scriptName'.
• Scripts and their path names are set once, when the script is created.

Server/Client communication:

• You should communicate between the server and client as follows:
• Write 'use server' at the top of a Server script to make all exports accessible to Client scripts.
• Write 'use client' at the top of a Client script to make all exports accessible to Server scripts.
• The first argument to client functions must be the player's user id.
• Exports in these files must be async functions.
• You should validate server function inputs and client function returns, as these are untrusted.
• Make sure you don't over-expose functions: all exports from a 'use server' or 'use client' script must be validly callable by the other side.

UI:

• We expose React-like syntax to draw UI on the screen.
• Use <div> for layout and text. Divs do not block game pointer input and do not run hover effects unless you add pointer-events-auto.
• Use <button> with onClick for clickable UI and hover effects. Nested buttons are allowed, and the innermost button under the pointer handles the click.
• You may only use <div>, <button>, text, arrays, null, className, onClick, and onHover primitive props.
• You can use common Tailwind class names. Do not use style props or unsupported HTML tags.
• useState() works like usual.
• createState() works for state that comes from outside react, eg for 'use client' functions. This is similar to useSyncExternalStore.
• Write createState(initialValue). The .get() function automatically subscribes the relevant React components to re-render when .set() is called.

Libraries:

• You can use setTimeout() and setInterval(). Scripts expose all web APIs except fetch.

Managing Objects:

• Only the server can create and modify objects.
• All objects in the world are replicated to all users. You cannot create an object on just one client.

Controls the sun location and sky settings.