Creating a new state:

To create a new state hold cmd or Ctrl and Doubleclick on any empty space within the white area.

Rename a state:

You can edit the label of a state.

Simply hover over the label and Click on it.

Then type in the new name and hit Enter to submit.

Click outside to cancel the rename.

INFO: Labels need to start with a letter and can not contain any whitespace or special characters. They will be removed upon submit.

Draw transitions:

You can draw a transition from one state to another:

Click on any state and Drag the transition to the desired second state.

Rename transitions:

You can also edit the label of transitions.

The same rules apply as for the renaming of states:

Click on the label to edit it.

Press Enter to submit.

Click outside to cancel the rename.

INFO: Labels need to start with a letter and can not contain any whitespace or special characters. They will be removed upon submit.

Move states:

To rearrange the position of states you can hold down cmd or Ctrl and Drag them to a desired position.

All attached transitions will automatically adapt and move as well.

Create a self-transition:

You can also draw transitions from a state back to itself.

To do that hold down option or Alt and then Click on a state.

Delete components:

To delete any drawn component, simply hold Shift and Click on the state or transition to remove.

If you remove a state, any attached transition will be deleted with it!

Bend transitions:

In the case that a bidirectional transition is needed between states, you need to draw a second transition. To not let them overlap it is possible to bend transitions.

To do so just Click and Drag them until you get the desired shape.