Start

Open a sketch, change a number, run it

play.onejs.com is a catalog of small sketches. Every one runs in the browser, shows you its source, and can be forked or opened in Unity.

Sketches are written in React and TypeScript against a package called oj.

import { View, Text, mount, useFrame, input } from "oj"

function Game() {
    useFrame(() => {
        if (input.keyboard.wasKeyPressed("Space")) jump()
    })
    return <View><Text>hello</Text></View>
}

mount(<Game />)

No build configuration and no root plumbing. mount() already knows where to render.

The shortest way in

  1. Open any sketch from the catalog.
  2. Press Edit.
  3. Change a number and press Run.

That needs no account, and nothing you do touches the original. Run builds what is in your tab and plays it; it never saves.

Keeping what you make

Signing in is what lets you keep something: creating a sketch, forking one, and saving your work.

/new asks for a name, then opens the editor on a starter sketch that is already running. Your typing is saved as you go, and a save that does not compile still lands: the error comes back with the file and line, and what is live does not move.

A new sketch is private. The dropdown at the top of the preview pane is the only thing that changes that, and it has two answers, Private and Public. Publishing hands over all of it at once: the page, the source, forking and the Unity download. Forking a public sketch gives somebody their own copy with a new id, and yours is untouched.

Every account gets 1 GB of storage. Verifying a OneJS purchase from the Unity Asset Store doubles it to 2 GB.

Two things worth knowing early

Your sketch is the JavaScript, not the engine. Unity and the OneJS runtime are one shared container that every sketch on the site runs inside, so a sketch is a few kilobytes and starts without a download prompt. It also means what you fork is real source.

Nothing here is thrown away. oj is a subset of OneJS, so everything a sketch uses also works in a normal Unity project. When a sketch outgrows the browser, opening it in Unity is copy the file in, npm i, build.

Where to go next

Writing a Sketch The entry point, the frame loop, the manifest
Elements and Styling What you draw with, and the traps in it
The Stage The window your sketch gets, and a fixed board inside it
Files Sprites, sounds, fonts and covers
Effects Particles, shaders and per pixel programs
Opening in Unity The download, and working on a sketch from your own machine

Start with Writing a Sketch if you want to make something, or Elements and Styling if you have forked one and want to know what the code in front of you does.