By now, you should already know what a flow means, how you can create one and share it with your colleagues. As we already said, the sky is the limit in terms of flow complexity. Being able to use an unlimited number of components in a single flow, there is probably no business process that can not be designed and automated in Appmixer.
Let's go through some examples of how flows can be used, and most importantly, how they can help you automate processes and sync data between different platforms.
In this example, we demonstrate how to forward customer support calls – or calls in general – to customer service, but only if the PIN provided by the user is known.
Twilio is a good voice & SMS API that we take advantage of. An alternative would be to use Plivo which is provided as a built-in app in Appmixer too. Of course, you can use any other tool of your preference (provided the component exists or you build it yourself).
In this example, we will use two apps: Twilio and Google Sheet. Below, see an overview of our flow.
We start with a trigger component that is activated when a call is received on our Twilio number.
As soon as a call is received, we want to ask the user for their PIN code. We can use the GatherCallInput Twilio component to do that. Let's fill in the message and enter parameters of our PINs – number of digits and finish key.
Next, we want to match the user input with values in our database using the Google Sheet component. In other words, this component helps us check whether the PIN already exists in our database or not.
As you can see, there are two paths from the Google Sheet component: out and notFound. We want to set different scenarios for both of these. Let's start with the case where we found the PIN in our database.
The initial goal of this flow was to forward the call to customer services, remember? Now it's the right time to set the ForwardCall component.
If we don't find the PIN in our database, we want to answer the user pointing out we haven't found her PIN, and that her next steps should be to get in touch with our sales department.
Done ✅ We can start the flow now, and make the first step to streamline our customer support processes.
In the following example, you'll learn how to feed data about your customers to Mailchimp.
A lot of 3rd party apps provide real-time notifications with Webhooks, i.e. they call a registered URL with data every time a certain event occurs. How do you easily store this data as e.g. new contacts in your marketing automation software or a CRM tho? This example flow shows you a simple yet effective way.
Before we jump into how the flow has been set up, see the flow overview below.
As you can see, we're expecting HTTP requests to our Webhook component and feed the incoming data like new subscribers to our Mailchimp account.
The Webhook component gives you a URL that you can copy-paste to your 3rd party app. Here is how to get started.
Whenever the Webhook URL is called by the 3rd party app, we want to create a new subscriber in our Mailchimp list with the email address received from the Webhook. Here is how to set it up in our flow.
Notice we selected the "data" variable in the "Email" field. This variable is coming from our Webhook component.
To set up the flow properly, you need a certain knowledge of the data structure that the 3rd party app sends to the Webhook. Browse through the documentation of the 3rd party app to find out.
In our case, the Webhook receives a JSON object with an "email" field. Therefore, we need to extract that email field from the incoming JSON data. By clicking on the Variable, we bring up the Modifier's dialog.
Notice we've selected the "JSON path" modifier and type "email" into the "Path" field.
All that remains is to start the flow and we're all set! Our Mailchimp list will now receive a new subscriber whenever our Webhook is called. 👍
As a bonus, we can also send the subscriber to our Slack channel for everyone to get excited about our newly registered users.
Now that you know how to feed customer data to Mailchimp and notify your team, it's time to look at our last flow example. This time, we will set up a pretty sophisticated flow that helps us approve documents more efficiently.
In this example, we will set up a flow that watches for new documents in our Google Drive “Before Approval” folder. Each new document added to the folder generates a new human task for a manager to manually approve the document. This task will be sent to the manager’s email address as an email with two buttons – "Approve" and "Reject" – together with a link to the document.
Once the manager approves it, the document will be copied to the Google Drive “Approved” folder. If the manager rejects the document, it will be copied to the “Rejected” Google Drive folder. At the same time, a Slack notification is sent to a channel with the resolution.
Seems like a lot of work? Not with Appmixer. Let's get started!
Before we uncover all the steps required to build such a flow, let's start from the end and see what the flow looks like in Appmixer when it's complete.
Let's see how we've built the flow from scratch. First, we need to set up the trigger. In this case, the flow starts every time a new file gets uploaded to the "Waiting for approval" folder in our G-Drive.
We want to notify the approver via email. Therefore, we need to use the "RequestApprovalEmail" component under the "Tasks" module. As said earlier, this module makes sure the relevant person receives an email where he or she can easily approve or reject the document. First, we set the Task title and Description.
Next, we need to define the Requester and Approver emails.
Last but not least, we need to set the "Decision by" date. Here, we will use Modifiers and will set the due date to the time the document was created + 24 hours. In other words, the approver has 24 hours to approve the document after it's been uploaded to the "Waiting for approval" folder.
Notice there are three paths from the Tasks component: approved, rejected, and due. As the names suggest, "approved" sets the path once the document gets approved, "rejected" allows you to set a different path in case the document gets rejected, and "due" helps you adjust the flow when the task is due. In our case, we want to notify the approver via SMS.
When the document gets approved, we need to export the relevant file from our G-Drive and upload it to the relevant folder.
Moreover, we want to send a Slack message every time a document gets approved.
Notice how we've used Variables throughout the setup. Thus, we will make sure the flow works with the right file throughout the execution, and we get a notification on Slack with a better context (using the file name and web link in the message body).
Now when the "Approved" path is set, let's finalise the "Rejected" path. To save you a little bit of time, see the already set up path below. Needless to say, the process for similar to setting up the "Approved" path.
As stated above, we want to notify the approver via SMS when the task is due. This way, we reduce the risk of tasks being forgotten.
We're all set now. When we start the flow, upload a file to the "Waiting for approval" folder and the file gets approved or rejected, we should see in the Logs that the flow runs successfully.
You may wonder, how does the approver approve or reject the documents? Glad you ask. In this case, the approver can either hit the "Approve" or "Reject" button in an email that is sent as part of the "RequestApprovalEmail" component...
... or he or she can visit the "Tasks" dashboard where she sees all the tasks.
As you can see, instead of logging into a G-Drive account, finding the right folder, opening a document, and then moving it into the right folder (Approved or Rejected), the approver hits a single button and Appmixer takes care of the rest. Simple, yet very powerful.
This tutorial shows you how to import a CSV file, calculate an average value from a numerical column and send that value via email.
Our flow is configured to trigger as soon as the flow is started, imports a CSV file that we uploaded via the file upload interface of the CSV.ImportCSV utility, gets all the rows, calculate an average age of the persons in the CSV and sends the result via email. Our flow looks like this:
The ImportCSV utility from the CSV module is simply configured to read a file that we selected from our file system by clicking on the "Select file" input field:
The content of our CSV sample file looks like this:
The configuration for the GetRows component uses the fileId variable from the ImportCSV component for the "File ID" input field. We also disabled the "Filter rows" parameter since we're interested in getting all the rows from the CSV file, not just an extracted subset. Also note that the "Row format" is set to "Object" so that the component gives us a formatted JSON list of all the rows in the form [{col1: val1, col2: val2}, ...].
Next, we configure the final SendEmail component to send an email with the average age. The trick here is to calculate the average age by modifying the rows variable returned from GetRows component.
By clicking on the rows variable, we can configure our modifiers (data transformation functions) that calculate the average by first calculating the sum of all ages and dividing it by the number of items in the rows list:
Note that the modifiers can be stacked to produce more complex expressions. In the example above, we first "Pick" the age column only, apply "Sum" to the values and "Div" by the length of the rows list. Note that the length of the rows is defined by applying the nested "Length" modifier which we can do by clicking on the rows variable in the "Div" input field:
A good practice is to test your modifiers using the "Test" functionality of the Modifiers panel:
This is it! Now when we actually run our flow, we'll see a new email in our inbox with the average age of all the persons in our CSV file:
As a bonus for advanced users, we can also use a "low-code" alternative to our modifiers above by defining a JavaScript function modifier that will give us an average of values in our age column:
As you can see, the "JavaScript Function" modifier takes an arbitrary JavaScript code in which you can refer to the original variable with the $variable placeholder.
