feat(gltf): launch Animation Studio and curated expressive assets

examples/showcase/anari/playground.html

@@ -531,6 +531,7 @@
               <button id="reset-scene" class="tool-button">RESET</button>
               <button id="copy-scene" class="tool-button">COPY</button>
               <button id="export-gltf" class="tool-button">GLTF ↓</button>
+              <button id="export-glb" class="tool-button">GLB ↓</button>
               <button id="export-usd" class="tool-button">USD ↓</button>
               <label class="renderer-control">
                 <span>RENDERER</span>

examples/showcase/anari/playground.ts

@@ -160,6 +160,9 @@ export default class ANARIPlayground extends AnimationLoopTemplate {
     getRequiredElement('export-gltf', HTMLButtonElement).addEventListener('click', () => {
       void this.exportScene('gltf');
     });
+    getRequiredElement('export-glb', HTMLButtonElement).addEventListener('click', () => {
+      void this.exportScene('glb');
+    });
     getRequiredElement('export-usd', HTMLButtonElement).addEventListener('click', () => {
       void this.exportScene('usd');
     });
@@ -313,7 +316,7 @@ export default class ANARIPlayground extends AnimationLoopTemplate {
     }
   }
 
-  private async exportScene(format: 'gltf' | 'usd'): Promise<void> {
+  private async exportScene(format: 'gltf' | 'glb' | 'usd'): Promise<void> {
     try {
       const parsedScene: unknown = JSON.parse(this.editor.value);
       const validatedScene = ANARISceneSchema.safeParse(parsedScene);
@@ -324,15 +327,24 @@ export default class ANARIPlayground extends AnimationLoopTemplate {
       }
       setElementText('editor-feedback', 'Exporting ' + format.toUpperCase() + ' scene…');
       const scene = validatedScene.data as ANARIJSONScene;
-      const contents =
-        format === 'gltf'
-          ? await exportANARIJSONSceneToGLTF(scene)
-          : exportANARIJSONSceneToUSD(scene);
-      downloadTextFile(
-        contents,
-        makeExportFilename(scene.name, format === 'gltf' ? 'gltf' : 'usda'),
-        format === 'gltf' ? 'model/gltf+json' : 'model/vnd.usda'
-      );
+      if (format === 'glb') {
+        const binaryContents = await exportANARIJSONSceneToGLTF(scene, {binary: true});
+        downloadSceneFile(
+          binaryContents,
+          makeExportFilename(scene.name, 'glb'),
+          'model/gltf-binary'
+        );
+      } else {
+        const contents =
+          format === 'gltf'
+            ? await exportANARIJSONSceneToGLTF(scene)
+            : exportANARIJSONSceneToUSD(scene);
+        downloadSceneFile(
+          contents,
+          makeExportFilename(scene.name, format === 'gltf' ? 'gltf' : 'usda'),
+          format === 'gltf' ? 'model/gltf+json' : 'model/vnd.usda'
+        );
+      }
       setElementText('editor-feedback', format.toUpperCase() + ' scene downloaded');
     } catch (error) {
       const message = error instanceof Error ? error.message : String(error);
@@ -488,7 +500,11 @@ function makeExportFilename(name: string, extension: string): string {
   return (normalized || 'anari-scene') + '.' + extension;
 }
 
-function downloadTextFile(contents: string, filename: string, mimeType: string): void {
+function downloadSceneFile(
+  contents: string | ArrayBuffer,
+  filename: string,
+  mimeType: string
+): void {
   const url = URL.createObjectURL(new Blob([contents], {type: mimeType}));
   const link = document.createElement('a');
   link.href = url;

examples/showcase/anari/public/gltf/ASSET-LICENSE.md

@@ -6,8 +6,14 @@ These example assets are distributed under the Creative Commons Zero (CC0 1.0) p
 - `AnimatedMorphCube.glb` — Animated Morph Cube by Microsoft.
 - `AntiqueCamera.glb` — Antique Camera by Maximillan Kamps.
 - `Lantern.glb` — Lantern by sbtron and Frank Galligan.
+- `RobotExpressive.glb` — Robot Expressive by Tomás Laulhé, with facial morph targets and glTF conversion by Don McCurdy.
 - `SimpleSkin.gltf` — Simple Skin by Marco Hutter.
 - `ToyCar.glb` — Toy Car by Guido Odendahl and Eric Chadwick.
 
 The files originate from the Khronos Group glTF Sample Assets collection:
 https://github.com/KhronosGroup/glTF-Sample-Assets
+
+`RobotExpressive.glb` originates from the three.js sample collection at commit
+`24595fb65bb662ea1e70984bb18301af06637b07`. Its upstream documentation explicitly
+identifies the asset as CC0 1.0:
+https://github.com/mrdoob/three.js/blob/24595fb65bb662ea1e70984bb18301af06637b07/examples/models/gltf/RobotExpressive/README.md

examples/showcase/anari/usd-samples.ts

@@ -22,6 +22,24 @@ function resolveSceneAssetUrl(relativePath: string): string {
 }
 
 export const SCENE_SAMPLES: readonly SceneSample[] = [
+  {
+    identifier: 'gltf-expressive-robot',
+    label: 'glTF · Expressive Robot · 14 Animated Clips',
+    url: resolveSceneAssetUrl('./gltf/RobotExpressive.glb'),
+    format: 'gltf'
+  },
+  {
+    identifier: 'gltf-animated-morphs',
+    label: 'glTF · Animated Morph Targets',
+    url: resolveSceneAssetUrl('./gltf/AnimatedMorphCube.glb'),
+    format: 'gltf'
+  },
+  {
+    identifier: 'gltf-animated-skin',
+    label: 'glTF · Animated Skeleton',
+    url: resolveSceneAssetUrl('./gltf/SimpleSkin.gltf'),
+    format: 'gltf'
+  },
   {
     identifier: 'gltf-animated-colors',
     label: 'glTF · Animated Colors',