[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-1227":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":15,"stars7d":17,"stars30d":18,"stars90d":16,"forks30d":16,"starsTrendScore":19,"compositeScore":20,"rankGlobal":10,"rankLanguage":10,"license":21,"archived":22,"fork":22,"defaultBranch":23,"hasWiki":24,"hasPages":22,"topics":25,"createdAt":10,"pushedAt":10,"updatedAt":26,"readmeContent":27,"aiSummary":28,"trendingCount":16,"starSnapshotCount":16,"syncStatus":29,"lastSyncTime":30,"discoverSource":31},1227,"stretchystudio","MangoLion\u002Fstretchystudio","MangoLion","FOSS 2D animation tool for turning static illustrations into mesh-deformable characters","https:\u002F\u002Fstretchy.studio",null,"JavaScript",352,48,5,4,0,7,50,12,5.07,"MIT License",false,"master",true,[],"2026-06-12 02:00:24","# 🧬 Stretchy Studio\n\n**The fastest way to rig and animate \"See-Through\" SOTA character models.**\n\nStretchy Studio is a high-performance 2D animation tool designed to turn static layers into expressive, mesh-deformed animations. We are built specifically to bridge the gap between AI-driven layer decomposition (like the **See-Through** SOTA model) and professional-grade animation.\n\nUnlike traditional bone-based systems, Stretchy Studio combines **AI-powered auto-rigging** with a **timeline-first, direct-deformation workflow**. Letting you go from a flat PSD to a fully rigged character in seconds.\n\n[🚀 Launch the Editor](https:\u002F\u002Feditor.stretchy.studio) | [💬 Join the Discord](https:\u002F\u002Fdiscord.com\u002Finvite\u002FzB6TrHTwAb) | [🌐 Visit the Website](https:\u002F\u002Fstretchy.studio)\n\n---\n\n## ✨ Key Highlights\n\n### 📂 Native \"See-Through\" Support\nOptimized for characters generated via SOTA layer decomposition models like **See-Through**. Import your segmented PSDs and let Stretchy Studio handle the complex occlusions, depth layering, and mesh generation automatically.\n\n---\n\n## 🧩 The See-Through Pipeline\n\nStretchy Studio is designed to be an animation engine for the [**See-Through**](https:\u002F\u002Fgithub.com\u002Fshitagaki-lab\u002Fsee-through) model. While traditional 2D animation requires manual layering and inpainting, See-Through automates this process using a single static illustration.\n\n### What is See-Through?\nSee-Through is a SOTA framework that transforms a single anime illustration into a manipulatable character model by decomposing it into fully inpainted, semantically distinct body-part layers.\n\n- **Official Repository**: [shitagaki-lab\u002Fsee-through](https:\u002F\u002Fgithub.com\u002Fshitagaki-lab\u002Fsee-through)\n- **Academic Paper**: [\"See-through: Single-image Layer Decomposition for Anime Characters\"](https:\u002F\u002Farxiv.org\u002Fabs\u002F2602.03749)\n\n### How to get decomposed PSDs\n**Quick Start (Recommended)**: Use the [**Free Hugging Face Demo**](https:\u002F\u002Fhuggingface.co\u002Fspaces\u002F24yearsold\u002Fsee-through-demo) to quickly run the model on your character.\n\n> See-Through is specifically trained on **anime and VTuber-style** illustrations. Realistic or non-anime styles may not decompose correctly.\n\n### 📐 Magic Auto-Rigging\nRigging doesn't have to be a chore. Use **AI-powered pose detection** (DWPose) to automatically generate a skeleton for your character, or use our instant \"heuristic\" method to get moving in seconds.\n\n### 🎬 Organic \"Stretchy\" Motion\nDon't just rotate layers—warp them! Animate individual mesh vertices to create organic, fluid motion. Perfect for breathing effects, flowing hair, and those subtle \"Live2D-style\" micro-expressions.\n\n### 🔦 Some other features you may like\n- **Automatic Eye Clipping**: Irises stay perfectly contained within the eyes—no complex masking required.\n- **Realistic Limb Bending**: Built-in vertex skinning for arms and legs so they bend exactly how they should.\n- **Blender-Style Shape Keys**: Create complex deformations (like smiles or blinks) once and blend them anyway you like via influence sliders.\n- **Synced Audio Tracks**: Layer background music and SFX directly in the timeline. Trim, position, and sync audio clips with your animations for a complete multimedia experience.\n- **Spine 4.0 Export**: Export your rigs and animations directly to Spine JSON format for use in game engines and professional production pipelines.\n\n---\n\n## 🚀 Quick Start\n\n1. **Open the App**: Head to [editor.stretchy.studio](https:\u002F\u002Feditor.stretchy.studio).\n2. **Drop your Art**: Drag a `.stretch` project, PSD, or PNG file into the workspace.\n3. **Auto-Rig**: Follow the streamlined setup wizard to map layers and establish your character skeleton.\n4. **Animate**: Switch to **Animation mode** and start creating keyframes!\n\n---\n\n## 🎨 Workflow Examples\n\n### Static Character\n1. **Import**: Drag a PSD into the editor viewport.\n2. **Organize**: Use the Groups tab to parent layers and adjust pivot points.\n3. **Mesh**: Click \"Generate Mesh\" on any part to enable organic warping.\n4. **Animate**: Switch to **Animation** mode, create a clip, and start keyframing!\n\n### SOTA Workflow (e.g., See-Through)\n1. **Import**: Drag your decomposed \"See-Through\" PSD into the editor.\n2. **Auto-Rig**: Launch the Rigging Wizard. Stretchy Studio uses AI to map your layers to a skeletal structure instantly.\n3. **Refine**: Adjust joint positions and mesh density to handle occluded areas (like hair behind the neck).\n4. **Animate**: Create fluid, multi-layered animations that take full advantage of the \"See-Through\" depth data.\n\n---\n\n## 🛠 For Developers\n\n## 🏗 Project Structure\n\n```bash\nsrc\u002F\n├── app\u002Flayout\u002F          # 4-zone UI layout (Canvas, Layers, Inspector, Timeline)\n├── components\u002F\n│   ├── canvas\u002F          # WebGL Viewport, Gizmos, and Picking logic\n│   ├── layers\u002F          # Hierarchical draw order and grouping management\n│   ├── inspector\u002F       # Node properties and mesh generation controls\n│   └── timeline\u002F        # Playhead, Keyframe tracks, and Animation CRUD\n├── renderer\u002F\n│   ├── transforms.js    # Matrix math & world matrix composition\n│   ├── scenePass.js     # Hierarchical draw-order rendering\n│   └── partRenderer.js  # GPU buffer management (VAO\u002FEBO)\n├── store\u002F\n│   ├── projectStore.js  # Scene tree and persistent node state\n│   ├── animationStore.js # Playback state, interpolation, and pose overrides\n│   └── editorStore.js   # UI state, selection, and viewport settings\n├── mesh\u002F                # Auto-triangulation and mesh editing algorithms\n└── io\u002F                  # PSD parsing and export utilities\n```\n\n### Prerequisites\n- [Node.js](https:\u002F\u002Fnodejs.org\u002F) (v18+)\n- [pnpm](https:\u002F\u002Fpnpm.io\u002F) (Recommended)\n\n### Setup\n```bash\n# Install dependencies\npnpm install\n\n# Run the development server\npnpm dev\n```\nOpen `http:\u002F\u002Flocalhost:5173` to view the app locally.\n\n---\n\n## 💬 Community & Support\n\nJoin our [Discord](https:\u002F\u002Fdiscord.com\u002Finvite\u002FzB6TrHTwAb) to share your animations, get help, or suggest new features!\n\n---\n\n## 📜 License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n","Stretchy Studio 是一款用于将静态插图转换为可变形角色的2D动画工具。其核心功能包括AI驱动的自动绑定和直接变形工作流，支持“See-Through”模型生成的角色分解层的原生导入，并能自动生成复杂的遮挡、深度分层和网格。项目采用JavaScript开发，通过结合AI技术与时间轴优先的工作流程，使得从平面PSD到完全绑定的角色仅需几秒钟即可完成。此外，它还提供了自动眼珠剪辑、真实的肢体弯曲效果以及类似Blender的形状键等功能，特别适合于需要快速创建生动且富有表现力的2D动画场景，尤其是针对动漫或VTuber风格的角色设计。",2,"2026-06-11 02:42:27","CREATED_QUERY"]