Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Section
Column

now enables universal access to e-forms and workflows on tablets and smart phones in addition to desktop support on all standard browsers. iOS 6+ devices, iPad and iPhone, running mobile safari are supported. This tutorial will incorporate several features into an Employee On Boarding workflow. For example;

  • Touch screen wet signature - the new employee can sign to verify the information using their finger or a pointer.
  • Take advantage of device specific capabilities - you will see the correct date picker and keyboards pop-up on your mobile device
  • Screenflows - ability to further divide a screenflow into sections that better lend themselves to an iPad or iPhone using the PageBreak control
  • Ability to upload an existing image or a picture taken with the device camera to the e-form
  • Use the iPad's location services to fill in the address
  • Spaces that render in a device specific manner - support swipe gestures and customized icons
  • Enhanced Task List for mobile devices
  • Quick Approval feature - allows quick review of a task by the appropriate person with accept/reject buttons
  • Generate an additional Pixel Perfect PDF for the federal W - 4 form. It is important to note here that there is no limit on the number of PDFs that can be generated. For example, you can collect the information in your form once and then use it to fill in an unlimited amount of pdfs for the new employee i.e. -the federal W - 4 and the I - 9.
Info

  You can download this tutorial as a PDF.


Please view the New Employee On Boarding video for an introduction to some of the exciting features we will be using in this tutorial.

We estimate about 2.5 to 3.0 hours for an experienced designer to complete this tutorial. It may take up to 4.0 hours if you are a new user. 

Column
width25%

On This Page:

Table of Contents
 

...

Expand
titleClick here to see how to create this rule

The Visual Rule Builder consists of 3 wizards:

  • Condition wizard - describe the conditions under which a set of actions should be executed
  • Action wizard - declare the actions that should be taken when the condition is true
  • Else Action wizard - declare the actions that should be taken when the condition is false
  1. Click the to add the rule.
  2. Name it Form Load
  3. Click the Run Builder button then check the Initialization Rule Only checkbox. This is the Condition wizard. Since we checked the Initialization Only checkbox, this rule will run when this step of the workflow is displayed to the user. It does not require a condition.
  4. Click Next
  5. Select FirstName from the first dropdown.
  6. Select to from the second dropdown
  7. Start typing userFirstName in the third field. The Function is shown in the dropdown. Select the function and complete the bracket.
  8. Click on Add Action
  9. Select LastName from the first dropdown.
  10. Select to from the second dropdown
  11. Start typing userLastName in the third field. The Function is shown in the dropdown. Select the function and complete the bracket.
  12. Click Add Action again
  13. Select manager from the first dropdown.
  14. Select to from the second dropdown
  15. Start typing userManagerID in the third field. The Function is shown in the dropdown. Select the function and complete the bracket.
  16. Click Finish
Image Removed
  1. Image Added
  • Click the  icon to collapse the rule window

  • We will write another rule to combine the First Name and Initial.

Expand
titleClick here to see how to create this rule

The Visual Rule Builder consists of 3 wizards:

  • Condition wizard - describe the conditions under which a set of actions should be executed
  • Action wizard - declare the actions that should be taken when the condition is true
  • Else Action wizard - declare the actions that should be taken when the condition is false
  1. Click the to add the rule.
  2. Name it Combine First Name and Initial
  3. Select FirstPlusInitial in the first dropdown.
  4. Select to in the second dropdown
  5. Enter FirstName + " " + MiddleInitial in the third field. (values show in dropdown as you type the name of the controls)
  6. Click Finish

Image RemovedImage Added
  • Click the  icon to collapse the rule window
  • We will write the third rule to combine the address fields.

Expand
titleClick here to see how to create this rule

