Use the reference image only as high-level inspiration for composition, informat...

Use the reference image only as high-level inspiration for composition, information architecture, interaction design, and overall visual quality. Do not copy the layout exactly. Design a next-generation professional creative application for AI image generation called Visual Prompt Compiler. The interface should resemble high-end industrial design and tactile modular hardware (e.g., Teenage Engineering interfaces, Dieter Rams' electronics, or physical mixing consoles) rather than a traditional digital dashboard. The design uses a hyper-material tactile aesthetic with matte oxidized slate backgrounds, brushed aluminum-style panels, sharp high-contrast borders, raw exposed grid lines, minimal technical Grotesk typography, and a high signal-to-noise ratio. Every component should have a clear purpose with exceptional visual hierarchy. The application is organized into three primary workspaces. ### Left Panel — Creative Preset Library A polished asset browser containing curated one-click creative presets displayed in a clean two-column grid. Presets represent creative intent, not prompts. Examples include: * Portrait Studio * Character Design * Product Photography * Editorial Fashion * Cinematic Poster * Environment Concept * Fantasy Character * T-Shirt Design * YouTube Thumbnail Each card contains: * high-quality thumbnail * subtle hover animation * category iconography * lightweight metadata * precision-milled edges The library feels curated rather than cluttered. ### Center Panel — Creative Reasoning Engine The center workspace is the heart of the application. Instead of feeling like a form, it feels like an intelligent semantic composition engine. Possible titles include: * Creative Reasoning * Semantic Composer * Visual Reasoning * Scene Assembly Engine The workspace is organized as a vertical semantic pipeline. Unlike a traditional prompt builder, the first stage combines Creative Direction and Scene into a single semantic decision. Pipeline stages: 1. Creative Direction + Scene 2. Subject 3. Cinematography 4. Camera 5. Lighting 6. Style & Rendering 7. Final Look The first stage is the primary creative decision where artistic intent and environment are paired together. Examples: * Epic Landscape + Sunset * Cyberpunk Alley + Rain * Luxury Studio + Minimal * Medieval Castle + Golden Hour * Neon City + Night * Cozy Cabin + Snow Instead of selecting a scene independently, the environment naturally complements the selected creative direction. This paired stage contains: * environment thumbnail * creative intent chips * semantic scene chips * expandable advanced controls The remaining stages progressively refine the generated image. Examples: **Subject** * character bust preview * identity chips * demographic selections **Cinematography** * framing visualization * rule-of-thirds guides * composition presets **Camera** * lens illustration * focal length * aperture * sensor format **Lighting** * lighting diagram * key light direction * golden hour * rim light * contrast controls **Style & Rendering** * rendering material sphere * cinematic * photorealistic * painterly * anime * stylized **Final Look** * before/after comparison * color grading * mood * warmth * contrast * finishing treatments Each stage has a visually distinct identity rather than identical cards. Every stage contains: * semantic chips * segmented controls * dropdown selectors * expandable advanced settings * contextual visual previews No traditional text prompt editor is visible. The selected "Subject" stage activates with a sharp, LED-like pin-light indicator. **Relationship Intelligence** Each stage contains a dedicated Relationship Intelligence section. Instead of generic recommendations, it explains why semantic choices work together. Examples: * Sunset enhances mood and depth while reinforcing the epic landscape. * Athletic subjects maintain stronger silhouettes in heroic wide compositions. * 35mm produces a more natural perspective at the current subject distance. * Back lighting complements the selected sunset environment. Changing one stage intelligently updates related stages. Examples: Changing **Creative Direction + Scene** subtly updates: * Lighting * Camera * Final Look Changing **Subject** updates: * Camera * Composition * Pose Changing **Camera** updates: * Subject framing * Lighting recommendations * Final Look Affected stages briefly pulse with mechanical dependency indicators, reinforcing that semantic relationships have been recalculated. The interface feels alive, intelligent, and interconnected rather than static. At the bottom of the workspace is a large, tactile Creative Freedom slider balancing: Precision ←────────────→ Creativity ### Right Panel — Semantic Subject Editor The right panel is a dedicated Semantic Subject Editor. At the top is a segmented, hardware-style toggle: * Subject Properties * Compiled Prompt Subject Properties is selected by default. **Interactive 3D Preview** A clean wireframe human mannequin appears inside a professional viewport. The mannequin is neutral, unclothed, and displays only: * body proportions * pose * camera framing * spatial placement No hairstyle, clothing, accessories, or facial detail. The viewport includes: * orbit controls * zoom * pan * transform gizmos * perspective selector The mannequin feels interactive rather than decorative. **Semantic Attribute Groups** Properties are organized into elegant collapsible sections. * **Identity:** Gender, Age, Height, Build, Body Type * **Pose & Expression:** Pose, Head Rotation, Eye Direction, Facial Expression, Hand Position, Weight Distribution * **Composition:** Camera Facing Direction, Character Scale, Distance From Camera, Silhouette * **Appearance:** Physical Features Controls use refined: * segmented mechanical buttons * knob-style sliders * dropdowns * semantic chips Whenever a property changes, the Subject stage within the Creative Reasoning pipeline softly clicks and pulses, visually reinforcing the semantic relationship between the editor and the reasoning engine. **Compiled Prompt** Switching to Compiled Prompt replaces the property editor with a beautifully formatted semantic document generated from the reasoning graph. Instead of a plain text box, the compiled prompt features: * syntax highlighting * semantic grouping * collapsible sections * copy button * export controls The prompt appears as a structured specification assembled from every reasoning stage. **Generate Section** Anchor a large, tactile Generate Image button across the entire bottom of the right panel. Use a high-visibility industrial safety orange with a mechanical, physical-button styling. Above the button display a compact semantic readiness panel. Example: > Semantic Quality: 97% > No relationship conflicts detected > 2 AI recommendations available This reinforces confidence before generation. ### Visual Language Assign distinct industrial accent colors to each semantic stage. Example: * Creative Direction + Scene → Signal Green * Subject → Anodized Crimson * Cinematography → Cobalt Blue * Camera → Chartreuse * Lighting → Raw Brass * Style & Rendering → Caution Yellow * Final Look → Safety Orange Active stages are highlighted with sharp, LED-like pin-lights and contrasting mechanical outlines while maintaining a premium industrial aesthetic. Maintain generous whitespace, restrained motion, and exceptional visual hierarchy. Avoid clutter. The final interface should feel like a premium tactile hardware operating system for AI image generation—not a prompt editor, but an intelligent, tactile semantic reasoning environment where creative direction and scene are unified into a single high-level semantic decision, with every subsequent stage refining and strengthening that creative intent.