Manual Activities are rendered using jQuery Mobile, which provides mobile-friendly user interface widgets. This allows quick navigation to all aspects of the activity by simply tapping the desired tab icons.
An Activity Page opens in the following cases:

Figure: Activity View
You can perform the following actions in the Activity view:
The Activity Details tab opens per default when the activity is accessed. It displays basic information about the activity like:

Figure: Activity Details
The Form tab renders Manual Activity panels, External Web Applications and UI Mashups.
In case the activity is a Manual Activity, action buttons are provided to complete, cancel, save or delegate the activity.
Functionality is provided in the Stardust Modeler to generate mobile markup in addition to non-mobile markup for UI Mashups. Please refer to chapter UI Mashup Application in the Business Process Modeling Handbook for details.
At runtime the correct markup is rendered in the client based on the user's browser/user agent.

Figure: Generating Mobile UI Code in the Business Process Modeler
The HTML markup configured in the UI Mashup Application is rendered in an activity panel.

Figure: Mobile UI Code rendered in an activity panel
UI Mashups can leverage native GPS functionality provided with mobile phones to capture the GPS coordinates of the current location.
Geo-location services provided by the browser navigator may also be used in concert with providers such as
http://openstreetmap.org
in order to provide address identification for embedded UI Mashups.
See the following example for reverse Geocode:
"getAddress" : function(lon,lat){
var deferred = $q.defer();
$http({
url: "http://nominatim.openstreetmap.org/reverse?format=json" +
"&lat=" + lat + "&lon=" + lon + "&zoom=18&addressdetails=1",
method: "GET"
}).success(function(data, status, headers, config) {
deferred.resolve(data);
}).error(function(data, status, headers, config) {
deferred.reject(status);
});
return deferred.promise;
},
An example GPS coordinates-to-street address translation is shown in the image below:

Figure: GPS Location Example
You can attach documents, including from existing images from your camera or a new picture using the camera or by uploading files. Attached documents can be edited and viewed in the Document page.
To attach a document tap the Browse icon to select a file.

Figure: Browsing to a File
Tap the Upload button to upload the file as document.

Figure: Uploading a File
All attached files are displayed in a list below the upload icons. To open a document in the Document Viewer, tap the arrow on the right side of its entry.

Figure: Uploaded File
A list of existing notes showing the user avatar on the left side opens. To edit a note, tap on the according note entry.
To add a new note to your activity or process, enter text in the Note entry field provided at the top of the list.

Figure: Enter text for the new note
HTML speech-to-text capabilities if present can be leveraged to allow you to dictate into the device microphone and have the resulting text appear in the Notes field. This feature may also be leveraged to provide speech-to-text functions for embedded UI Mashup applications.
Tap the
icon to start
recording a voice note. During recording, the icon is displayed red
.

Figure: Adding a Voice Note
Tap to icon again to stop the recording. Once the recording is stopped, the color of the icon changes to black again.
Tap the
plus icon to save the Note
accordingly. The saved note is displayed in a list below the entry field, showing the
time left since its creation.

Figure: Saved Notes
You can expand to view longer notes by tapping the Expand arrow icon.
![]()
Figure: Expanding a note
Notes are sorted by their creation date. You can choose in which order the notes are displayed in the list. Tap the arrow up and down icon and select if you like the see the newest or oldest notes on top on the list.

Figure: Selecting the sorting order
To view process details for the activity's process, tap the
Process tab.
This opens the Process Details Page accordingly.
To activate an activity tap the Activate button below. Note that this menu option is not present if the Activity is in the activated state.

Figure: Activate button
Once an activity is activated, the Form tab opens according to the activity implementation.
To delegate an activity, tap the Delegate button below the activity.

Figure: Delegate button
The Delegate Activity dialog opens asking which participant you want to delegate the activity to.

Figure: Delegation dialog
Enter a text ...

Figure: Delegation
The selected participant is added on top of the list. If you like to remove this
participant tap the
icon on the right.

Figure: Delegation
Tap Delegate to delegate the selected participant or Cancel to discard the delegation process.