# Tesseract, an interactive audiovisual piece.

**URL:** <https://discourse.threejs.org/t/tesseract-an-interactive-audiovisual-piece/94996>\
**Category:** Showcase\
**Tags:** web-audio, tsl, procedural, webgpu\
**Created:** [October 4, 2026, 7:53am UTC](https://discourse.threejs.org/t/tesseract-an-interactive-audiovisual-piece/94996 "2026-10-04T07:53:30Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![\_postminimal](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/_postminimal/32/73143_2.png) [@\_postminimal](https://discourse.threejs.org/u/_postminimal)\
**Post date:** [October 4, 2026, 7:53am UTC](https://discourse.threejs.org/t/tesseract-an-interactive-audiovisual-piece/94996/1 "2026-10-04T07:53:30Z")

</div>

A tesseract unfolds into a small universe on the surface of a 4d sphere.

 ![hero](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/f/0/f02b8d51f4ca835dc4969e1b007837dd324e9734.webp)

drag to turn it, scroll to travel the 4th dimention, tap to send a signal that comes back around the sphere, hold to slow time.

**URL:** [https://tesseract.postminimal.agency](https://tesseract.postminimal.agency/)

rendered in WebGPU with three.js TSL, all sound is synthesized live with Web Audio.

---

<div class="post-metadata">

**Author:** ![jonas\_javier](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jonas_javier/32/73067_2.png) [@jonas\_javier](https://discourse.threejs.org/u/jonas_javier)\
**Post date:** [October 4, 2026, 2:57pm UTC](https://discourse.threejs.org/t/tesseract-an-interactive-audiovisual-piece/94996/2 "2026-10-04T14:57:33Z")

</div>

Putting it on the surface of a 4D sphere is a lovely twist. I drew a tesseract recently too, but much more literally: rotate in 4D, then a perspective projection from W (a camera at W = 1.65), so the “cube inside a cube” is just the far cell looking smaller.

Mapping scroll to the fourth dimension is a great way to make it tangible. Is scrolling a translation along W, or a rotation in one of the planes that involve W (XW/YW/ZW)?

---

<div class="post-metadata">

**Author:** ![\_postminimal](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/_postminimal/32/73143_2.png) [@\_postminimal](https://discourse.threejs.org/u/_postminimal)\
**Post date:** [October 4, 2026, 8:10pm UTC](https://discourse.threejs.org/t/tesseract-an-interactive-audiovisual-piece/94996/3 "2026-10-04T20:10:42Z")

</div>

Thanks Jonas, this is lovely  
to answer your question, it is a rotation, all movements are rotations

- mouse drag rotates in XW, YW planes
- scroll rotates in ZW plane
- shift + mouse drag is a regular 3D rotation

the universe is a surface of a 4D ball, so rotating is how you travel, scrolling feels like going forward but the universe is turning back to you