Create a high-fidelity desktop SaaS interface for **Salvor.ai Studio**, an advan...

Create a high-fidelity desktop SaaS interface for **Salvor.ai Studio**, an advanced AI visual creation and asset-generation environment. Use the attached screenshots as inspiration and retain the **dark, premium aesthetic**, but redesign the layout to feel spacious, calm, and professional despite its advanced capabilities. The key UX improvement is **progressive disclosure**: do not show every control at once. Advanced parameters should appear only when the relevant stage is active. The product should feel like: **AI image generator + character editor + art-direction workstation + game/TTRPG asset studio.** Core idea: **“Build the exact character, world, and visual you want.”** ## VISUAL STYLE Use: * Deep charcoal/navy background * Graphite panels * Subtle borders * Indigo, violet, blue, and amber accents * Soft glow for active controls * Generous spacing * Clear typography * High-quality imagery * 8–12px rounded panels Keep it advanced, but avoid the cramped feeling of a technical dashboard. The interface should feel closer to **Photoshop + modern AI generation + character creator** than developer software. ## TOP BAR Left: **Salvor.ai STUDIO** Project: **Untitled Character / Scene** Center: **Identity · Anatomy · World · Style · Composition · Output** Right: **Undo · Redo · Save · Versions · Export** Include an **Advanced Mode** indicator. ## LEFT — PROJECT ASSETS Keep this panel narrow and collapsible. ### Project Assets **Subjects** Person · Pet · Creature · Character · Object · Product **References** Image · Style · Environment · Pose **Generated** Characters · Creatures · Props · Environments · Variations Show compact thumbnails and labels such as: **Human · Identity Locked** **Dog · Features Preserved** Include **＋ Add Subject**. Allow the entire left panel to collapse into an icon rail when more canvas space is needed. ## CENTER — CREATIVE CANVAS Make the canvas dominant. Show a large generated character or scene with optional overlays: * Anatomy landmarks * Face landmarks * Pose skeleton * Perspective guides * Composition guides * Subject masks Toolbar: **Select · Move · Pose · Mask · Transform · Reference · Compare** Canvas modes: **Preview · Split Compare · Before/After** The canvas should have substantial breathing room around it. ## BOTTOM — ADAPTIVE CREATIVE PIPELINE This is the most important layout change. Instead of displaying all stage parameters simultaneously, create a **horizontal pipeline of compact stages** along the bottom: **01 Subject → 02 Anatomy → 03 Era → 04 Environment → 05 Style → 06 Pose → 07 Camera → 08 Output** Each stage is represented by a compact card showing its current summary, for example: **01 Subject** Human · Identity Locked **02 Anatomy** Athletic · 15% Transform **03 Era** Renaissance + Cyberpunk Only the **active stage expands**. When the user clicks **02 Anatomy**, the bottom panel smoothly expands upward and displays the anatomy controls. All other stages remain collapsed to their summary cards. When the user selects **03 Era**, the anatomy panel collapses and the Era controls replace it. This creates a clean **one-stage-at-a-time editing experience**. Include a small collapse button so the entire pipeline can shrink to a thin navigation strip, giving the canvas maximum space. The inactive stages should retain their settings as compact summaries so users can understand the whole creative recipe without seeing every control. ## ACTIVE STAGE: SUBJECT When active, show: **Upload Subject · Identity Strength · Face Preservation · Body Preservation · Pet Features · Reference Weighting** Support multiple subjects. ## ACTIVE STAGE: ANATOMY Show organized controls: **Body** Height · Proportions · Shoulders · Torso · Legs · Muscle · Body Mass **Face** Face Shape · Jaw · Cheekbones · Nose · Eyes · Brow · Mouth · Ears **Stylization** Realistic · Idealized · Exaggerated · Cartoon · Caricature · Creature Include: **Preserve Identity ←→ Transform** Caricature should naturally result from exaggerated anatomy rather than being treated as a separate feature. ## ACTIVE STAGE: ERA Create a visual historical timeline: **Prehistoric → Ancient → Medieval → Renaissance → Industrial → Victorian → 1920s → Mid-Century → 1980s → Modern → Future** Allow era mixing: **Renaissance 70% + Cyberpunk 30%** Also allow combinations such as: **1920s Architecture + 1980s Fashion + Futuristic Technology** Use visual sliders and thumbnail presets rather than dense forms. ## ACTIVE STAGE: ENVIRONMENT Controls: **Location · Weather · Time · Season · Atmosphere · Terrain · Architecture · Technology · Culture · Props** Allow users to build an entire world around the subject. ## ACTIVE STAGE: STYLE Categories: **Photography:** Editorial, Cinematic, Studio, Documentary, Vintage **Traditional:** Oil, Watercolor, Charcoal, Ink, Gouache **Illustration:** Comic, Graphic Novel, Concept Art, Anime, Storybook **Digital:** 3D, Game Art, Matte Painting, Pixel Art, Stylized Character **Historical:** Renaissance, Baroque, Impressionism, Art Nouveau, Art Deco Allow blending such as: **Renaissance Painting 60% + Cinematic Photography 40%** ## ACTIVE STAGE: POSE Controls: * Pose * Gesture * Body orientation * Hands * Head direction * Gaze * Expression * Action Allow pose-reference uploads and an optional **Pose Skeleton**. ## ACTIVE STAGE: CAMERA Controls: **Framing:** Close-up · Portrait · Half Body · Full Body · Wide Scene

