BlogIntroducing Action Flows: The Frontend Logic Builder

Introducing Action Flows: The Frontend Logic Builder

Ambar on March 10, 2021

DronaHQ unlocks the power of innovation for low-code by introducing Action Flows. 

How? Let’s see.

Say you are building a customer portal for your sales representatives that integrates with your database (MongoDB), ticketing system (Zendesk), and payment system (Stripe). So when an SDR is qualifying a lead, you need the SDR to fill in some more details; with the click of a button, and a screen pops up with 4 to 5, Yes/No questions, based on which the database is updated.

How do you implement such unique processes in your application’s front-end, as they are specific to your business?

With DronaHQ being a low-code platform, we have always worked towards providing our customers’ best user experience and offering them the latest app development capabilities. Using action flows, all this becomes extremely easy. The features or tasks that are more oriented towards the client-side of the process can now be done by building a logic flowchart or a code to perform a specific set of frontend actions.

Action flow is a front-end logic builder with more orientation towards completing on-screen actions like push notifications, event triggering, etc. It provides you the capabilities to visually build your custom actions on the screen and give an immediate response on the completion of the action on the client side. 

In this podcast, Jinen Dedhia, Co-founder and MD of DronaHQ, introduced us to Action Flows and how it will change the face of low-code app development.

Tune in to find out:

  1. Why does a front-end logic builder matter?
  2. How it impacts low-code app development?
  3. In what ways action flows can be used in business apps
  4. How do action flows work?
  5. How is action flows different from backend/server-side logic?
  6. How customers are using action flows to enhance front-end capabilities

Flexibility to build more sophisticated front-end applications

When DronaHQ first came out with workflows, it was responsible for all the logic building in the app. The user had to move the workload into workflows (i.e., back-end side) for tasks like event triggering, push notifications, setting/resetting values, etc. Thus, all the heavy lifting had to be done on the workflow side. With the help of action flows, this feature was updated by dividing the workload, but that is not the only thing that was achieved. When you are looking at a lot of applications today, they are powering up in the front end. 

 

 

For example, depending on an API’s response, you might want to throw some alert boxes, and you might want to show appropriate success or failure messages. Another example, depending on the output, you might want to set some values, reset control/pages, or navigate to some pages all together. 

Action flows allow you to do these tasks and give you a lot more flexibility to build more sophisticated front-end applications. So it adds tremendous power to the low-code platform in terms of its capability to build powerful front-end applications. 

Creating Fantastic User Experiences with Minimalistic Coding

We believe that low-code will take that trajectory because it’s a fantastic way to create applications at lightning speed with minimalistic coding. The more we work with our customers, the more we understand what is required. The customer obsession is allowing us to add the right features and the right capability into the tooling, and now with the help of action flows, the user can do more with the platform in an extremely meaningful way. Our challenge always has been how to keep things simple and yet make them powerful. And we think drawing that balance is where we believe we are doing a great job.

For example, one of the applications that we, at DronaHQ, primarily use internally is a CRM application. Because of action flow, the entire application has become exceedingly powerful because of our ability to do small little stuff without going to the workflow.

Let’s assume like when we’re adding notes into every case. It’s hitting right up into the system there, and then the user gets to see it. We get to see it getting appended into the notes. Now that’s ideally what the user really wants. So it’s not just a data capture anymore, but it’s coupled with a fantastic user experience.

How To Use action flow in DronaHQ Studio

On the right-hand side of the menu, for every control, whichever is supporting an action framework. You would see a small thunderbolt kind of stuff over there. You click it, and then there is an entire workflow like building tooling, which is available. You could go about a step-by-step, like building an entire flow of what happens when you click on that specific button or a placeholder in your control. (Use action flows)

 

 

Behind the scenes of action flows

When you click on the action button, you generate an event. That event is what you define in the action flow, what the user defines when he/she puts in all those blocks. 

So, for example, you might want to set an alert or navigation. Or, you might want to open a new micro app, or you might want to call an API. You can also operate some of the DronaHQ features like updating a sheet or doing a push notification. So those blocks are kind of the building blocks of what happens behind the scene. Depending on how you would have structured it, your action flow would be like, you know, get executed onto your front-end device or web application. 

Action flow vs. Workflows/Server-side Logic

The simple answer is action flows where work happens, on the front end side on the device, on the user’s end. Workflow is behind the scenes. So the moment you submit, it becomes an area of task that gets added into your back-end systems to work on. That’s a fundamental difference between the two.

Action flow in a Custom Calculator

Recently one of our customers was using action flow brilliantly. They were creating a customized front-end calculator of some sort, and it needed data from various things that the end-user is computing. Depending on the choices/selections that the customer made, there are many rules applied. Certain new things are to be shown, some to be hidden. That entire use-case was simple, and depending on the values you are putting in, you need to call specific APIs and bring in some data. And depending on that data again, some more APIs have to be called. In a nutshell, they were creating a very complex calculator and were able to do it very beautifully.

Want your own smart customized calculator? Here’s how.

Action flow for Customer Success App using Shopify

Here is another customer of ours trying to build an app for a customer success team when they received a customer support ticket. For that ticket, an order ID had to be mapped on their e-commerce tool, which was Shopify. Depending on the order, the customer success team saw the product details for the customer, using the customer order ID, and this API integration happened on the action flow. Further, it was displayed on the front-end for the customer support team or the customer success team. This is a classic use case from the customer success point of view.

Get started with your own customer success tools now!

A simple understanding for you would be to look at action flows if you want things to happen more in real-time in your client-side requirements. If you want things to happen behind the scenes, for example, an approval flow and need human intervention, that will stay with the workflows. 

Start using action flows for your unique front-end needs, and let us know what you feel about it!