Designer

Designer mode lets you fine-tune a website right on the page. Preview it at real screen sizes, point at what you want changed, and send it to the chat so Starfish makes the change.

Designer is available in Developer mode. It previews sites that are running on your Mac, such as a site Starfish is building for you.

Turn it on

Click the Designer mode button (the pencil-and-ruler icon) at the top of the window. Enter the site's local address, for example localhost:5173. If nothing shows yet, ask Starfish to start the site first.

Click the button again, or Exit Designer mode, to go back.

Preview at real sizes

Switch between Desktop, Desktop HD, Tablet and Mobile to see the page at true device sizes. Use Reload to refresh the page.

Pop out the preview

Click Open outside to move the preview into its own window, handy on a second screen while you keep chatting in the main window.

Point at what to change

• Select element — click any part of the page to add it to your next message, so Starfish knows exactly what you mean.
• Add comment — click a spot and write what should change, such as "Make this button bigger". Add as many comments as you like; each gets a number on the page.
• Edit text — click any text on the page and type the new wording.

Press Esc to stop picking.

Send it to the chat

When you're ready, click Send to pass your comments and edits to the chat. Starfish sees each one with its place on the page and the screen size you were using, then makes the changes.

Tips

• Group related comments and send them together, so Starfish can make the changes in one pass.
• Check the phone size before you send. A change that looks right on desktop may need its own note for mobile.
• Keep comments specific: "Make the headline shorter and bolder" works better than "Fix this".