Introduction

Welcome to Workflow Fundamentals. In this chapter we will learn about all the key techniques and principles to create our first application workflow in PhixFlow that models the logic of our business processes.

Concepts

To find out more about the key concepts for Workflows in PhixFlow before you take the course below, or simply to refresh your memory, see Creating Workflows.

Video Demonstration 

Watch the video demonstration, then complete the task list below.

Fundamentals Tasks

Finish the tasks below to complete the Fundamentals course.

Task 1: Create a Workflow

1. Select  Workflow from the PhixFlow home page

2. Click  Add New 
3. On the Create Workflow window that appears:
   1. Name: Customer Approval
   2. Select Create

Task 2: Add Nodes

1. On the workflow, click and drag the  Analysis node from the toolbar onto the canvas

2. On the  Create Analysis Model window:

   1. Name: Collect Companies

   2. Press Create Analysis Model

Task 3: Add and Change Swim Lanes

1. Right-click on the Swim Lane on the left of the screen, and choose  Edit
2. On the  Properties, in the Basic Settings, change the Label to:
   1. Web
   2.  Apply and Close your changes
3. Right-click on the Swim Lane, Web, and choose  Add lane after
4. On the  Properties, in the Basic Settings, change the Label to:
   1. Sales
   2.  Apply and Close your changes

Task 4: Rename Nodes

1. Add a Screen node for the screen you created in 3. Screens Fundamentals, by clicking  Screen on the toolbar 
2. The list of screens in your application appear in the  Repository
3. Click and drag the Companies List screen onto the canvas
4. In the node  Properties, change the Name to:
   1. View Companies List
   2.  Apply and Close

Task 5: Connect Nodes

1. Hover over the  Collect Companies node and select the  icon
2. Then click on the  View Companies List node to connect the two nodes together
3. From the toolbar, click and drag an  Actionflow node onto the canvas
4. On the  Create Actionflow window:
   1. Name: Open Companies Form
   2. Actionflow: select the  button
      1. Name the Actionflow: Open Companies Form
      2. Click Confirm
   3. Click Create Actionflow
5. Connect the nodes by hovering over the  View Companies List node and selecting the  icon, then click on the  Open Companies Form node

Task 6: Screen Creation

1. Create another screen for editing a company by clicking and dragging a  Screen node from the toolbar onto the canvas
   1. Name: Companies Form
   2. Press Create Screen
2. Connect this screen to the Actionflow by hovering over the  Open Companies Form node and selecting the  icon, then click on the  Companies Form node
3. Double-click on the  Companies Form nodeand select Yes to the Confirm message
4. On the  Create Screen wizard, set the following:
   1. Name: Companies Form
   2. Open Maximised: toggle off 
   3. All Users can View Data: toggle on 
   4. Template: Edit Form
   5. Press Create Screen

Task 7: Unconnected Actions

1. Click back onto the Customer Approval Workflow tab
2. Double click the  View Companies List node
3. The  Properties for the screen will open on the right
4. Click the  Actions tab
5. In the Unconnected Actions section, click and drag the Open Companies Form action onto the Edit button on the screen

Task 8: Actionflow Creation

1. Click back onto the Customer Approval Workflow tab
2. Double-click the  Open Companies Form node to open the Actionflow
3. On the Actionflow, under Connections, select Click to Connect
4. Choose   On Click, then press Connect Input
5. Click and drag the  input onto the  Open Screen (Companies Form) node

Task 9: Add Embedded Workflows

1. Click back onto the Customer Approval Workflow tab
2. From the toolbar, click and drag a  Workflow node onto the canvas
3. On the  Create Workflow window:
   1. Name: Onboarding Workflow
   2. Press Create Workflow
4. From the toolbar, click and drag an  Actionflow node onto the canvas
5. On the  Create Actionflow window:
   1. Name: Submit
   2. Actionflow: select
      1. Name: Submit
      2. Click Confirm
   3. Click Create Actionflow
6. From the toolbar, click and drag an  Actionflow node onto the canvas
7. On the  Create Actionflow window:
   1. Name: Save
   2. Actionflow: select
      1. Name: Save
      2. Click Confirm
   3. Click Create Actionflow
8. Hover over the  Companies Form node and select the  icon, then click on the  Save node
9. Repeat this to connect the  Companies Form node to the  Submit node, and the  Submit node to the  Onboarding Workflow node

Task 10: Add External Nodes

1. On the toolbar, hover over  External, then click and drag a  Send Email node onto the canvas
2. On the  Create Send Email window:
   1. Name: Email Accounts
   2. Press Create Action
3. Hover over the  Submit node and select the  icon, then click on the  Email Accounts node

Task 11: Add Descriptions to Nodes

1. Click on the  Email Accounts node

1. In the  Properties:
   1. Description: Email Account Managers
   2. Press  Apply
2. Hover over the node on the canvas to see the description

Task 12: Add Labels to Connectors

1. Select the connector between the  Companies Form node and the  Save node
2. In the  Properties:
   1. Label: Save Details
   2. Press  Apply
3.  Save the model

Further Reading (Optional)

For more information on the topics covered in this chapter, see the below links.

• Creating Workflows
• Adding Content to Workflow Models
• Workflow Swimlane
• Workflow Model Elements

 Congratulations!

You have completed the Fundamentals course and have created a simple application. Feel free to play around with your application and add extra features, if you wish. Why not try Adding Grid Icons and Interactive Icons or try Adding a Navigation Menu Bar?

Next Steps

If you are interested in learning more about specific areas of PhixFlow, such as, screen building and data analysis, complete one of our full courses. Find these in the Learning Centre, along with other helpful resources and how-to articles.