Skip to main content

3dverse in 20 minutes

Welcome to 3dverse. In about twenty minutes you’ll learn the essentials and deploy your first app to the web.

Goals

This page is the starting point for working with 3dverse. In about twenty minutes, you will:

  1. Understand the fundamentals — how 3dverse differs from traditional engines and browser-based frameworks.
  2. Get to know the Console — the central place where you create projects, upload files, and launch scenes.
  3. Run your first app locally — scaffold a 3dverse application using widely used web development tools.
  4. Deploy it to the web — publish the app to GitHub Pages and share it with a simple URL.

The focus is to give you both a solid mental model and a first working result — enough that you will feel comfortable exploring the rest of the documentation with context and confidence.

Core Concepts in a Nutshell

Traditional 3D engines are monolithic: everything runs on the end user’s machine, assets must be distributed, and collaboration is an afterthought that often depends on external versioning tools.

By contrast, tools like Google Docs for text or Figma for 2D design show the power of cloud-native collaboration: content lives in the cloud, updates are instant, and multiple users can work together seamlessly.

3dverse brings that same cloud-native model to 3D — designed to scale with new hardware, networks, and ways of working.

Architecture

3dverse is built on three distinct tiers:

Three-tier architecture
  • The Platform is the authority layer — it manages assets, access, and sessions.
  • The Cloud Renderer runs GPU processes in the cloud, each one powering a live 3D session.
  • The Client is just a web page or app that connects to a renderer, sending input and receiving video and state.

This separation makes the system scalable in the cloud and ensures that collaboration and security are handled consistently.

Applications

A 3dverse application is in reality just a web application.

The front end of the web application connects to the cloud renderer through Livelink, a bespoke real-time protocol that streams input, state, and video.

Two clients connected to the same rendering session.

When you open the web application, you are really joining a rendering session — a live process of the cloud renderer hosting a scene, created and managed by the Platform. Multiple users can connect to the same session at once, enabling real-time collaboration without extra setup.

The rendering session consumes assets stored in the Platform. Assets include scenes, meshes, materials, textures, and more.

important

Assets are never downloaded to the end user’s device. The client only receives video frames and lightweight state updates, which keeps applications lightweight and content secure.

Asset UUID

Each asset is identified by a UUID — referencing a scene UUID is how your application tells the renderer what to load.

Access Control

Traditional engines usually rely on external tools — such as version control systems or shared drives — to manage access and keep projects consistent.

In 3dverse, this is different.

Assets are scoped to an environment, and the Platform itself enforces who can view or modify them through various methods.

Because access control is built in, the same rules apply whether you’re browsing stored assets or using them inside a rendering session.


Hosting

3dverse does not host your web application. As a developer, you are responsible for building, deploying, and hosting your web app just like any other web project.

With this foundation in mind, you’ll see why this quickstart feels different from setting up a traditional engine: rendering happens in the cloud, assets stay in the platform, and your app is just the interface.

The 3dverse Console

The Console is the web portal where you organize projects, manage assets, and launch rendering sessions.

For most developers, it is the starting point: you upload source files, inspect the converted assets and scenes, and manage the environments your web applications will connect to.

Beyond content management, the Console also provides collaboration features (inviting team members, setting permissions), operational tools (tracking sessions, monitoring usage), and developer essentials (generating API keys).

In this quickstart, we’ll focus only on the basics — enough to prepare a scene that your first web application can connect to.


Preparing Resources

Account required

To follow the rest of this guide, you need a 3dverse account. You can sign up here.

The Console home page: your Personal Space
The Console home page: your Personal Space

1. Create a New Project

Click the New Project button to create your first project.

Creating a new project in the Console
A newly created project in the Console

Every new project includes:

  • A default Environment — it’s implicit, so you won’t see it in the asset browser. You can confirm it in the Project settings or in the URL (../default/...).

  • A Public folder at the root of that environment — see the Asset Browser page.

  • A public token linked to the Public folder — you’ll find it under API Access page. This token is what allows your own web application to access the assets stored inside the Public folder.

2. Upload and Convert a File

When a project is created, the Console launches an embedded tutorial that guides you through uploading a file, waiting for conversion, and opening the resulting scene.

