Twilio StudioReviewed July 24, 2019
Twilio Studio is a node-and-wire workflow builder for phone and text related applications, such as IVR (Interactive Voice Response), chatbots, SMS surveys, and lead distribution via call routing.
The above video (19 min; it's just failed debugging after min 12) creates a "guess the number" text-message game. It demonstrates:
- adding and removing nodes from the screen
- sending text messages in response to text messages
- creating and referencing a JS function
- requiring a library from npm
- using liquid templating syntax in a node's value with solid autocomplete
- creating a looping pattern
The interface is aesthetically pleasing, and has good attention-to-detail. For example, the colors are hints at functionality: green for calls, red for triggers, orange for messages, grey for failures. Node-and-wire frameworks best visualize control flow (as opposed to data transformations) which is ideal for a series of texts or phone responses. Splits are easy to understand and follow, and loops are as simple as dragging a wire up the graph to a previous node. It's interesting to note that they've entirely abstracted over the asynchronous nature of the phone service, presenting what seems like a simple step-by-step flow.
Liquid Templating was a pleasant surprise, as it was familiar to me. It's simple and powerful. I was quite impressed by the power and convenience of their autocomplete menu for variable names.
As seen in the above video, full JS functions can be created from within the online IDE and easily referenced in the node-and-wire editor. They even allow you to import from npm!
Logs & Debugger
When an error is hit anywhere during execution, a debugger bug lights up orange. The log page is a very helpful resources. It stores the input and output values of every single node that was reached in every execution. The formatting of the data isn't ideal, but it's all there! No log statements necessary (for the node-and-wire editor; the JS editor still requires them occasionally).
Every single change, including superficial ones, are stored as separate revisions.
- Pass values functionally instead of all values as global, not passed in. This duplicates code.
- Work well in half-screen
- Autocomplete on liquid template functions
- Test executions from the web browser (without sending texts from a phone)
- See live values in widgets from past executions without having to go to the separate log page