Skills
.Work. You
Rest

vtj-ui-integration

Community

Seamless Vue UI and Three.js integration.

Software Engineering#architecture#vue#three.js#event-bus#hud#ui-integration
AuthorhexianWeb
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill standardizes how Vue UI components communicate with a Three.js scene, preserving architectural boundaries between UI and rendering logic to avoid tight coupling.

Core Features & Use Cases

  • Layered architecture with a strict separation between Vue UI (HUD, menus) and Three.js scene management.
  • Event-driven communication using an event bus (mitt) and a shared state store (Pinia) to synchronize UI state with 3D scene state.
  • UI-to-scene and scene-to-UI interactions: trigger 3D actions from UI and reflect 3D state changes in the UI without direct manipulation of 3D objects.

Quick Start

Start by creating a Vue UI component that emits an event (for example, to pause the game) and implement a corresponding listener in the Three.js layer that handles the event to pause or resume the scene.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: vtj-ui-integration
Download link: https://github.com/hexianWeb/Third-Person-MC/archive/main.zip#vtj-ui-integration

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.