- Simple is a guided surface. You build screens from a curated library of pre-wired blocks, edit them with high-level controls, and pick from vetted presets for colors, animation, and actions. It is the default for new flows.
- Advanced is the full editor. It exposes every primitive, the layer tree, the variable manager, conditional values, positioning, logic nodes, and the raw property tabs. It is what the editor has always been.
Simple mode is on by default. If your team has disabled it (the
NEXT_PUBLIC_FLOWPILOT_SIMPLE_MODE environment variable is set to false), the editor runs in Advanced only and the mode toggle does not appear.Why two modes
The reliability of a flow depends on how exotic its building blocks are. A flow assembled from a small set of vetted, cross-tested blocks renders the same on the canvas, in the iOS SDK, and in the Expo SDK. A flow assembled from arbitrary nested primitives, absolute positioning, and hand-written conditional logic can reach corners that are harder to guarantee. Simple mode constrains the input space to a curated set of certified blocks with bounded controls, so a non-designer can build a complete onboarding flow that is safe to ship. Advanced mode keeps the full power for when you need it. The rule that decides what lives where:Every control in Simple mode is either a curated choice from a vetted set or a direct value with safe bounds. Simple never exposes a control that composes arbitrary logic, arbitrary positioning, or arbitrary primitive nesting.That single rule explains the table below.
| Capability | Simple form | Advanced form |
|---|---|---|
| Building | drag a certified block | nest raw primitives in the layer tree |
| Properties | high-level block controller | raw Layout / Style / Logic tabs (properties panel) |
| Actions | one primary action from a verb list | multi-action chains, multi-event, delays, conditional actions |
| Animation | preset (Fade up, Slide in, Pop, …) | full timeline, keyframes, stagger, attention |
| Color | theme token or plain color | conditional color bound to a variable |
| Layout | block-level spacing presets | per-edge padding/margin, absolute/fixed/sticky, z-index |
| Logic / branching | none (linear flow) | condition / assign / abTest logic nodes |
| Variables | auto-managed + read-only “Data collected” | full variable manager + dynamic bindings |
| Structure | Screens panel (thumbnails) | Layers tree |
Switching modes
The mode toggle is a segmented Simple | Advanced control in the top bar, to the left of Preview. The Advanced option carries a small Beta badge.Click the mode you want
Click Simple or Advanced in the top bar. The left sidebar, the Insert panel, and the properties panel all re-arrange to match the mode.
First time into Advanced: read the notice
The first time you switch to Advanced, a one-time dialog appears, titled “Welcome to Advanced”. It explains that Advanced surfaces are “less battle-tested across the iOS and Expo SDKs than Simple’s certified blocks” and that you “can switch back to Simple at any time.” Click Explore Advanced to continue. You only see this once.
Going back to Simple: review what locks
If the flow uses Advanced-only features, switching to Simple opens a dialog titled “Some elements will be locked”. It lists what cannot be edited in Simple (for example “2 conditional values”, “1 branching step”) and reassures you that “Nothing is removed, they stay intact and appear read-only in Simple.” Choose Stay in Advanced or Switch to Simple. Nothing is ever deleted.
How the mode is chosen when you open a flow
When you open a flow, FlowPilot resolves the mode in this order:- The flow’s saved mode. Every flow created in the current editor is stamped as Simple when it is created, so new flows open in Simple.
- Your last-used mode, remembered in your browser, if the flow has no saved mode.
- Advanced, as the final fallback.
What Simple tolerates but locks
Simple mode never drops data. If a flow contains Advanced-only constructs, Simple keeps them intact and shows them as read-only:- Logic nodes (
condition,assign,abTest, and others) appear as read-only “Logic step” dividers in the Screens panel. You cannot edit or reorder them in Simple. - A component that uses Advanced features but has no Simple controller shows a read-only amber card in the properties panel: “Some features are Advanced-only”, listing what is locked (conditional values, positioning, custom components, advanced animations, and so on).
- Loose primitives that are not part of a certified block are selectable as whole blocks but are not fully editable in Simple.
When to use each
Use Simple when
You are building a standard onboarding, quiz, or paywall lead-in from common patterns and you want it to be safe to ship across SDKs without QA on every screen.
Use Advanced when
You need branching logic, conditional styling, precise positioning, custom components, multi-step animation timelines, or any control that is not in Simple.
Common mistakes
- Thinking Simple and Advanced are different file formats. They are not. Both edit the same flow. The mode only changes what you can see and edit.
- Expecting an old flow to open in Simple. Flows created before this update open in Advanced and stay there until you switch. New flows open in Simple.
- Worrying that switching to Simple will delete advanced work. It never does. Advanced constructs are locked and shown read-only, not removed.
- Looking for the toggle and not finding it. If Simple mode is disabled for your workspace, the toggle is hidden and you are in Advanced only.