Create Your First Diagram

Open the website

1. Open DrawMotive Diagrams.
2. Sign in, or create an account.
3. Choose New diagram in the diagrams overview. Creating a diagram requires a connection.

You can also choose Import TextGraph and paste source or a complete TextGraph playground share link. This creates a new editable diagram without replacing an existing drawing.

Draw and label

1. Choose Rectangle and draw a box for the first step of your process.
2. Add another rectangle, or use Diamond for a decision.
3. Use Text to add labels.
4. Use Arrow to connect related steps.

The toolbar also provides Ellipse. Press Escape to cancel the current interaction.

Edit the result

Click an object to select it. Drag it to move it, and use its handles to resize or reshape it. The selection toolbar shows relevant appearance and text controls.

Use Delete to remove a selection, Ctrl/Cmd+Z to undo, and Ctrl/Cmd+Shift+Z to redo. Hold Space and drag to pan; use the zoom buttons to adjust your view.

Check saving

The sync indicator reports whether changes are synchronized or remain on this device. An established canvas can continue editing while offline. Check for All changes synced before relying on another session to have the latest drawing.

You can open the same diagram in another session signed into your account. Sending its URL to a different account does not grant access. See Collaboration and Sync.

Share a result

For a local editable image, use DrawMotive for VS Code and Save diagram to save a .draw.png file. For a Confluence page, use the installed macro and Publish.

Continue with Drawing and Editing or the architecture diagram tutorial.