How does live preview work in Draftbit?

The Preview Panel sits in the center of the builder. Add one or more preview devices, choose laptop and desktop sizes or phone and tablet sizes, rotate them, and pan and zoom across an infinite canvas that can show every screen of the app at once. Edits from the agent, the design tools, or the code editor appear in these previews as they happen. Double-click any text in a preview to edit it in place. The Logs panel shows runtime output and errors while you work, and a Restart preview control reloads the app after a dependency or configuration change.

The default previews are web renderings of your app. For real native behavior, the Pro plan and above can build iOS and Android simulators that run inside the browser. Those builds take a few minutes, keep separate Saved and Unsaved versions so you can compare the last saved build with your working changes, and need a rebuild whenever you add or remove packages with native code.

For a real phone or tablet, install the Draftbit Preview app for iOS or Android, click the QR code button in the builder, and scan it. The iOS simulator cannot receive remote push notifications, for example, so test hardware features on a device before a store submission.