Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Published by Scroll Versions from space WDESIGNER and version 22.1

When you open a model from the service panel, a second tab will open, displaying the model on the diagram pane. This is where you design your BPMN model.

The diagram pane consists of different areas:

  1. Diagram Pane
  2. Model Toolbar
  3. Elements Toolbar
  4. Designer Panels

Customizing the Diagram Pane

Multiexcerpt include
SpaceWithExcerptINTERNAL
MultiExcerptNamepanel_customization
PageWithExcerptINTERNAL:_designer_excerpts

Multiexcerpt include
SpaceWithExcerptINTERNAL
MultiExcerptNametip_panel_management
DisableCachingtrue
PageWithExcerptINTERNAL:_designer_excerpts

Modeling on the Diagram Pane

While modeling, some general functionalities help you to browse through your model, and to adjust your working location within the model. Refer to Customizing Editors and Panels for more details.

Excerpt Include
Overview Panel
Overview Panel
nopaneltrue

The Toolbars

Two toolbars are available for work on the diagram pane:

The Model Toolbar

The model toolbar assists you during modeling on the diagram pane:

The following table explains the available tools:

Tool IconTool NameDescription

ExportUse this icon to export your BPMN model in JSON format.

 

ReportClick the Report icon to print your model. You have two options: You can send your model directly to a printer or save it as a Word document. See page Creating Diagram Reports for details.

 

ShareIf you click the Share icon, the URL of your BPMN model is copied to the clipboard and you can paste it elsewhere, for example in an email.

 Image Removed

Publish to CockpitIf you want direct access to your BPMN model in your cockpit, click on the icon Publish to cockpit. If you open your cockpit the next time, an external link tile grants you direct access to the model.

Hide Execution PaneUse this icon to hide the execution pane. This allows to gain more space during modeling.

 

Toggle gridUse this icon to enable or disable the grid on the diagram pane. The grid supports you during modeling: If the grid is enabled, elements snap to the grid points.

Multiexcerpt include
SpaceWithExcerptINTERNAL
MultiExcerptNametoggle_grid
PageWithExcerptINTERNAL:_designer_excerpts
shouldDisplayInlineCommentsInIncludesfalse

Show invalid

Multiexcerpt include
SpaceWithExcerptINTERNAL
MultiExcerptNameshow_invalid
PageWithExcerptINTERNAL:_designer_excerpts
shouldDisplayInlineCommentsInIncludesfalse
Activate the icon to highlight all invalid elements.

Insert/Remove horizontal spaceUse this icon if you need more or less space on the diagram pane. Click on the pane to display the start line, the second click marks the end line and defines the size of the area to be added. To add space, click from left to right to define the area. If you want to delete a horizontal space, click from right to left to define the area.

Multiexcerpt include
SpaceWithExcerptINTERNAL
MultiExcerptNameadd_horizontal_space
PageWithExcerptINTERNAL:_designer_excerpts
shouldDisplayInlineCommentsInIncludesfalse

Insert/Remove vertical spaceUse this icon if you need more or less space on the diagram pane. Click on the pane to display the start line, the second click marks the end line and defines the size of the area to be added. To add space, click from top to bottom to define the area. If you want to delete a vertical space, click from bottom to top to define the area.

Multiexcerpt include
SpaceWithExcerptINTERNAL
MultiExcerptNameadd_vertical_space
PageWithExcerptINTERNAL:_designer_excerpts
shouldDisplayInlineCommentsInIncludesfalse

UndoIf you want to cancel your last action on the diagram pane, use this icon.

RedoUse this icon to restore the action that you had previously undone.

The Elements Toolbar

The elements toolbar contains all BPMN elements that you can create on the diagram pane.

By default, the elements toolbar only displays the icons of the available BPMN elements.

But you can also expand the toolbar by using the icon.

In its expanded version, the names of all elements are also displayed.

Tip

In chapter Supported BPMN Elements all elements and their specific properties are described.

Multiexcerpt include
SpaceWithExcerptINTERNAL
MultiExcerptNameadd_bpmn_elements
DisableCachingtrue
PageWithExcerptINTERNAL:_designer_excerpts

The Diagram Context Menus

