Muse Creator Studio

Visual-first video creation with AI-generated code for educational content

Overview

Muse Creator Studio transforms video creation from a code-first programming discipline into a visual-first creative experience. Drag, drop, and compose professional educational videos on an intuitive canvas—while AI automatically generates production-ready TypeScript code in the background.

Phase 1: Extension Foundation ✅

Status: Complete (2.5 iterations)

Components Implemented:

• VS Code extension scaffolding
• Canvas-focused webview infrastructure
• Project creation and management
• Security-first architecture (crypto.randomBytes for nonces, 0o700 permissions)

Project Structure

muse-creator-studio/
├── src/
│   ├── extension.ts                    # Extension entry point
│   ├── commands/
│   │   └── CanvasCommands.ts          # Command registry
│   ├── webview/
│   │   ├── CanvasWebviewManager.ts    # Canvas webview manager
│   │   └── MessageHandler.ts          # Message handler
│   └── project/
│       └── ProjectManager.ts          # Project management
├── package.json                        # Extension manifest
├── tsconfig.json                       # TypeScript config
└── webpack.config.js                   # Build config

Commands

• Muse Creator: Open Canvas - Open visual canvas workspace
• Muse Creator: New Project - Create new video project

Next Phase

Phase 2: Visual Canvas & WebView (3 iterations)

• Full-screen 1920x1080 canvas
• Drag-and-drop system
• Canvas state management

Development

npm install
npm run compile

License

ISC