Interactive website builds a site that actually works — real HTML, CSS and JavaScript across multiple pages, live in the preview, clickable and steerable. It's the difference between a mockup of a website and a website.
What a site run builds
Brief it like a project — "a landing site for a coffee subscription: hero, three blends, pricing, footer" — and the agent builds the site: the pages, the nav, the interactions, the responsive layout. The preview is the site itself, running locally — scroll it, click the links, drag the width, watch the interactions fire.
Mobile app · Devin · subagent · 9 screens · 5 files
Canopy — A plant-care prototype you can click through — nine states, light and dark, keyboard and offline fixtures.
▸ the prompt that made it▾ the prompt that made it
“Build the full flow from the product contract as a clickable HTML prototype, one screen per file plus an overview. Light and dark. Include the keyboard-open fixture for the add-plant form, a long Vietnamese plant name, and a large-text variant of the Today screen. Fixture data only; no network.”
Real means real
The site is actual code in the project folder — you can open the files, read the markup, ship the output. That honesty matters for what the site is for: a working prototype you can put in front of someone, a landing page you can actually deploy, a proof of concept that proves the concept works.
- Navigation — links that go somewhere, checked by the gate
- Interactions — menus, modals, scroll effects, working controls
- Responsive — the five widths the gate checks, live in the viewports
Mobile app · Devin · swe-2-high · 22 min
Living Sky Weather — Five phone screens, five skies — animated weather that re-tints the whole interface per condition.
▸ the prompt that made it▾ the prompt that made it
“Design a mobile weather app as 5 phone screens (390×844) for Nha Trang: sunny noon, cloudy afternoon, tropical rain, thunderstorm at night, and clear night with stars. The top half of each screen is an animated sky (canvas or CSS: sun glare, drifting clouds, rain streaks, lightning flash, stars) that matches the condition and time. Content: current temperature, feels-like, hourly strip (12 hours), 7-day list with bars for temperature ranges, UV, rain chance, and a severe weather alert card for the storm screen. UI colors adapt per condition while keeping text contrast ≥ 4.5:1. Include a reduced-motion version.”
Steering a site
The full steering toolkit applies — it's still files in a folder:
- ⌥-click the element that's off, comment on the exact node
- Tweaks for live parameters — theme, spacing, motion
- Follow-ups for a missing page or a wrong interaction ("the nav should collapse to a drawer on mobile")
- Versions to try a different take on the same site
The gate checks it like a site: live nav at every width, contrast, hit targets, the layout actually working at phone size — not just that it renders.
What it's good at
- Landing pages — the marketing site, launch page, product page
- Working prototypes — prove the interaction, not just the look
- Small real sites — the personal page, event site, portfolio
- Interactive demos — something people can actually click
Website vs mockup vs mobile app
- Interactive website — a working site, multi-page, real behavior
- UI mockups — a picture of an interface, desktop or web-shaped
- Mobile app — phone-shaped screens, touch-scale controls
If it needs to work — not just look like it works — it's this template.
Tip: Ship the site's skeleton before the polish — "get all four pages working first" lands a navigable site you can steer, instead of one perfect homepage and three dead links the gate will flag anyway.
Exporting
Sites export to ZIP or HTML — the files you deploy as-is — or to PNG / PDF for the visual record. The project folder holds the source for the next steer or the next version of the site.