Versions Compared

Key

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

...

Test the Changes:

  • Test the workflow to the Client Approval step. Approve the PO.
  • Logon as the sales person (designer).
  • Click the Important Items tab then click the Task List.
  • Click the quick view icon. The Quick Approval screen will display.

     

  • If the client did not approve the PO and sent it back to frevvo with comments, the Sales Person can click the Details button to view those remarks.
  • Notice the text we added as the Quick Approval summary appears at the top.
  • Add a comment and click Approve. You will see the message "Task Successfully Approved".
  • Notice the Sales Approval section displays on the Sales Review, Manager and VP Approval steps.
  • Complete the workflow.

14 - Page Break for Mobile

What do you have to do to run the PO workflow on a tablet or smartphone? Nothing! 

Frevvoproduct
 automatically breaks up the form into steps and adds Back and Next buttons.
Frevvoproduct
 uses the device’s features, such as specialized keyboards, to create a user-friendly mobile experience. 

You can use the PageBreak control to customize the mobile page breaks on the PO step into small logical pieces. For example, our PO has Instructions, Sales Information, Client Information and Client Services Order sections. In this example, we will use the PageBreak control to display the Instructions, Sales and Client Information sections on the same screen on a tablet and and on two separate screens on a smartphone. We will add another PageBreak control to display the Client Services Order section on a separate screen on both devices.

Modify the PO Step

  1. Login to your frevvo tenant as the designer user.
  2. Open the Workflow Tutorial project, then edit the Purchase Order Workflow.

  3. Go to the Forms editing mode.
  4. PageBreak controls in your workflow display by default. If you want to hide them while you are developing your workflow, click the show/hide page breaks icon in the action menu.
  5. Drag a PageBreak control from the palette and drop it below the Sales Information section. Click on it and uncheck Tablet. This PageBreak control will only be recognized on a smartphone. 
  6. Drop a PageBreak control from the palette and drop it between the Client Information and Client Services Order sections.
  7. Leave the Phone and Tablet checkboxes checked.

  8. Click the  save and test icon. The Save and Test feature saves the changes to your workflow and allows designers to test forms/workflows without leaving the Workflow designer.   

Test the Changes

  1. When you click the  save and test icon, you will see the desktop view. The Instructions, Sales Information, Client Information and the Client Services Order sections display on the same screen. 
  2. Click the Tablet icon at the top. The Instruction, Sales Information and Client Information display on the same screen, as expected, since the first PageBreak was setup to be recognized on the phone and not the tablet. The second PageBreak was setup to be recognized by the phone and the tablet so you will have to click Next, to see the Client Services section.

  3. Click the Phone icon at the top. You will see the Instructions and Sales Information sections only. The first PageBreak was setup to be recognized on the phone so you will have to click Next, to see the Client Information section.  The second PageBreak was setup to be recognized by the phone and the tablet so you will have to click Next, to see the Client Services Order section.
  4. Close the Test window. Click the  save and close icon to save the changes to the workflow.

Feature - Screenflow & Fast Finish (Employee Onboarding Workflow)

In this example, we will switch to an Employee On-boarding workflow to demonstrate the Fast Finish feature that allows the user to fast forward through a screenflow. A screenflow is a type of workflow where all the steps are filled in by the same user. Fast Finish is very useful if your screenflow contains a lot of steps. Let's consider this scenario:

A new employee starts their first day at your company and needs to provide their information. The employee is handed an iPad with a link to an Employee Onboarding workflow that is used to collect basic information, W-4 allowances and Education information. When completed, the new employee clicks the Continue button and the workflow is routed to their manager for approval. If approved by the manager, the workflow is routed to HR for final processing.

Imagine the employee completes the workflow through the Confirmation step and then decides to navigate back to make a change to the Employee Information step. Without a fast finish button the screenflow will make the user review each step (Employee Info, W-4, Education Info and Confirmation) in order to submit the forms to the manager for approval. Adding Fast Finish allows the new employee to click on the Finish button and (if all required fields are complete and valid in all other workflow steps) immediately submit the forms to the manager for approval.

We will use the Navigation toolbar at the top to navigate back and forth between the steps of the workflow. We will configure Fast Finish on the first three steps. We will also need to add another role, HR and another user, Pam who has the HR role, to test it.

Add a Role and User

  1. Login as your tenant admin.

  2. Create a new role -  HR.

  3. Add a new user pam and give her the role HR. Logout.  

Review the Workflow

  1. Login as the designer.  Open the Workflow Tutorial project.
  2. Edit the Employee OnBoarding workflow.
  3. Click on the Employee step.
    1. Notice the Fast Finish property is checked in General settings on the Property panel.
  4. Click on the Allowances step.
    1. Notice the Fast Finish property is checked in General settings on the Property panel.
    2. Notice the Task Assignment is empty. Since this step is unassigned, it will function as a screenflow and be performed by the user who completed the previous step.
  5. Click on the Education step.
    1. Notice the Fast Finish property is checked in General settings on the Property panel.
    2. Notice the Task Assignment is empty. Since this step is unassigned, it will also function as a screenflow.
  6. Click cancel changes icon to exit back to the Form and Workflows Home Page.