Recommended

Before clicking the upload button, switch to the Public folder in your new project. If you upload from there, the assets will go directly into the Public folder and be ready to use in your application.

Uploading a 3D source file in the Console
The embedded tutorial guiding you through the upload process

The Console accepts common formats. Once uploaded, the file goes through the conversion process, which extracts 3dverse assets — scenes, meshes, materials, textures, etc.

You can follow the progress on the Conversions page:

Conversion progress in the Console
Conversion progress in the Console

3. Open the Scene

When conversion is complete, the tutorial invites you to open the new Scene asset in the Console’s Editor (the built-in scene editor).

warning

The Editor is not your final application. It is a 3dverse-provided tool for inspecting and managing your 3D assets.

Opening the converted scene in the Editor
Opening the converted scene in the Editor
Reminder

For the quickstart, your scene must be inside the Public folder. If you uploaded it elsewhere, simply move it into the Public folder so your web application can access it with the public token.

Moving the converted scene to the Public folder
Moving the converted scene to the Public folder

4. What Else You’ll Find in the Console

Beyond these basics, the Console is also where you will:

  • Invite collaborators to your project
  • Generate API keys for application development
  • Track and manage rendering sessions

At this point, you have a project, a public folder accessible via a public token, and a scene — enough to start building your first 3dverse web application.

Building Your First Application

Requirements

3dverse does not require installing a heavy engine or maintaining a complex toolchain. At its core, all you need is a browser — we recommend a Chromium-based browser such as Chrome, Edge, or Brave for the best experience.

To build applications, you will also need:

  • Node.js (LTS) or any npm-compatible stack — not strictly required to interact with 3dverse, but effectively the standard since the official Livelink SDK is distributed through npm and written in TypeScript.
  • A GitHub account — if you want to follow along and deploy your app using GitHub Pages.

Unlike traditional engines, there is no need for a powerful GPU or extra runtimes on your machine — all heavy processing runs in the cloud.


With your scene prepared in the Console, it’s time to build a web application that connects to it. You’ll scaffold a project, provide your scene details, run it locally, and then publish it to the web.

1. Scaffold the Web App

tip

Have these ready:

  • Scene UUID — visible in the Scene asset details in the Console.
  • Public token — can be found in your project's API Access page in the Console.

Open a terminal and run:

npx create-3dverse-app@latest my-first-app

Follow the CLI prompts.

2. Run Locally

Start the development server:

cd my-first-app
npm run dev

This launches the app on http://localhost:5173 (or similar). Open it in your browser to see your scene streamed live from the 3dverse renderer.

Running the 3dverse app locally
Running the app locally with your scene

3. Deploy to GitHub Pages

Push your project to a GitHub repository, then enable GitHub Pages in the repository settings. An easy way is to use a workflow that builds and publishes the dist/ folder.

Create .github/workflows/deploy.yml:

.github/workflows/deploy.yml
name: Deploy to GitHub Pages
on:
push:
branches: [main]
permissions:
contents: read
pages: write
id-token: write
jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout source
uses: actions/checkout@v4

- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: 22

- name: Install dependencies
run: npm install

- name: Build project
run: npm run build

- name: Upload build output
uses: actions/upload-pages-artifact@v3
with:
path: ./dist
deploy:
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
runs-on: ubuntu-latest
needs: build
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4

Commit and push. After it finishes, your app will be live at https://<username>.github.io/<repo>/.

info

With a browser, a scene in 3dverse, and a few commands, you’ve published your first cloud-rendered 3D app to the web.

Next Steps

In about twenty minutes, you’ve:

  • Understood the fundamentals of how 3dverse works.
  • Prepared a scene in the Console and made it accessible.
  • Scaffolded and ran your first application.
  • Deployed it to the web with GitHub Pages.

This is just the beginning. From here, good next steps are:

  • Explore the Console section to learn more about managing projects, assets, and collaborators.
  • Dive into Core Concepts for a deeper look at the architecture and design decisions.
  • Read the livelink.react overview to understand the React bindings used in your starter app.

With these resources, you can go from a first app to building richer, collaborative 3D experiences in the cloud.