wtf is threejsgnm?

ademola-lou/threejsgnm — explained in plain English

Analysis updated 2026-05-18

★ 28PythonAudience · developerComplexity · 3/5LicenseSetup · moderate

Mindmap

mindmap
  root((ThreejsGNM))
    What it does
      Ports GNM head model
      Runs fully in browser
      Renders with Three.js
    Tech stack
      TypeScript
      Three.js
      Vite
      TensorFlow.js
    Use cases
      Avatar editing
      Expression blending
      Preset export import
    Setup
      Node.js 20 required
      53 MB model download
      Python only for asset prep
    Audience
      3D developers
      Researchers

mindmap root((ThreejsGNM)) What it does Ports GNM head model Runs fully in browser Renders with Three.js Tech stack TypeScript Three.js Vite TensorFlow.js Use cases Avatar editing Expression blending Preset export import Setup Node.js 20 required 53 MB model download Python only for asset prep Audience 3D developers Researchers

Why would anyone build with this?

REASON 1

Build a browser-based 3D avatar editor without running any backend server.

REASON 2

Experiment with identity and expression blending for character or research work.

REASON 3

Export edited head presets as JSON to use in a matching Blender workflow.

REASON 4

Study how a Blender-based head model can be ported to run entirely client-side.

What's in the stack?

TypeScriptThree.jsViteTensorFlow.jsNode.js

How it stacks up

	ademola-lou/threejsgnm	alicankiraz1/codexqb	amirmushichge/vibemotion
Stars	28	28	28
Language	Python	Python	Python
Setup difficulty	moderate	easy	moderate
Complexity	3/5	3/5	3/5
Audience	developer	developer	designer

Figures from each repo's GitHub metadata at analysis time.

How do you spin it up?

Difficulty · moderate Time to first run · 30min

Requires Node.js 20+ and a 53 MB model download, regenerating assets needs Python, numpy, and h5py.

The app's own code has no stated license here, but the bundled Google model assets keep their original Apache 2.0 license, which allows free use with attribution.

Wtf does this do

ThreejsGNM is a browser based tool for editing a 3D human head model. It is a TypeScript rebuild of Google's GNM v3 head model and its reference editor, which normally runs inside Blender. Here, all the math for shaping identity, facial expression, pose, and skin deformation happens directly in the browser, and the result is rendered with the Three.js graphics library, so no server or backend application is needed to view or edit a head. To run it locally you need Node.js version 20 or newer. After installing dependencies you start a local development server with a single command, and the app opens at a local address in your browser. There is also a test command, a build command for producing a production version, and a preview command for viewing that production build. The finished files can be hosted on any static file server since there is no backend logic involved. The first time the app loads, it downloads a 53 megabyte data file containing the head model, then decompresses it, so a desktop browser with WebGL support is recommended for enough graphics memory. These official model files keep Google's original Apache 2.0 license and attribution. If you want to regenerate these files yourself rather than using the ones included, you would need Python along with the numpy and h5py libraries, but this is only needed for that one preparation step, not for running or building the actual web app. Features include full control over hundreds of identity and expression parameters, randomized sampling across expression categories, blending between identity and expression, mirrored eye expressions, separate controls for neck, head, and eye pose, and the official head shape data with textures and materials. You can save named presets in the browser and import or export them as JSON files compatible with the Blender version. The README notes that the underlying GNM model has known representation limitations from its training data, and recommends reviewing the original Google project before using any demographic related controls in a real product or research study.

Yoink these prompts

Prompt 1

Walk me through installing Node.js dependencies and starting the local dev server for this Three.js head editor.

Prompt 2

Explain how the identity and expression blending works in this project so I can add my own preset.

Prompt 3

Help me set up the Python asset preparation step to regenerate the GNM model files from scratch.

Prompt 4

Show me how to export a head preset as JSON in a format compatible with the Blender GNM editor.

Frequently asked questions