openflowkit.com
Design analysis
A large connected-system visual demonstrates both overview and detail, followed by a smaller creative canvas paired with explanatory copy.
Prompt preview
## Reference images Study these alongside the description below: hierarchy, rhythm, spacing, colour. Build for the product you are asked about, using this design language. - Component: https://kage-design-assets.t3.tigrisfiles.io/components/openflowkit-2/3de20331-4179-415d-a7ba-29915155b155-1791957761-6.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/openflowkit-2/3de20331-4179-415d-a7ba-29915155b155-1791957697393-full.webp - Component on Kage: https://kage.design/component/openflowkit-2-gallery-2 ## Before you start Ask what system, process, or ecosystem the user's product helps people understand and what overview-to-detail story should be shown. Build a two-part visual storytelling section. First, use an editorial heading and side link above a wide framed architecture canvas. The canvas should have a subtle application chrome bar, pale grid or dotted background, connected nodes, labeled relationships, and a few highlighted central entities. Use white cards with 10–14px radii and 1px gray borders; emphasize the active system with orange outlines (`#d94b16`) and soft orange fills. Beneath or beside it, create a second split row with a smaller playful canvas preview on the left and a text block on the right. The text block should include a large two-line heading, muted explanatory paragraph, compact capability bullets, and an understated link. Maintain generous whitespace and a clear visual hierarchy from macro system to creative detail. Never use the reference's logo, product name, copy, illustrations, imagery, or exact node names.
kage