Introduction to Appian:

Hands-on Activity #2
LESSON 6: Add an Approval Task to a Process
LESSON 6: Hands-on Activity #2 - Add an Approval Task to a Process
Objective
In this hands-on activity, you will:
● use low-code application development to enhance Valo’s Order Fulfillment workflow to provide executives with a streamlined
way to approve high-value order, and
● get hands-on experience with the Appian Process Modeler and Interface Designer!

Step-by-step instructions

Let’s start by opening Valo’s Order Fulfillment process model. Open the site navigator by clicking the icon at the top right
and selecting the Appian Designer; the location in Appian where designers & developers can build, manage, and deploy applications.

Open the Valo Order Fulfillment application.

Filter by Process Model, then click the VOF Order Fulfillment process to open it.

2
The executive approval flow of this process has been mostly configured, but we need to add the finishing touches. We need to dictate
the subset of high value orders that require approval. We will start with the XOR Gateway, which you can think of as a decision point
that decides which process flow to execute based on your business rules. Double click the Executive Approval Required? XOR
Gateway to open it.

We need to configure the line of business logic that requires executive approval for order values exceeding 25-thousand-dollars. Click
the Decision tab. For the unconfigured line’s Result, confirm the selection is Set Status - Executive Approval to send the order
down the “Approval Required” path.

3
Then, for the Condition, click the pencil icon to edit it as an expression.

Find and select the totalPrice process variable.

Then type: > 25000. Confirm it’s correct, then Save and Close the editor.

4
Great, you configured the gateway! This logic is simple, but you can use Appian’s powerful rules engine to apply whatever logic is
required to match the complexity of your business processes. Click OK to close the menu.

Next, double-click the Executive Approval user input task. User input tasks allow users to take action within your process. This
particular input task will become the form used to carry out the executive approval!

5
Move to the Forms tab. You’re going to select an interface to associate with this task. Start typing VOF_ExecutiveApprovalForm
and select it when it is auto-suggested to assign the interface.

When Appian asks to automatically create the inputs for the approval form, select “Yes”.

6
Now click Edit Interface.

The Interface Designer is...where you design interfaces! Leveraging low-code drag and drop functionality, you can rapidly create and
configure dynamic user interfaces and forms. Components - the building blocks for Interfaces - can be dragged from the Palette on the
left side of the screen, to the live view.

We’re going to add a new section to this interface so executives can approve or reject orders and provide comments on their decision.
To start, grab a card layout from the palette on the left and drag it to the bottom of the interface.

7
We are going to use the card layout to draw the users attention to the approval section. Select the card layout and if it is not
already, make sure to open the component configuration pane on the right hand side of the screen.

Scroll down and set Style to STANDARD.

8
Next, uncheck the “Show Border” option to remove the card’s border.

Now that our card layout is ready, drag a Columns component from the palette into the Card layout. We are going to use columns
to organize inputs for the user.

9
We only need two columns, so let’s delete one of the three.

Now let’s grab a Radio Button component from the selections section of the components palette, and drag it into the column
on the left.

10
An Executive will use this component to approve or reject an order. Select the radio button field we just added, and head to the
component configuration pane on the right hand side of the screen. First, we can change the label to say “Executive Approval”.

Next, click the link under choice labels.

11
For our choice labels, we can use “Approve” and “Reject”. Then, return to the Radio Buttons configuration menu.

We’ve set the labels for the choices; now we need to set the values each label will store when selected. Click the link under Choice
Values.

12
Enter true and false, replacing the placeholder Choice Values.

Then, return to the Radio Buttons configuration menu.

13
When a user makes a selection, we want to save it and pass it back into the process.

Set the “Selected Value” parameter to `ri!executiveApproval` by selecting it from the dropdown list. `ri!executiveApproval` is
our rule input to store the executive approval decision. Rule inputs are simply how you input data to an interface, whether from a
process or any other part of your application.

Do the same for the “Save Selection To” parameter and set it to `ri!executiveApproval`.

14
Lastly, let’s mark the radio button field as required, so the form cannot be submitted without selecting a value.

Let’s also give the executive a way to enter comments about the decision they make. Grab a Paragraph field component from the
Inputs section of the component palette, and drag it into the right hand column.

From the component configuration pane, change the Label of the paragraph field to “Executive Comments”.

15
Similar to the radio button, we want to make sure to save what a user enters. Set the Display Value and Save Input To parameters
for the paragraph field to `ri!executiveComments`.

Finally, as a finishing touch, let’s make comments required when an executive rejects an order. Scroll down, then hover over the
“Required” field, and click the pencil icon to “Edit as Expression”.

From here, simply type ri!executiveApproval = false (try clicking the auto-suggested value when it appears to speed up the
process). This means when the value saved to our rule input for the radio button is false, the paragraph field will be required. Click
OK to close the editor.

16
Finally, click Save Changes at the top. We have now successfully completed the form for executives to review and approve orders!

Close this tab and return your browser tab that has the VOF Order Fulfillment process model open. Now that you’ve finished
configuring the Executive Approval user input task, click OK to close the menu.

Go to File, and Save and Publish the process model. Once this is complete, you’ll notice an informational alert at the bottom of your
screen that says “The process model has been published”.

17
To give the enhancement a test run, return to the Order Fulfillment site.

Click the New Order action on the Order Management tab to create a new customer order.

Download the second sample purchase order pdf from the new order form - it has a total > $25k.

18
Fill out the order details and then click Create Order.

Push the order through the order process just like in the first activity (complete the Verify Data Capture task once Appian AI finishes
the Data Capture step).

But now, the order will require the executive approval after you complete the Verify Data Capture step! Note that we’re
not enforcing role-based security here as we’re still preparing this app for its production release. You can complete the approval
and click SUBMIT send the order downstream for sales order creation!

19
Low-code development accelerated the implementation of this enhancement to Valo’s Order Fulfillment process. Combining technology
and people in a unified workflow is a powerful way to optimize your business processes!

Now return to the Introduction to Appian course and move on to the next lesson!

20