Instrumenting Your App using ChurnZero DevLess

What is DevLess?

Knowing how your customers do, or don't, use your product is key to predictive customer health and proactive engagement. But for many Customer Success teams, getting time on the Development team's schedule to build usage tracking is a real challenge.

DevLess solves this. It lets Customer Success teams configure usage tracking without a heavy ask to their Development team: your Dev team inserts a small JavaScript snippet into your application, and any non-engineering user can then tag in-app actions using a panel launched directly within the application.

How Can I Instrument My App Using DevLess?

Step 1: Install the ChurnZero JavaScript in Your Application

To use DevLess, the ChurnZero JavaScript must first be installed in your application. Ask your Dev team to complete the first two sections of our JS installation documentation: "Install the Required Code Snippet on Every Page" and "Tell ChurnZero Who You and the User Are."

Once that's done, your Dev team's work is complete.

Step 2: Turn on DevLess Permissions

Turn on DevLess permissions for the ChurnZero user(s) who should have the right to create new Events via DevLess.

To add DevLess permission to one or more of your User Permission Groups:

1. Go to Admin > User Permission Groups.
2. Edit the Permission Group you want to grant access to DevLess.
3. Find DevLess - EventMaps and PageTags in the list of permissions and set it from "None" to "On."
4. Save your changes.
5. Refresh your browser window so your new permissions take effect.

Step 3: Start Your DevLess Session and Log Into Your Application in Another Window

Don't use a private or incognito browser session. ChurnZero needs to share cookies across tabs for DevLess to run successfully.

To start your DevLess session, go to your name in the upper right-hand corner and select Start DevLess. You'll get a confirmation dialogue that your DevLess session has begun; click OK.

Then, in a new browser tab, log into your application.

Step 4: Launch the DevLess Panel

Once you're logged into your application, open your Success Center by clicking its launch icon. If you don't have an active Success Center set up for the account you're logged in as, you'll still have access to your DevLess session. You'll see either the icon you set for your active Success Center, or the ChurnZero logo icon, which starts your DevLess session when you click it.

If you do have an active Success Center, click the wrench icon in the upper right to open the ChurnZero Content Panel. Use this panel to tag Events within your application.

Select Manage Event Maps from the DevLess Panel.

Step 5: Tag Events You Want to Track

If you add new Events via DevLess, those events go live immediately and start showing up in ChurnZero as your customers perform those actions. Be thoughtful as you save new events.

To begin a new Event:

1. Click the blue Add Event Map button.
2. Move your mouse around your application. Elements that are clickable, and therefore trackable, highlight in blue.
3. Hover over the element you want to track and click to select it.
4. Click the magic wand in the Content Panel to highlight your selected element.
5. If you don't like your selection, click the trash can to clear it.

Provide your Event's details:

• Event Name: The name used all around ChurnZero. You can search through Events already in ChurnZero, or create a new Event type on the fly by entering a unique name into this field. If you select an existing event, you add this event to one already defined in ChurnZero, which logs this and any other events sent to ChurnZero under that name. For example, if you have an event in ChurnZero named "Login," and you EventMap a target in your DevLess session to a button and name it "Login," both fire the same "Login" event.
• Customize: This slider opens a text area with the code of the element you selected, so you can verify it's the exact element you want. If multiple elements on the page match your selection, you'll see a soft warning in yellow ("Other Elements Matched: X").
• Description: Use this to provide a description sent to ChurnZero whenever a customer does this Event. You can only include a single piece of information here. Use the Value Preview text to see an example.
• Quantity: Use this to provide a quantity sent to ChurnZero whenever a customer does this Event. ChurnZero parses the first numeric value in the target content. Use the Value Preview text to see an example.
• Advanced Options: These settings cover the rare cases where a target exists on multiple pages with the same exact path (verify this in the Customize section), and you only want to track it in one place. Here, you can restrict tracking to a specific URL.

Step 6: Save Your Event (and Add Another)

When you're satisfied with your Event's settings, click Create in the lower right-hand corner of the Content Panel. Your Event saves and lists along the left-hand side.

Keep adding Events until everything you want to track is tagged.

Step 7: Set Up Page Tagging

Page Tagging in DevLess lets you track usage in more detail by tagging specific pages in your platform, using the URL. Here's an example of the type of usage data you can collect:

On Jan 8, John Doe logged into the platform for 5 hours. John spent:

• 1 hour on page A
• 2 hours on page B
• 2 hours on page C

To set up these tags, launch the DevLess panel, click Page Tags, then click Add Page Tag.

Set each component of the Page Tag:

• Tag Name: Identifier for this tag.
• Page: The URL for the page you want to track. Track multiple related pages, such as Accounts, under one tag by using the full URL minus the unique identifier at the end. To combine multiple URLs under the same Module, create a separate Page Tag for each and give them the same Module Name; they combine once they hit the system. For example, a Module named "Dashboard" could combine www.chasesbakery.com/dashboard and www.chasescoffee.com/dashboard.
• Event Name: Use this if you want a page visit to also trigger an event. Setting an Event Name and selecting "Track Usage" fires an event with that name to ChurnZero every time a user accesses the page.
• Module Name: The name of the item visited, for example, Dashboard. Setting a Module Name and selecting "Set Module" tracks Time in App to a module of that name in ChurnZero. You can also set a module for when someone leaves the page.

Measuring Usage with Page Tags

Once your Page Tags are configured, check how much time is spent in each module by navigating to the Time Spent section under My Dashboard. Use the selector to view usage data for the module you want.

You can also filter by module time spent in Segments, and each Account and Contact shows module-based usage data on the Usage tab.

Important Notes and FAQs

• You can create multiple actions for a single event. For example, you could target a "Search" button as an Event and an "Advanced Search" button as an Event, but tie both to the single Event name "Search."
• An Event fires to ChurnZero when the user clicks the tagged element, but if there's validation or a confirmation dialogue, clicking the element doesn't necessarily mean the customer completed the Event, depending on what it's tracking. For example, say you create an Event called "In-App Purchase" that fires when users click a "Pay Now" button. If a user clicks "Pay Now" but their credit card has expired, they get a validation message and abandon the purchase. The event still fires to ChurnZero, even though they never completed it.
• If your app supports sub-domains per account, you can enter a wildcard into your Page Tags to include all subdomains. For example, if your URL is https://churnzero.company-xyz.com/home/, and "churnzero" changes depending on the account logged in, that's a sub-domain. To handle sub-domains in a Page Tag, replace the sub-domain in the URL with a wildcard (*): https://*.company-xyz.com/home/. Note that wildcards can't be used in URLs for an Event Map; instead, turn off "Restrict to URL" so the event map works without depending on the URL. In that case, the event fires as long as the targeted element is on the page and can be clicked.
• If you have multiple Walkthroughs connected to the same Page Tag, only one appears on the page at a time; it's not possible to view multiple Walkthroughs on the same page at once. To avoid this, create more specific Page Tags that trigger only on a certain URL.