JavaScript toolkit · Experimental alpha

Artist SDK

Save compositions, describe your artwork, and connect it to viewers and export tools.

For artists building generative work with code. Use individual modules alongside your existing renderer, animation loop, and controls. No wallet or hosted Oriel service is required.

Explore with Oriel: Kepler’s Dream, a work in progress by Mihira. Hosted on mihira.art.

Core version
0.1.0-alpha.4
License
MIT
Runtime dependencies
None
Environment
Browser / Node.js*

*Rendering and interface modules require a browser. APIs are experimental; record the SDK commit with each artwork release.

01 / Modules

What’s included

The full SDK includes the modules below. Optional modules are imported separately, so importing the core does not start a renderer, panel, or viewer connection.

Core artwork

@oriel-art/artist-sdk

Seeded random streams, validated parameters, traits, recipes, and explicit hooks for restoring artwork state.

Metadata

…/metadata

Artist credits, project and edition descriptions, licensing, translations, and provenance references supplied by the artist.

Capabilities

…/capabilities

Technical and artist-defined output limits, request validation, optional runtime checks, and capture-and-screen tools.

Discovery & bridge

…/discovery · …/bridge

Static artwork descriptions and an opt-in connection between an artwork in an iframe and its surrounding viewer.

Shader renderer

…/webgl

An optional single-pass WebGL 1 renderer for fragment shaders, with PNG export of a saved frame.

Studio & information tools

…/info · …/parameter-panel · …/testing

An artwork information panel, parameter editing, boundary cases, seed sampling, and downloadable reports.

Paths beginning with …/ are subpaths of @oriel-art/artist-sdk.

Only need descriptions or output limits?

Use @oriel-art/metadata or @oriel-art/capabilities independently. Both are at 0.1.0-alpha.1 and work without the core artwork API or a renderer.

Metadata, capabilities, and discovery include TypeScript declarations. Core artwork, rendering, bridge, and older UI modules remain JavaScript-only.

02 / Integration example

Explore with Oriel

Try the SDK in Kepler’s Dream, a generative artwork by Mihira. Explore the parameter lab, play and seek through the animation, save and load recipes, and export a PNG.

Artwork by Mihira · Work in progress · Hosted on mihira.art
Built with Oriel Artist SDK 0.1.0-alpha.4, commit 33d529f. No local setup needed.

For developers: run the SDK examples locally

These are the SDK’s sample projects, separate from Mihira’s artwork. With Git and Node.js 22 or later installed, run:

git clone https://github.com/oriel-art/artist-sdk.git
cd artist-sdk
npm run dev

The browser demos run from source. No dependency installation or build is needed.

Shader studio

http://127.0.0.1:4173/examples/webgl/
  1. Change the seed, density, and palette.
  2. Pause the animation and save a PNG.
  3. Save the recipe to reopen that composition.
  4. Open Parameter lab to edit values and sample seeds.

Bridge viewer

http://127.0.0.1:4173/examples/host/

See an artwork communicate with its surrounding viewer. Inspect its description, pause or seek, and change an exposed parameter.

These addresses work on your computer only while the local server is running. Open them in your browser rather than double-clicking an HTML file. Stop the server with Ctrl+C.

03 / Integration

Add it to your artwork

Choose the setup that matches your project. These instructions use the repository source rather than assuming an npm registry release.

Browser project without a bundler

Copy the repository’s complete src/ directory into vendor/artist-sdk/src/ in your project, preserving the folder structure. Include the SDK’s LICENSE and record its Git commit.

import { createArtwork } from './vendor/artist-sdk/src/index.js';

Load your entry file with <script type="module"> and serve the project over HTTP.

Bundler or Node.js project

Build and pack the SDK from your checkout:

# From the artist-sdk checkout
npm ci
mkdir -p ../oriel-sdk-packages
npm pack --pack-destination ../oriel-sdk-packages
git rev-parse HEAD

Install the resulting archive in your project:

# From your own project; adjust the path as needed
npm install ../oriel-sdk-packages/oriel-art-artist-sdk-0.1.0-alpha.4.tgz

Use the filename printed by npm pack if the version changes. Keep the archive, lockfile, and SDK commit; experimental updates can share a version number.

A small first integration

After installing the package, save this as artwork.mjs and run node artwork.mjs. For the browser setup, replace the first line with the relative import above.

