How lumsrouge/texture-studio works
Texture Studio is a browser tool for creating tileable PBR textures. The main workflow is: the user submits a description, then either Gemini returns an albedo image for photo-to-PBR derivation or Claude/presets produce a procedural recipe. WebGL generates six maps, sliders re-render them locally, and the maps feed a Three.js preview or PNG ZIP export. The graph also preserves image import, iterative editing, settings, history, and seamlessness inspection. Some UI wiring is inferred only where README behavior and sampled imports support it.
Components 19
User Experience
- App Orchestrator
src/main.ts - Prompt and History
src/ui/promptPanel.ts - API Settings
src/ui/settings.ts - Slider Panel
src/ui/slidersPanel.ts
Generation Modes
- Recipe Schema
src/recipe/schema.ts - Offline Presets
src/recipe/presets.ts - Gemini Images
src/ai/gemini.ts - Claude Recipes
src/ai/claude.ts - Recipe Sliders
src/recipe/recipeSliders.ts
Texture Engines
- WebGL Pipeline
src/engine/generator.ts - GLSL Shaders
src/engine/shaders.ts - Photo PBR Deriver
src/engine/photoToPbr.ts - Procedural Renderer
src/engine/generator.ts
Preview and Export
- Maps Panel
src/ui/mapsPanel.ts - 3D PBR Viewport
src/ui/viewport.ts - PNG ZIP Exporter
src/ui/exporter.ts
Other components
- Texture Artist
- Gemini API
- Anthropic API
Connections 23
- Texture Artist → Prompt and History: enters prompt
- Prompt and History → App Orchestrator: dispatches action
- Texture Artist → App Orchestrator: imports image
- App Orchestrator → API Settings: reads keys
- App Orchestrator → Gemini Images: generates or edits
- Gemini Images → Gemini API: calls REST
- App Orchestrator → Claude Recipes: requests recipe
- Claude Recipes → Anthropic API: calls SDK
- App Orchestrator → Offline Presets: falls back
- Claude Recipes → Recipe Schema: sanitizes recipe
- Offline Presets → Recipe Schema: builds recipe
- App Orchestrator → Recipe Sliders: builds controls
- App Orchestrator → Slider Panel: renders controls
- App Orchestrator → Procedural Renderer: renders recipe
- App Orchestrator → Photo PBR Deriver: derives maps
- Photo PBR Deriver → WebGL Pipeline: uses pipeline
- Procedural Renderer → WebGL Pipeline: uses pipeline
- WebGL Pipeline → GLSL Shaders: executes GLSL
- Photo PBR Deriver → GLSL Shaders: executes GLSL
- App Orchestrator → Maps Panel: updates maps
- App Orchestrator → 3D PBR Viewport: updates preview
- App Orchestrator → PNG ZIP Exporter: exports maps
- App Orchestrator → Prompt and History: records history