Open-Source-Landingpage Seijaku und acht Three.js-Skills für KI-Agenten

X-PostMeng ToSammlung

Meng To hat den Quellcode für Seijaku veröffentlicht, eine interaktive 3D-Landingpage für einen virtuellen Rundgang durch ein japanisches Haus. Neben dem Projekt stellt er acht modulare Three.js-Skills bereit, die KI-Agenten bei der Erstellung komplexer 3D-Szenen unterstützen sollen.

Das Wichtigste

  1. Die Landingpage Seijaku basiert auf Three.js und wurde mithilfe von Fable 5.1 sowie dem dream-loop-Skill umgesetzt.
  2. Der Code der Seite umfasst laut Meng To ohne Bilder unter 1 MB und bietet scrollbare Raumwechsel, Jahreszeitenwechsel, Koi-Fische in Wasser und Lichtstrahlen.
  3. Acht neue Skills für Three.js behandeln scrollgesteuerte Touren, Sky-Rays, Himmels-Hintergründe, fallende Blätter, Jahreszeiten, High-Resolution-Texturen, High-Poly-Modelle und Retina-Rendering.
  4. Der Ansatz hinter dream-loop lässt KI-Agenten ein Zielbild erzeugen, das 3D-Ergebnis mit einer Kritik-Instanz vergleichen und den Code schrittweise verfeinern.

Warum das relevant ist

3D-Webentwicklung erfordert bei der Arbeit mit generativen KI-Modellen oft präzise Führung. Durch die Bereitstellung strukturierter Skills für KI-Agenten lassen sich komplexe WebGL-Szenen wiederholbar erstellen und für Agenten-Workflows nutzbar machen.

Einordnung

Meng To zeigt, wie Agenten-Skills die Erstellung von Three.js-Websites vereinfachen können. Durch die Trennung von Zielbildgenerierung, visuellem Abgleich und iterativer Code-Anpassung (Dream-Loop) werden anspruchsvolle 3D-Effekte erreichbar. Die Bereitstellung als Skills statt nur als monolithisches Repository ermöglicht es Entwicklern und Coding-Agenten, gezielte Shader- und Render-Techniken modular wiederzuverwenden.

Original-Post

Meng To

@MengTo · 16. September 2026

I open-sourced this scrolling virtual-tour landing page, along with 8 new three.js skills. They cover room-to-room tours controlled by scrolling, sky rays, sky backgrounds, falling leaves, four seasons, high-resolution textures, high-poly models, and retina rendering. Live t.co/wkwwFcig4s t.co/P4BVZmrYWG

275 Likes12 Antworten260 Lesezeichen21.438 Aufrufe

Auf X ansehen
Weitere Posts im Thread (6)
  1. @eamin_ux 3d needs a ton of steering right now. so these skills should help.
  2. @Duy_ZzZz you can try on t.co/pzTjpCw8XH works quite well
  3. @islemonarch haha yea, everyone's running out of tokens these days
  4. @MujovicEldin have you tried it? works fine on my phone. you can improve perf with a prompt.
  5. @Navlio that's easily solved with html code.
  6. @1919Nooah i underestimate how useful the skills are for my agents. sometimes i just forget about them and my agents pick them up.
Ausgewählte Antworten (5)
  • @MujovicEldin @MengTo It’s not sustainable, it doesn’t work on most of devices. It’s slow and eats a lot of memory. Anyway it looks really good.
  • @Navlio @MengTo worth a line in the readme for anyone shipping this as an actual landing page: it's all canvas, so a crawler and an assistant both arrive at a page with no words in it the pitch still needs to exist as real text somewhere down the page
  • @1919Nooah @MengTo Packaging it as skills instead of just a repo is the part people will actually use. Most open source drops leave you to reverse-engineer the "how", you shipped the "how" directly.
  • @eamin_ux @MengTo Visual detail needs clear purpose
  • @islemonarch @MengTo Oh i’m waiting for my reset to give this a try, thanks for sharing Meng.

Erwähnte Links

Links und Tools aus diesem Beitrag

Zusammenfassung von KI erstellt (Gemini 3.8 Flash, 27. September 2026). Sie kann Fehler enthalten – maßgeblich ist die Originalquelle.

Ähnliche Einträge

Inhaltlich ähnlich, ermittelt über die KI-Suche.

  • Repository:achimala/dream-loop

    dream-loop: Agent-Skill für 3D-Szenen mit iterativer Bildkritik

    dream-loop ist ein Open-Source-Agent-Skill von Anshu Sharma (@anshuc), der visuelle 3D-Szenen, Spiele oder Web-Apps über eine geschlossene Feedback-Schleife generiert. Ein Bildmodell erzeugt zunächst eine Zielgrafik, während ein separater AI-Kritiker das laufende Ergebnis visuell mit der Vorgabe abgleicht und Korrekturen anstößt.

    1532SterneJavaScript

    KI & AI· Tool

  • Repository:MengTo/Skills

    Agent Skills: Wiederverwendbare Playbooks für KI-Coding-Agenten

    Das GitHub-Repository MengTo/Skills bündelt strukturierte Anleitungen und Prompts ('Agent Skills') im Markdown-Format. Es richtet sich an Designer und Entwickler, die Coding-Agenten wie Codex, Claude oder Cursor für Webdesign, Interaktionen und 3D-Szenen einsetzen.

    6243SterneHTML

    KI & AI· Sammlung

  • Repository:MengTo/seijaku

    Seijaku: Interaktiver 3D-Rundgang durch ein Kyoto-Anwesen mit Three.js

    Seijaku ist eine interaktive Web-Demo von Meng To, die einen nahtlosen, scrollbasierten Rundgang durch ein virtuelles traditionelles Kyoto-Haus bietet. Die Anwendung kombiniert prozedurale 3D-Architektur, Web Audio und interaktive Materialstudien ohne separaten Build-Schritt.

    32SterneHTML

    Webentwicklung· Demo

  • Repository:oso95/scroll-world

    scroll-world: Agent-Skill für nahtlose 3D-Scroll-Landingpages

    scroll-world ist ein Agent-Skill für Claude Code, Codex und SKILL.md-kompatible Tools. Das Werkzeug erstellt Landingpages mit nahtlosen Kameraflügen durch KI-generierte Szenen beim Scrollen.

    8963SterneJavaScript

    KI & AI· Tool

Zurück zur Wissensbasis

Lassen Sie uns über Ihr Projekt sprechen

Kontakt aufnehmen

Standorte

  • Mattersburg
    Johann Nepomuk Bergerstraße 7/2/14
    7210 Mattersburg, Austria
  • Wien
    Ungargasse 64-66/3/404
    1030 Wien, Austria

Dieser Inhalt wurde teilweise mithilfe von KI erstellt.