import { createArtwork } from '@oriel-art/artist-sdk';

const artwork = createArtwork({
  id: 'line-study',
  version: '1',
  seed: 'composition-001',
  parameters: {
    density: { type: 'integer', min: 8, max: 36, default: 16 },
    palette: { type: 'choice', choices: ['ink', 'clay'] }
  }
});

// Use these values in your own drawing code.
const density = artwork.parameters.density;
const random = artwork.random('composition');
const angle = random.float(0, Math.PI * 2);

// Save the inputs as JSON.
const recipe = JSON.stringify(artwork.getRecipe(), null, 2);
console.log({ density, angle, recipe });

This example produces values and a recipe; it does not draw an image. Pass those values into your own drawing code. Keep a random generator to advance its sequence—calling artwork.random('composition') again restarts that stream.

04 / Composition

Seeds, parameters & recipes

Seed
An exact string used to generate repeatable random choices. Separate named streams let you organize choices such as composition and colour.
Parameters
Numbers, integers, booleans, and choices with declared values and limits. Explicit values take priority over defaults; otherwise values can be sampled.
Recipe
A JSON record of artwork identity, versions, seed, and resolved parameters. Optional artist-defined context can record time, aspect ratio, or other state.
Choose a seedAdjust parametersSave a recipeRestore in your artwork

Your artwork supplies the restoration logic. A recipe is not a recording of simulation steps, GPU buffers, or interaction history. Keep matching artwork code and assets with it; restored inputs do not guarantee identical pixels on every device.

Explore parameters in the studio

The optional parameter panel provides sliders, precise entry, choice controls, boundary cases, and seed sampling reports. You supply the redraw callback and any checks for suitable compositions. The panel is available in studio mode; sampling alone does not establish artistic quality.

05 / Output

Rendering, export & print

Keep your renderer

Use SDK values and recipes with your existing canvas, shaders, assets, and animation loop. Rendering, export, and context recovery remain your code.

Use the optional runner

The SDK runner owns a fresh canvas and supports one fragment pass in WebGL 1 / GLSL ES 1.00. It exports a PNG by rendering the last successful frame’s saved inputs in a separate context.

Output size is checked against device limits and a pixel budget. The shader must support the requested size and aspect ratio; requests are not silently downscaled.

Describe what an output supports

Capabilities record technical limits and artist constraints such as image dimensions, formats, aspect ratios, physical print sizes, and DPI. Both sets of constraints apply. Validation returns supported, unsupported, or requires-evaluation.

Capture and screen one print job

The capture-and-screen workflow saves a composition, frame, output request, and print specification together. Artist-supplied checks run against that snapshot, so later live edits do not change the job.

Save the report with the exported image. Your integration handles rendering, colour profiles, and measurements; the SDK records the supplied checks and adds no print approval step.

06 / Artwork information

Metadata, discovery & viewers

Metadata describes the work: title, creators, editions, licensing, translations, and optional provenance references. These are artist-supplied descriptions; the SDK does not verify authorship or resolve references.

Static description

Publish an artwork.json file containing metadata and/or capabilities. Tools can inspect that description without executing the artwork.

Runtime connection

Opt into the iframe bridge to expose read-only information and selected controls. Register only the queries and commands the viewer should be able to use.

A declared capability does not implement a control or grant access to it. For example, advertising seek support and registering a seek command are separate decisions. Configure allowed viewer origins when exposing the bridge.

The optional information panel displays your own text, credits, and control descriptions inside the artwork. It works independently of the studio parameter editor.

07 / Status

Current limits

The SDK is experimental. The following are not provided by the current implementation:

  • Automatic simulation replay or cross-device pixel identity.
  • WebGL 2, textures, or multipass rendering in the optional shader runner.
  • Video, frame-sequence or tiled export, colour management, or print profiles in that runner.
  • Dedicated p5.js, Canvas 2D, Three.js, or platform publishing adapters.

You can still use the core utilities with your own renderer. Declarations and validation describe supported operations; they do not add an exporter or prove a rendering result.

08 / Reference

Guides & source

This page summarizes the current SDK documentation. The repository contains the full APIs, source, and runnable examples.

For a bug report, include the SDK commit, browser or renderer, expected result, and a small reproduction. Documentation reviewed October 28, 2026.