Build an app in Studio
Video coming soon
The Studio walkthrough video is on the way. In the meantime, this lesson walks you through building an app from a chat prompt — no external editor needed.
Studio is the in-dashboard AI app builder and the default mode of every project: opening /projects/{id} takes you straight to /studio. You describe what you want in a chat, watch the live preview update as the app takes shape, and publish — all without leaving HeroMate. It's the fastest path for non-technical builders who don't want to wire up an IDE.
What's inside Studio
Studio brings the whole build loop into one screen:
- Chat builder — describe features in plain language; the AI builds the frontend and the backend (tables, endpoints, auth, storage) for you.
- Live preview — see the app render and update as the AI works, side by side with the chat.
- Code workspace — open and edit the generated code directly (this is dev mode, a Pro capability).
- Plan editor — review and tweak what the AI is about to build before it runs.
- Publish panel — push your app live to its
*.dypai.appURL with one click. - Versions / rollback — every publish is saved; roll back to an earlier version if something goes wrong.
Build from a chat prompt
Open your project in Studio
Create or open a project — it lands in Studio by default. You'll see the chat on one side and the live preview on the other.
Describe the app
Write a prompt like "a task manager where users can sign up, add tasks, mark them done, and filter by group." The AI proposes a plan; you can review it in the plan editor before it builds.
Watch it build in the preview
As the AI works, the live preview updates so you can see the screens and flows appear. It creates the frontend and wires the backend — tables, endpoints, authentication — behind the scenes.
Iterate by chatting
Want changes? Just tell the AI: "add a delete button" or "let me filter by date." Hit an error? Describe it and the agent fixes it, then you retest. The loop stays simple.
Publish
When you're happy, use the publish panel to deploy. Your app goes live on its *.dypai.app URL. On the Pro plan you can connect a custom domain.
Building consumes AI Credits
Each time the AI builds or edits your app in Studio, it spends AI Credits, scaled by the size of the task. Free gives you +5 credits/day; Pro includes 100 credits/month (plus 100 one-time Launch Credits).
Your live app never goes dark
AI Credits only cover build/edit work. Your deployed apps stay live regardless of your credit balance — running out of credits never takes your app offline. Learn more in Plans & AI Credits.
Studio vs IDE + MCP
Both build the same backend — pick whichever fits how you work:
- Studio — no setup, no editor. Best for non-technical builders and quick iteration straight from the dashboard.
- IDE + MCP — connect Claude Code, Codex, Cursor, Windsurf, or Antigravity via the org "Conectar IA" page and let your AI build next to your repo. Best when you already live in an editor. See Setup backend in 5 mins.
Dev mode is a Pro feature
Editing the generated code directly (dev mode in the code workspace) is available on the Pro plan. On Free you build entirely through the chat and live preview.
Versions and rollback
Every publish is saved as a version. If a change breaks something, open the versions panel and roll back to a known-good build in one click — no manual undo needed.
What you'll learn
- That Studio is the default project mode — no IDE required
- Building an app from a chat prompt with a live preview
- Iterating with the agent and fixing errors by describing them
- How building consumes AI Credits (and why your live app never goes offline)
- Publishing and using versions / rollback
- When to use Studio vs IDE + MCP, and that dev mode is Pro