Smootify Studio
Smootify Studio, the desktop app for Mac and Windows - what it does for an Astro site, how Claude works in it, and where each step is documented.
Smootify Studio is the desktop app for Mac and Windows. Every Smootify site you work on sits in its sidebar. For an Astro site, Studio creates the project, sets up the deploy and updates the project when the scaffold changes.
Claude in Studio is your own Claude Code, on your Claude account. Studio checks that it is installed and signed in, and never reads your sign-in. Creating the project does not need it. Building the pages from your design, and updating the project, do.
The Astro project
An Astro site has four tabs. It has no Setup and no Sync: the content comes from Shopify when the site is built, or when a page is asked for.
- Build. Creates the project: configuration, content collections, a layout and the pages of a store, static or on demand. When Smootify changes what Studio writes, Build shows Update project, and Claude does it one step at a time. See Create the project with Smootify Studio.
- Iterate. Review notes on the site, answered by Claude (below).
- Check. Checks the site, as in any Smootify site.
- Deploy. Puts the site online on Cloudflare, with the secrets and the domain, and sets up the automatic updates. See Deploy to Cloudflare.
The Claude of each site
The Claude button at the top of the site opens Claude Code in the site’s folder, to build the pages from your design, to update the project and to work through review notes: see Create the project with Smootify Studio.
Every time it opens, Studio writes the site’s brief, CLAUDE.md, again in the site’s folder: the site id, the Shopify store and plan, the site’s address (the production address, or the dev server’s while you work), where the code is (./astro) and how Iterate notes are handled. Claude starts from it, so you do not explain the site from scratch. Because it is written again at every open, do not keep your own notes in it.
The site’s folder is in Smootify Studio/<site> in your home folder.
Review notes with Iterate
Iterate is a feedback loop on how Smootify is built into the site.
- Open the site. Studio opens the dev server or the deployed site, with a bar at the bottom that holds the notes.
- Add a note. Click an element, drag over an area, or choose the whole page; write what is wrong. Studio saves the note in the site’s folder with a screenshot, the Smootify elements around it, the page’s errors and the requests to Smootify or Shopify that failed just before.
- Send to Claude. Claude reads the notes, fixes the cause in the project’s code and answers inside each note, with the cause and how sure it is. It never deploys. See Fix notes with Iterate.
- Look again. A fixed note reads “Fixed in the code” until you deploy after the fix, and then “Online · check it”. On the dev server it reads “Fixed · check it”. The note has two buttons: Put it online and See it in the dev server.
A note whose cause is the store’s data, or Smootify itself, is answered as such, and is not fixed in your code.
Check these first
- Claude does not start. Claude Code is not installed or not signed in: Studio checks both.
- Claude does not know the site. Open it from the site’s Claude button, not from a terminal elsewhere: the button writes the site’s brief first.
- A fixed note still looks wrong online. The fix is in the code and the site is not deployed since. Use Put it online, then look again.