The Visual Rule Builder consists of 3 wizards:

  • Condition wizard - describe the conditions under which a set of actions should be executed
  • Action wizard - declare the actions that should be taken when the condition is true
  • Else Action wizard - declare the actions that should be taken when the condition is false
  1. Click the to add the rule.
  2. Name it Full Address
  3. Click the Run Builder button
  4. Click Add Condition - this is the Condition wizard
  5. Select City from the first dropdown.
  6. Select isFilled from the second dropdown
  7. Click Next
  8. Select FullAddress in the first dropdown.
  9. Select to in the second droppdown
  10. Enter City + " " + State + " " + ZipCode in the third field. (values show in dropdown as you type the name of the controls)
  11. Click Finish

Image RemovedImage Added

  • Click the  icon to collapse the rule window
  • lets you take advantage of the iPad's location services. The  Geo-location feature works with rules. Below is an example of a rule that fills in the street, city, state and zip controls each time the location is updated.  For now, add this rule to your form now and we will turn the feature on in the workflow later in this tutorial. Click the icon to collapse the rule window and then click the icon to add the fourth rule. Call this rule Location. Click the Rule Code then Edit Code buttons. Copy/Paste the rule below into the rules canvas.  

...

Expand
titleClick here to see how to create this rule

The Visual Rule Builder consists of 3 wizards:

  • Condition wizard - describe the conditions under which a set of actions should be executed
  • Action wizard - declare the actions that should be taken when the condition is true
  • Else Action wizard - declare the actions that should be taken when the condition is false
  1. Click on the  Rules icon on the designer toolbar to access the Rules Editor. 
  2. Click the to add the rule.
  3. Name it Populate Today's Date when the new employee signs.
  4. Click Add Condition - this is the Condition wizard
  5. Select EmployeeSSignature from the first dropdown.
  6. Select isFilled from the second dropdown
  7. Click Next
  8. Select TodaySDatein the first dropdown.
  9. Select to in the second dropdown
  10. Start typing today and select function today() from the dropdown
  11. Click Next and go to false condition
  12. Select TodaySDatein the first dropdown.
  13. Select to empty in the second dropdown
  14. Click Finish

Image RemovedImage Added

  • We will use rules to calculate the total allowances. 
  • We will add another rule that will add the values for the A_Allowance, C_Allowance and D_allowance controls and store it in the Total_Allowances field. 

    Expand
    titleClick here to see how to create this rule

    The Visual Rule Builder consists of 3 wizards:

    • Condition wizard - describe the conditions under which a set of actions should be executed
    • Action wizard - declare the actions that should be taken when the condition is true
    • Else Action wizard - declare the actions that should be taken when the condition is false
    1. Click the to add the rule.
    2. Name it Compute Total Allowances
    3. Click Next - to take you to the Action wizard
    4. Select Total_Allowance from the first dropdown.
    5. Select to from the second dropdown
    6. Type Sum in the third field. The function shows in the dropdown. Select function Sum
    7. Type A_Allowance, C_Allowance, D_Allowance inside the sum bracket.
    8. Close the function.
    9. Click Finish

    Image RemovedImage Added

  •  Be sure to save your form by clicking on the  save and exit icon in the designer.
  •  You can test this form by clicking on the Test button on the Forms Home Page. The Today's Date field should be populated with the current date when the new employee signs. The sum of the values entered in A_allowance, B_allowance,and C_allowance will display in the Total_Allowances field.

...

Tip

Forms can be created or edited directly from the workflow, if necessary. Click the form to be edited, (the New Form if you are just creating it) then click the  icon to open the form designer. This copy of the form is not the same as the one we created in the Form Designer. Changes to the form in the workflow will not affect the original form that was dragged from the palette. 

Image RemovedImage Added

