{"slug":"the-workspace","title":"Tour the workspace","summary":"A project opens in three columns: the project panel (App, Design, Code), the device preview, and the assistant chat, under a project bar with Connections, Export, Publish, and Build.","body":"Open a project from the dashboard or from **My apps**. Everything about one app lives on this screen.\n\n## The project bar\n\n| Control | What it does |\n| --- | --- |\n| **Projects** | Returns to your apps. |\n| App name | Opens the app name and icon dialog. See [App name and icon](/docs/app-icon). |\n| Status and **Saved** | Shows whether the assistant is working and whether your manual edits are saved. |\n| **Code** | On a phone, opens the source drawer. ⌘E (Ctrl+E) opens or closes the source anywhere. |\n| **Connections** | Backend, in-app purchases, and secrets. A dot shows when a backend is connected. |\n| **Connect editor** | Edit the app from Claude Code, Cursor, VS Code, and other MCP clients, when available. |\n| **Export** | Downloads the Expo source as a .zip. |\n| **Publish** | Store readiness, listing, and releases. |\n| **Build** | Signed APK, App Bundle, or IPA. Shows progress while a build runs. |\n| Credits | The organization's balance after finalized charges. |\n\n## The project panel\n\nThe left column has three tabs. They stay loaded, so switching does not lose your place.\n\n- **App** lists the screens the assistant planned and built, the navigation structure, and shared components. Click a screen to open it in the preview. See [App structure](/docs/app-structure).\n- **Design** holds the few design decisions you can change without a prompt: brand color, corner radius, density, type scale, typefaces, and direction presets. See [Design tokens](/docs/design-tokens).\n- **Code** is the TypeScript project: file tree, search, and an editor. See [Edit the source](/docs/edit-the-source).\n\nCollapse the panel when you want more room for the preview.\n\n## The preview\n\nThe center shows the app in a device frame, compiled from the current source. It has a route picker, a device picker, a console, a light and dark toggle, rotate, and reload. See [Preview](/docs/preview).\n\n## The chat\n\nThe right column is the assistant. Send requests, attach screenshots or files, answer its questions, undo a turn, and switch between conversations. See [Work with the assistant](/docs/work-with-the-assistant).\n\n## On a phone\n\nOn narrow screens the code panel becomes a drawer. The preview and the chat stay available.","sectionSlug":"build","sectionTitle":"Build your app","updatedAt":"2026-09-23T22:51:25.250Z","previous":{"slug":"start-a-project","title":"Start a project"},"next":{"slug":"work-with-the-assistant","title":"Work with the assistant"}}