Service Designer User's Guide
Service Designer Elements
Direct link to topic in this publication:
UI Service Designer Elements
To design client-side services, you use nodes and wires to create service flows.
Learn about the elements in more detail.
A node is a functionality which defines an action. You connect one or more nodes, to create a flow. A single app can have many services, and each service can have multiple flows, and each flow can have multiple nodes.
Nodes can be added to the workspace by dragging them from the palette and dropping them to the editor.
Nodes are joined together by wires via their ports. A node can have at most one input port and many output ports. You specify a name for each node using its Attributes window.
Editing Node Configuration
A node’s configuration can be edited by clicking twice on the node or pressing
Enter when the node has focus.
The attributes window shows the edit form specific to the node that is selected. Click in the Attributes window to learn about the node.
Nodes are wired together by pressing the mouse button on a node’s port, dragging to the destination node, and releasing the mouse button.
To delete a wire, first select the wire by clicking on it and then press the D
A flow is a logical set of connected nodes which defines a task. It connects one or more nodes using wires. To create a flow, drag and drop one or more nodes to the service editor and connect the nodes.
It is the main editor canvas where flows are developed by dragging nodes from the palette and wiring them together.
You can use keyboard shortcuts in the editor to perform cut, paste, delete, and save operations. refer to the Reference tables below to learn about the shortcut keys.
Undo last change
The header of the service editor contains buttons to zoom in and out, as well as to reset to the default zoom level. It also contains a toggle button for the view navigator.
Service Editor view navigator
|Action||Paste the copied node|
|Key shortcut||Ctrl+V |
The view navigator provides a scaled-down view of the entire editor, highlighting the area currently visible. That area can be dragged around the navigator to quickly jump to other parts of the workspace. It is also useful for finding nodes that have been lost to the further edges of the editor.