Assigning Roles to the Employee On Boarding Workflow

  1. Click on the Employee step
  2. Click on the  Edit Step Properties icon. 
  3. Click on the Assignment tab.
  4. Begin typing Employee in the Assign to Role(s) dropdown. Select it from the dropdown list when it displays.
  5. Click Submit
  6. Since the Employee, Allowances, Education and Confirmation steps are consecutive steps performed by the same user (new employee), they are considered a screenflow. Role assignment for a screenflow is only done on the first step - in this case - the Employee step. Leave the role assignment for the Allowances, Education and Confirmation steps blank.
    Image RemovedImage Added
  7. Click on the Confirmation step. Click on the  Edit Step Properties icon.
    1. Click on the Settings tab. Customize the Continue Label for this step of the workflow to say "Send to Manager". Click Submit.
  8. Click on the Approval step and assign the role of Manager. Remember to click Submit.
  9. Click on the Office Use only form and assign the HR role from the choices shown in the Assign to Role(s)  dropdown. Click on the Settings tab. You can customize the Continue Label to whatever text you like i.e.  "Send to ECM" . 
  10. Click Submit
  11. Continue the tutorial to setup Quick View for the Approval form, Geo Location for the Employee Information form, Task Email notification and the W - 4 pdf for the workflow.

Info

If you want to capture the current location of the new employee when they are filling out the Employee Information form, turn on ' location feature. Click on the Employee Information form to highlight it in the workflow designer. On the Property panel that displays on the left, Click on General Settings. Scroll to the last tab. There is a tab for the Geo - Location feature. We added a rule to the Employee information form to take advantage of the iPad location services earlier in this tutorial. Once you have the rules in place, you can choose to have the rules execute when the form loads (the On Load) option of the Geo-Location dropdown or specify a custom time period of how often the rules should execute (the custom option of the Geo Location dropdown). Check Detailed Location to capture additional information, like an address, based on the location.

Image RemovedImage Added

Setup Task Information

...

  1. Enable the Quick Approval Slider.
  2. The Approval Control will display all sections of your form that meet the criteria of an Approval control. In this case, there should only be one - the Manager Review section of the Approval form.
  3. Select the Manager Review Option from the dropdown.
  4. Type a Summary statement that will appear on the Task List, if desired. This is essentially the same as the Task Information so if you have set that up already you can leave the summary blank.  To add the new employee Personal Email Address to the Quick View, type the left curly bracket - { - then  begin typing the name of the Personal Email Address control. Click on Personal Email Address when it displays in the dropdown list. This will add the Personal Email Address information to the Quick Approval summary as a templatized string
  5. The Manager Review section should be listed in the Approval Control box. 
  6. Click the save and exit icon to close the wizard. You will see the lightening bolt on the Approval workflow activity if Quick View is setup correctly.
Section
Column
width50%


Image RemovedImage Added

Quick View Wizard

Column
width25%


Task List on Jerry's iPhone

Column
width25%

 

Quick View on Jerry's iPhone

...

  1. Log in as the designer. Click on the Spaces tab.
  2. Click Add to create a new space, type a Space ID and Space Name, and then click Create. You will be directed to the space designer.
  3. Since we set the state of the Employee On Boarding workflow to Production in a previous step, it will automatically be included, along with the Task List as menu items in the newly created space. 
  4. Verify that the left panel is hidden. If not, click the  icon to hide it.
  5. Select regular for the form width from the Min Width dropdown on the Property pane.
    Image RemovedImage Added
  6. If your tenant is in the cloud, click the Save and Exit icon and proceed to the Test the Employee On Boarding workflow section.
  7. If you are using an in-house installation,
    1. Click the menu edit icon. Replace the <localhost:8082> in the urls for the Task List and the Employee On Boarding workflow with your server name and port. If you are concerned about portability to another system, make the URL's relative by removing the protocol, server and port information.
    2. Click the Save and Exit icon to save the changes and proceed to the Test the Employee On Boarding workflow section.

...

  1. Logon to your tenant as the designer on your desktop.
  2. On the Spaces table, click the  Action Menu for your space and select Share.
    Image Removed

...

  1. Live Forms displays your space's URL — this is the link you distribute to those who you want to view your space. Remember, this workflow is designed to only be accessible to users who are logged into the tenant.


     4. Type the Share url for your space into a browser session on the iPad. Your space will look similar to the image below, when accessed from the iPad.

...