From reference to a testable product world. Fill in the canvas block by block. Everything saves automatically in your browser.
Don't copy, translate principles. What makes the reference strong?
Who is this instantly relevant for, without explanation?
A precise category beats any generic name. The category changes everything.
What are we actually testing? Not: what are we building.
When sees this product, they should and .
Derive them from the product world, don't invent them. Every feature solves a concrete problem.
The page as a story, not a feature list. Every section has a job.
Make the idea visible, test the reaction, decide.
Copy, adjust, generate. Your answers from the blocks above are already filled in. Works with any tool.
Analyze these visual references and extract a design direction for a fictional premium product. Focus on: atmosphere, color palette, material language, typography direction, what to avoid. Do not copy any existing brand. Translate into a new original product world.
Create a premium cinematic hero image for [Product name], a [Category]. Scene: [Product] on/in [Setting / surface]. Background: [Atmosphere]. Style: cinematic, [Colours], premium editorial, no neon, no cyberpunk. No people. No text overlays.
Build a premium product website for [Product name]. Style: [Aesthetics + colours]. Sections: [01 Hero → 09 CTA]. Premium editorial. Lots of whitespace. No neon. No cyberpunk. No generic SaaS design.
Add refined motion to this website: — Scroll-triggered fade-ins per section — Staggered reveals for lists and features — Subtle hover states on all elements — Smooth page transitions — Signature animation for [Hero Element] Keep motion purposeful. Not decorative.
From reference analysis to testable prototype. Strategy, process, execution in six parts, 10 months access (in German).