Various context menus support the user during modeling on the diagram pane:

Elements Context Menu

Anchor
elements_context_menu
elements_context_menu

If you click on an element, the element context menu opens. You can use it to create new elements instead of using the elements toolbar.

Choose one of the icons to create the corresponding element:

If you create a new element using the context menu, the relation to the current element is drawn automatically.

Tools Context Menu

Anchor
tools_context_menu
tools_context_menu

If you right click on an element, the tools context menu opens. Use it to edit the current element.

The following options are available:

IconDescription

Delete the element.

Copy the element.

Cut the element.

Paste format of the element.

Bring the element to the front.

Send the element to the background.

Extended Tools Context Menu

Anchor
x_tools_context_menu
x_tools_context_menu

If you have selected more than one element on the pane, the tools context menu is enhanced with additional options:

IconDescription
Align left
Align right
Align center
Align top
Align bottom
Align middle
Auto layout
Distribute horizontally
Distribute vertically
Align relation
Info

The number of displayed options depends on your selection on the diagram pane.

Relation Context Menu

Anchor
relation_context_menu
relation_context_menu

Right-click a relation to open the relation context menu. Only the following options are applicable to relations:

IconDescription

Delete the relation.

Paste format of the relation.

Bring the relation to the front.

Send the relation to the background.

Align the relation.

Diagram Context Menu

Anchor
diagram_context_menu
diagram_context_menu

With a right-click on the diagram pane itself, you open the diagram context menu:

IconDescription

Paste a copied element.

Shortcuts

You can also use shortcuts on the diagram pane. The following list of shortcuts can be searched. Enter your search term in the Global Filter field.

Table Filter
hideControlstrue
sparkNameSparkline
datepatterndd M yy
globalFiltertrue
id1614936371241_-262230388
sortShortcut ⇧
worklog365|5|8|y w d h m|y w d h m
isORAND
separatorPoint (.)
order0
ShortcutDescription
Arrow downMoves the selected element(s) downwards by increments of one gridline. If no elements are selected, the whole diagram pane is moved downwards.
Arrow leftMoves the selected element(s) to the left by increments of one gridline. If no elements are selected, the whole diagram pane is moved to the left.
Arrow rightMoves the selected element(s) to the right by increments of one gridline. If no elements are selected, the whole diagram pane is moved to the right.
Arrow upMoves the selected element(s) upwards by increments of one gridline. If no elements are selected, the whole diagram pane is moved upwards.
Ctrl + 1, 2, 3 ... 9

Opens the tab corresponding to the chosen number. The first nine opened models are offered for activation. Press a number to activate the corresponding model and bring it to the foreground.

Ctrl + A
Selects all elements on the diagram pane.
Ctrl + Arrow downMoves the selected element(s) downwards by increments of one pixel.
Ctrl + Arrow left
Moves the selected element(s) to the left by increments of one pixel.
Ctrl + Arrow rightMoves the selected element(s) to the right by increments of one pixel.
Ctrl + Arrow upMoves the selected element(s) upwards by increments of one pixel.
Ctrl + C

Copies the selected element(s) to the clipboard.

Ctrl + D
Closes the active model window.
Ctrl + left mouse button

Allows you to add or remove individual elements from the selection one by one.

Ctrl + Mouse WheelReduces (scrolling down) or enlarges (scrolling up) the zoom factor of the model.
Ctrl + Shift + DCloses all tabs and switches to explorer tab.
Ctrl + VGenerates copies of the selected element(s).
Ctrl + XCuts the selected element(s) and copies them to the clipboard.
Ctrl + Y
Repeats editing steps that have been undone.
Ctrl + Z
Undoes previous editing steps.
DelPress Del to remove selected elements from the diagram pane.
Esc

Pressing the Esc key aborts the following processes:

  • adding a new element
  • closing a dialog
  • drawing a relation
  • moving elements
  • reattaching a relation
  • changing the relation path
  • creating an image
  • changing the name of an element
Mouse WheelMoves the model up or down.
Shift + Mouse WheelMoves the model to the right (scrolling up) or left (scrolling down).
Shift + Page downSwitches to the next tab from left to right.
Shift + Page up
Switches to the next tab from right to left.