**Camera:** Focal Length · Height · Perspective · Depth of Field **Composition:** Rule of Thirds · Centered · Dynamic · Symmetrical · Cinematic ## RIGHT — CONTEXTUAL INSPECTOR Keep the right inspector compact and **context-sensitive**. Instead of showing every property category simultaneously, display controls relevant to the currently selected object or active stage. Tabs: **Properties · References · Layers · Prompt** For example, selecting a character shows Identity and Anatomy. Selecting the environment shows World and Lighting. Selecting the camera shows Lens and Composition. This prevents the inspector from becoming another wall of controls. Include **Lock Attribute** controls to preserve important characteristics between generations. ## STRUCTURED PROMPT Place an expandable prompt drawer below the top bar or inside the inspector. Show the AI interpretation as structured components: **SUBJECT** — Identity-preserved character **ANATOMY** — Athletic proportions **ERA** — Renaissance + futuristic technology **STYLE** — Oil painting + cinematic lighting **ENVIRONMENT** — Grand palace **CAMERA** — 85mm portrait Allow individual components to be edited or locked. ## VARIATIONS Provide a compact variation control near Generate: **4 · 8 · 16** Variation axes: **Identity · Anatomy · Era · Style · Pose · Environment · Composition** Do not permanently display the full variation system; open it as a popover or drawer when requested. ## GAME / TTRPG MODE Include a production-oriented Output preset: ### Game & TTRPG Assets **Character Portrait · Character Sheet · Token · Full Body · NPC · Monster · Creature · Item · Prop · Spell Art · Environment · Card Art** Outputs: **1:1 Token · Portrait · Full Body · Transparent Cutout** Options: **Transparent Background · Generate Variations · Generate Asset Pack** An asset pack could create a consistent portrait, full-body character, token, and alternate poses. ## MULTI-SUBJECT Support: **Subject 01 — Human** **Subject 02 — Dog** **Subject 03 — Dragon** Each subject should be independently selectable and editable. ## OUTPUT The final stage should provide: **Generate** Modes: **Single Image · Variations · Character Sheet · Asset Pack** Formats: **PNG · JPG · Transparent PNG** Presets: **Social · Print · Game Asset · TTRPG · Concept Art** ## RESPONSIVE WORKSPACE BEHAVIOR The interface should intelligently manage space.