Navigating Leap Studio

Find your way around Leap Studio: the tabs, the project tree, the Element Explorer and the Inspector.

Navigating Leap Studio

Leap Studio is Leap's editor: once a project is open, it's where you build your design. This guide covers the tabs along the top of the screen, the four areas of the Design tab, and the shortcuts that help you move between them.

The Tabs

The header shows five tabs: Design, Simulate, Playtest, Operate and Analyse. In this alpha you'll work in Design and Playtest; the other three show a Soon badge. Each tab remembers the page you last had open in it, so switching back returns you to where you were.

The Design Tab

The Design tab has four areas: the project tree on the left, the canvas in the middle, the Element Explorer along the bottom, and the Inspector on the right.

The Project Tree

The sidebar shows your project as a tree. At the top is Player, which holds everything that isn't inside a group. Under it you'll find your groups (a group can contain other groups), your folders and your systems. Resources, flags and the other element kinds aren't in the tree — they live in the Element Explorer.

To add something, hover a row and click + (on Player the + is always visible). You can add:

Folder — "Editor only — no runtime effect". Folders organise the tree for your team; your game never sees them.
Group — "A runtime namespace that exists once — group.element". See Creating Groups.
System — "A state machine you edit on the canvas". See Creating Systems.

Use Search elements… at the top of the tree to find something by name. The Element Flow link at the bottom opens a map of how your elements connect; see Element Flow.

The Canvas

The middle of the screen shows the system you're working on. Click a system in the project tree to open it. When you open the Design tab with no system open, Leap Studio opens your project's GameSetup system.

The Element Explorer

The Element Explorer along the bottom lists your elements one category at a time. Pick a category from the rail on its left:

Resources — what a player earns, spends and accumulates
Constants — fixed tuning values your design reads
Formulas — named, reusable calculations
Entitlements — what store purchases grant
Achievements — goals that unlock automatically
Flags — yes/no facts about a player
Custom Operations — actions your game or your design can run
Events — signals that move systems forward

From its toolbar you can:

Create — click the New button, which is named after the category (e.g. New Resource). Leap creates the element straight away with a placeholder name such as "Resource 1" and opens it in the Inspector with the name selected, ready to type over. The arrow next to the button offers Create multiple… (e.g. Create multiple resources…), which creates 2 to 30 at once from a name pattern (# marks where the number goes).
Search the category, or filter it by Tags.
Scope the list — when a group is selected in the project tree, switch between showing that group's elements and All; + nested also includes the groups inside it.
Save all — appears when elements in the category have unsaved changes, and saves them all at once.

Click a row to open it in the Inspector. ⌘-click adds a row to the selection and shift-click selects a range. Hover a row to Duplicate or Delete it. Deleting asks you to confirm and can't be undone — check Element Flow first to see what uses the element.

Tip: A new element exists as soon as you click New. If you decide you don't need it, delete it — Leap doesn't remove unused placeholders for you.

The Inspector

The Inspector on the right edits whatever you've selected. Your edits are kept as a draft until you click Save at the bottom of the panel; Discard throws the draft away. The header shows Unsaved while you have pending changes and Saved once they've been written, alongside Duplicate, Delete and Collapse panel. With nothing selected, it reads "Nothing selected".

Select two or more rows in the Element Explorer to edit them together. Fields whose values differ between the selected elements show "–".

Fields Every Element Shares

Every element's Inspector starts with the same fields. The article for each kind of element covers only the fields specific to it.

Name — the name your team sees, e.g. "Gold". Required.
Slug — the identifier your design and your game use, e.g. gold. While an element is new, its slug follows the name as you type. It can contain lowercase letters, numbers and underscores, and must start with a letter. Resource and constant slugs can be changed at any time inside a workspace; other slugs can be changed until the element is merged into Main. Everything in your design that uses the element follows the new slug.
Icon — click to pick an icon.
Description — an optional note on what the element is for.
Tags — labels for filtering and organising. Type a tag and click Add, or click one of the suggested tags.
The group field below Tags — places the element in a group, which changes the path your game uses to reach it. See Creating Groups.

Keyboard Shortcuts

On the Design tab (on Windows and Linux, use Alt+Shift):

⌥⇧L — show or hide the project tree
⌥⇧B — show or hide the Element Explorer
⌥⇧R — show or hide the Inspector
⌥⇧F — focus mode: hide all three and keep only the canvas

Unsaved Changes

If you switch to another header tab while you have unsaved edits, Leap lists them and asks what to do: Stay, Discard all, or Save all and continue.

Important: Switching workspace, switching project or reloading the page discards unsaved Inspector edits without asking. Save before you do any of these.

Main Is Read-Only

When no workspace is selected, you're looking at Main and everything is read-only. Buttons that would change something are dimmed with the tooltip "Select a workspace to make changes", and the Inspector shows the same message. Create or switch to a workspace to start editing.

Next Steps

Continue to Working with Workspaces to create your first workspace and learn how to merge your changes.