Test this Feature

  1. Click the  Test icon for the Employee OnBoarding Workflow.

  2. The Employee Information step prefills the user name and uses the Geo-location feature to capture the user's location.  All browsers will show a pop up asking the user's permission to use their location. Click  to give permission.

  3. Fill in the other required fields. Click Continue.

  4. Fill in the W-4 Allowances. Notice the Total Allowances field is updating as you enter values for the other allowances. this calculation is done using a business rule. Sign then click Continue.
  5. Fill in the Education Information step. Notice if you check "yes"  for the "Permission to access college transcript" question a table requesting additional information displays. This is controlled by a show/hide business rule. Click Continue.
  6. On the Confirmation step, click Review Your W-4 form. The W - 4 will open in a separate browser tab merged with the data you entered.  This is an example of the 
    Frevvoproduct
     Pixel-perfect PDF generation feature.
  7. While reviewing the PDF, you realize you made a mistake when entering your social security number.  Close the PDF. 
  8. Click the Employee Information step in the Navigation toolbar at the top.
  9. Make a change to the SSN. Click the Finish button.
  10. The workflow will skip the Allowances and Education information steps and return you immediately to the Confirmation step.
  11. Review the PDF to verify the updated SSN is now displaying. Close the PDF.
  12. Sign then click Send to Manager.
  13. Logout as the designer.
  14. Login as Jerry. Perform the task. Add a comment and sign. Click Send to HR.
  15. Logout as jerry.
  16. Login as Pam and complete the workflow. 
  17. Logout of
    Frevvoproduct
    .

Feature - Summary Step

In this example, we will look at the Summary step on the Employee On-boarding workflow. This will simply display a Summary view of all the data that has been entered into the various steps of the workflow prior to the Summary step. Previously completed steps in a workflow can be viewed by all users but editing data is only allowed for the currently logged in user. Clicking on the Details button navigates to the selected step for viewing/editing. 

We will change the Navigation property to a different format and use the Summary step to navigate back to a previous step.  

Review the Workflow

  1. Login as the designer.  Open the Workflow Tutorial project.
  2. Edit the Employee OnBoarding Workflow.
  3. Click on the toolbar to display the workflow properties.
  4. Click the Summary Fields tab on the Properties panel. Designers select the workflow fields to display in the Summary step using this wizard. Note most of the fields in the workflow have been selected to display in the Summary Step.
  5. Clicking on the Searchable fields tab shows the First and Last Name fields in Step 1 have been setup as Searchable Fields. They can now be used as search criteria when searching submissions.
  6. Notice the Summary step between the Education and Confirmation Step. The Summary step displays the fields selected with the Setup Searchable and Summary Fields wizard and all the data that has been entered into these fields prior to the Summary step. Clicking on the Details button navigates the user to the selected step for viewing/editing.
  7. Click cancel changes to exit back to the Form and Workflows Home Page.  

Test this Feature

  1. Click the Test icon for the Employee OnBoarding Workflow.
  2. On the Summary step, click the Details button on a previous step to view the entered data.
  3. Change a value in one of the fields.
  4. Click the Continue or Finish button on the rest of the steps.
  5. Complete the workflow.

Feature - Save on Navigate

Imagine a large workflow with many steps - let's say 30. You are filling in the screens and when you get to screen 25 you accidentally close your browser! None of the entered information is saved and you will have to begin all over again. The Save on Navigate feature will prevent this situation by automatically save the workflow to your Task List. When you click the Perform icon to open up the task

Frevvoproduct
returns you to the last step where data was being entered. If you navigate to previous steps, all entered data displays.

Review the Workflow

  1. Login as the designer.  Open the Workflow Tutorial project.
  2. Edit the Employee OnBoarding workflow.
  3. Click on Settings in the Guided Designer toolbar to display the workflow property panel. Notice the Navigation property is set to Navigation Toolbar and the Save on Navigate checkbox is checked to turn the feature on.
  4. Click cancel changes to exit back to the Forms and Workflows Home Page.    

Test this Feature

  1. Click the Test icon for the Employee OnBoarding Workflow.
  2. Fill in the Employee Information and Personal Allowances steps in the workflow.
  3. Fill in the first column of the first row of table on the Education step.
  4. Close the browser.
  5. Open the browser again and login as the designer.
  6. Click My Tasks. The unfinished task will be on your Task List.
  7. Click the  Perform icon.
    Frevvoproduct
    returns you to the step where you left off. If you navigate to the Employee and Allowances steps, you will see that the information was saved but the data that you entered into the first column of the table on the Education step is not.
  8. Continue entering data from this point to complete the workflow.




...