Several contact center clients have asked for a way to display one-time notifications to agents when critical parts of an interactive decision tree have changed. This is easily accomplished using Zingtree’s Agent Update Alerts.
An agent alert appears like this:
Some key points about Agent Alerts:
The agent cannot continue to use the tree until they dismiss the alert.
Once the alert is shown to an agent, he/she will see it just once.
Alerts can appear on subtrees (trees launched via tree nodes), or the starting tree.
You can add and manage alerts from Account, My Agents, Agent Alerts.
Alerts are tied to specific trees. Currently, there are no universal alerts.
The Push Live mechanism has an easy way to optionally add an alert.
If you have multiple alerts set, they will be combined into a single alert message, rather than showing one-by-one.
Managing Agent Alerts
Alerts can be added, deleted or modified from a single place. Here’s how to manage them:
Go to Account, My Agents.
Click the red Agent Alerts button. The Alert Manager appears:
This page shows all active alerts for every tree in your organization. You can see alerts for specific trees by choosing the tree from the drop-down.
To add an alert, click the Create New Alert button.
To delete an alert, click the delete icon next to an alert
To change the alert text, click the edit icon next to the alert.
Push Live Shortcut
If you’re using the Push Live tool, you can add an alert when you do a push.
Alerts created in this fashion can still be maintained using the Agent Alerts manager.
Alert us if you find this feature useful, or have a suggestion to make it even better!
Implementing a personalized or branded color scheme, along with icons that relate to your company, will keep an easy-to-follow and digest structure throughout your support process. An interactive decision tree is the easiest way to help a user with visuals, where they can follow the trees effortlessly while being able to really learn from the guided instructions.
We’ve detailed each customizable element – and examples of how to use them correctly – to make your end-users even happier about their customer service experience!
1. CSS & Personal Style Customizations
Colors and icon choices communicate in subtle ways and can reinforce your brand and mission. Here are some ways to manage these:
We made it easier to adapt your decision tree to your personality or brand when customizing so your tree can fit your desired color, custom CSS files being the main one. Once you have created your ideal profile, you can simply add it to your decision tree product finder which will help reveal your true brand identity.
We had feedback from our users suggesting that it would be more user-friendly if we included a feature of animated themes, including colors but remaining easy-to-use. Our design team and engineers set out to create this recommendation with the main goal of making tree color customizations easy.
See the endless possibilities in this quick, fun video:
Color buttons and icons
Here’s the feature that will allow you to build your own personalized color buttons, icon imagery or even to include emojis within your page titles and buttons. To customize the style of your buttons, all you need to do is prefix the button text with special classes. For example, for your color buttons, choose:
To add an icon that helps guide your customer but also helps reveal your brand personality, add one or more of these classes:
2. Visual Features for Creative Support
Video content is shaping user satisfaction across the internet. And with many uses and forms, this is something that more people are demanding, which is why video is the best way to improve your user experience. GIFs are also actively being incorporated into decision trees making the user experience more rewarding. A short clip of a difficult instruction, being repeated several times after 3 seconds or so makes the process of self-service a lot easier to follow.
When including still imagery, diagrams or other graphics into your customization, you are allowing the customer to be at the same pace when working towards a solution. Having reminders follow your tree also makes the service more user-friendly.
There are two main features when using visual aids with a decision tree, one is the effectiveness and the second is interactiveness. It’s so easily done, you can add it to any node you want.
3. Easy Data Collection and Presentation
The use of document nodes can be used for specific types of customized documentation that prove highly beneficial to the self-service aspect of support. Documentation can include building legal agreements, generating purchase orders or even a lead to a returns label that the user has personally generated.
4. Messaging & Translations for Understanding
When publishing across multiple languages, creating a decision tree that works interactively for these can become complicated. With the translation customization, you can reach a larger user base who need the language localized. With localization management software, along with other custom support features, your users will find your platform much easier to follow. You can follow our instructions here on how to translate your decision trees.
It all starts with a good base of messaging, however. When communicating throughout your decision tree, you should write well and use industry language that is helpful and informative. For nodes with poorly descriptive language, it creates confusion and incomplete results. Here are some of the basics of writing effective nodes that will help you write informative questions that lead to a better, more personal experience.
Make questions concise by focusing on one subject at a time and structuring to an easily absorbed manner.
What not to do:
If our system of tutorials and articles hasn’t been helpful, do you think you would consider switching service providers?
What to do:
Would you consider another provider if you were not able to self-solve using our knowledge base?
Use the right language so that every user can navigate through your tree knowing the subject and words being used.
What not to do:
What kind of issue or problem is happening with your account?
What to do:
How can we help? Please select a category.
Focus on an active voice soyou can communicate areas appropriately that identify awareness of the issue within that action.
What not to do:
Our recommended guidelines and instructions for solving your issue should be followed as written below.
What to do:
Follow our recommended guidelines below to solve your issue!
When navigating through the creation of your decision tree, have the customer at the forefront of your mind, and keep questioning the end user experience. If you need any other assistance, reach out to us so we can assist you with the best self-service solutions.
This article was originally published on November 14, 2017, and has been updated for accuracy.
Salesforce Lightning is the new, modern rewrite of Salesforce Classic, and can work well for Call Scripting. And as Lightning evolves, it is getting better at interfacing with pop-up applications like Zingtree, although it still lags behind the capabilities of Salesforce Classic. Here’s what can be done as of March, 2018.
Here’s a quick video showing how the agent experience works. Unfortunately, Lightning doesn’t let you launch a new pop-up window like Classic does. It has to open in a new tab, and only after clicking a “confirm”.
Within your Salesforce setup, you can create a new custom button or link.
In Lightning, go to Setup, Object Manager, Case, and create a new Detail Page Button or Detail Page Link:
For the URL, make it look like this (substituting the tree ID of your script for #########):
Everyone prefers their own way of creating, and it can come in many forms. To address this, we built Zingtree with a few different ways to design and construct an interactive decision tree (as well as some great ways to publish them!). For the more visual learner, the Zingtree Visual Designer allows you to draw out your decision tree.
This “whiteboard” style lets users create nodes, along with their connections, and see the nitty gritty details of how the tree functions all on one screen. In terms of ease-of-use and full-scale layout views, Visual Designer really can’t be beaten.
Here’s how to get started with the Visual Designer:
1. Once you log in to your Zingtree account and start Designer, you’ll see a screen that looks like the one shown below, with one node already in place as a green box. This is the very first node your users will see and interact with.
2. Double-click on the Node you’d like to change and an edit window will pop up conveniently to dig into. You can edit the Title, Question and main Content segments to your liking, as well as add in any Data Entry fields.
3. Drag new nodes into the design area – these correspond to the pages in your decision tree. Again, select the green box to edit each node’s Question, Content, etc.
4. Add a Final Answer Node and edit to fit your needs, when you’re ready. These will appear in blue, to differentiate from your green Question Nodes.
5. Continue dragging new nodes into the design area to create these Questions & Answer Nodes, and then connect them using labeled arrows. The connecting arrows represent the button selections from each node.
6. Finish linking all of your nodes using this method, and you’ll end up with a finished product that looks something like this image below. You can click on any node or button/arrow to highlight connections and see more detail.
Please keep in mind that things can get confusing for more complex trees that require more nodes.
BONUS TIP!Automatically re-arrange the nodes in your decision tree visually with just a single click, so you can more easily see every node and connection without constantly opening each one.
For a more in-depth tutorial, watch this video to see how to build the example tree above using Zingtree Designer:
Besides using Single Sign-on to limit access to your Zingtree decision trees, a simpler way to do this is to leverage Google Sign-in to verify the identity of agents or employees using your trees. This is incredibly easy to implement. In short:
Add a list of authorized agents to your organization using the My Agents tool.
Enable Google Sign-in Verification in Zingtree.
Make sure each agent is logged into their Google accounts.
For example, if you have added an agent identified as firstname.lastname@example.org, if Joe is logged into his Google account as email@example.com, he will have access to your trees. If Joe is not logged into his Google account, he will be prompted to do so.
Setup Details – Step by Step
Each agent must have their own Google account.
The Zingtree setup is all done from the My Agents area:
First of all, add your agents to your account as follows:
Go to Account, My Agents.
Click Add One New Agent or Add Multiple Agents.
Finish the prompts to add agents. The agent logins must match their Google logins.
Next, click the Enable Google Sign-in Verification button.
When all is set up properly, your My Agents page will have a list of agents, and look like this:
Agent Portal Link
If your agents are using the Zingtree Agent Portal, a special link to the portal will appear at the bottom of the My Agents page like so:
Give this link to all agents using the Agent Portal.
Other Means of Access
If agents are using trees embedded into linked from a web page or CRM, the login process will happen automatically. There’s nothing else to set up!
Adding Agents via the Zingtree API
If your company has a central area to provision agents, you can add and remove programmatically them using the Zingtree API. See the agent_add and agent_remove calls.
Some of our larger customers have asked for a simple process for managing changes to their decision trees. When there are multiple people involved in making edits, and the final versions need approval, the Zingtree Push Live tool makes this procedure a breeze.
Push Live lets you have two versions of a tree – a development version and a live version. Your team makes changes to the development version, and when these changes are ready to go live, an administrator approves these changes by invoking the Push Live tool to update the live version of the tree.
Using Push Live is optional, and can be implemented at any time.
Here’s how Push Live organizes the publishing process:
An author or authors make changes to a tree.
Once the new tree is approved for release, an adminmistrator invokes a Push Live so that the new tree is available to end-users and agents.
All changes and push events are tracked through the Snapshots tool.
Here’s how to set up a tree for Push Live:
Select your tree from My Trees.
Go to the Settings tool, click the Push Live tab, and check Enable Push Live.
Make sure to click Update All Settings next.
Managing Live and Development Versions
You can switch between the development and live version of your tree from the main Tree Tools screen. Go to My Trees, and select a tree, or use the All Tools option in the Tools drop-down on every page.
Select Development or Live from the Version selector:
IMPORTANT: Use Live Publishing Links
The live version of a tree has different links than the development version. Make sure you are using the Publishing Links code for the live version of your tree by switching to the live version before using the Publishing Links tool.
The tree ID for the live version of a tree is the same as the development version, except that it adds 000 to the end of the ID. For example: If your tree ID is 123456789, the ID of the live version is 123456789000. So you’ll need to use different publishing links when making the live version of your tree available to others.
Pushing Changes Live
In order to update the live tree, you need to have Administrator rights on that tree.
Once you’re ready to “go live”, invoke the Push Live tool from the main Tools page, or the Tools drop-down. You’ll be asked for update notes on this version, which makes it easy to track what changed.
You can see the history of changes (with the update notes) for each update of the live version using the Snapshots tool (under More Tools).
Using Tree Nodes with Live Versions
If you have several trees under the Push Live process, and you are using tree nodes to link them together, Zingtree will ensure the proper development or live version is linked. When editing in the development version, use tree nodes that reference the development versions for your other trees. When you push live, those tree nodes will go the live versions of the other trees if they exist.
Here are the rules:
Tree nodes in the development version go to development versions of other trees.
When you push live, tree nodes in the live version go to live versions of those trees.
If a live version of a tree node doesn’t yet exist, the development version is used instead.
Give Us Feedback!
Is this Push Live feature useful to you? Do you have any suggestions to make this process work even better for you? Let us know!
We’ve had several requests to create a final, single page document based upon answers to decision tree questions. Zingtree’s Document Nodes makes this powerful document generation capability a reality.
With the help of Document Nodes, you can now complete tasks like:
Hint: Once the content from an answer node is inserted, it won’t be inserted again.
Use a node that shows your variables while you are testing. The What Computing Devices do I Need example tree uses Node #10 as an ending piece in the Document Node so you can see the value of all of your variables.
The What Computing Devices do I Needtree demonstrates a simple tree with a Document Node at the end. This tree helps an end-user decide whether they need a phone, tablet or desktop PC, based on the answers to some questions.
As end-users are using your Zingtree decision trees, you can add any information collected during the session into a MailChimp mailing list. Zingtree has a handy MailChimp App for just this purpose.
Here’s how to add data from Zingtree to a MailChimp list.
In Zingtree, go to Account, My Apps, and click add Add MailChimp. The MailChimp configuration screen appears:
Enter a name for this App. For example: “Add to Mailing List”.
Enter the MailChimp API Key. To find your API Key, log into MailChimp, and select Account, Extra, API Keys. Generate an API key if you haven’t done so already.
Enter your MailChimp List ID into the configuration. In MailChimp, click Lists, then select Settings from the drop-down next to your list. The List ID will be at the bottom of the page.
Click Add MailChimp App when finished.
Edit the node where you want to add to a MailChimp list. Look under Show Advanced Options, Send Message To App. Pick the name of the app you just created: “MailChimp: Add to Mailing List”.
Important: The field names you are using in Zingtree must match the merge tag names in MailChimp. So if you have merge tags NAME and ADDRESS in MailChimp, you would use variables named NAME and ADDRESS in Zingtree. You can find the merge tags for each field in MailChimp from List, Settings under List fields and *|MERGE|* tags. They will appear like this:
In Zingtree, the email address of the end user should be a variable named either EMAIL or email.
Once the end-user reaches the node you built in step 6, MailChimp will receive the information collected by Zingtree and add all matching fields to the list for email.
Do you have a cool application for this feature? Let us know on our Feedback page.
If you’re using Data Entry Fields or Merge Variables to bring data into your decision tree session, you may want to perform basic math operations on these variables. Zingtree offers a stock webhook option that lets you assign a new variable to the results of an addition, subtraction, multiplication or division operation. Here’s how to set it up:
Edit the node where you want the new variable (the result of the math operation) to be calculated.
Click on Show Advanced Options.
At Send message to app, choose Webhook: Zingtree Math.
In the Message, you’ll need to provide the operation, the two variables or values to calculate, and a variable name for the result. In the example above, we’re assigning a variable named result to the sum of variables a and b. Variables must be enclosed in # characters.
Here are some message examples:
Sets variable c to 5+3
Sets variable net to the difference of variables gross and expenses.
Sets variable days = weeks * 7.
Sets variable weeks = days / 7.
You can use the following in the op= parameter:
The Zingtree Demo gallery has an example. You can try it and examine it.
One of the process issues we’ve faced as a company is the amount of time it takes to coordinate scheduling online demos for prospective new customers. If only there was a way to intelligently gather background information from each prospective customer, and then route the requests to the proper team… oh, wait! Zingtree can do that.
If you request a demo from our Contact Us page, you’ll launch a decision tree that determines what sort of customer you are, gathers relevant background information, and then opens a scheduler built with Calendly for the relevant team.
Calendlyis really well designed, and about as easy to use as possible. You can set up individuals or teams, and Calendly accesses their Outlook or Google calendars so that the available times are shown for each person or group. Rather than having a ton of back-and-forth with every party involved, our customers can quickly see when we are available, and pick a time that works with their schedule.
Calendly also lets you pre-fill custom forms used in the scheduling process. So besides name and email, we create a backgrounder using Zingtree data entry fields and button click variables for each meeting request. Our calendar entries include something like this:
name: Joe Customer
company: Acme Widgets
Use_Case: Internal & External
Agents: up to 10
data_transfer: Send from Zingtree to another App
features: how to create trees
business: We manufacture widgets
how_help: save time in support
Not only do we make it convenient for the customer to provide this information to us, but also this helps us prepare properly for each meeting.