Implementing Mixpanel in Bubble app

Using Mixpanel in Your No Code Web-app

Add Mixpanel to your Web App

You’ve created a web-app using and now you’d like to understand how your users are interacting with it. You can tell if a user has signed up, but how can you tell what buttons they’re pressing, such as “Help” buttons. Do you know which pages and/or groups they’re going to?

Adding the Mixpanel plugin to your app can provide you with all of these answers. In this how-to video, I’ll show you how to setup Mixpanel in your Bubble app. Before you begin, you will need a Mixpanel account. They do offer a FREE account so you can get up and running in no time. You’ll also need to add Bubble’s plugin for Mixpanel (also FREE). When you search for “mixpanel” in Bubble’s plugin popup (see image below), you’ll see the plugin to Install.

Bubble plugin for Mixpanel
Bubble’s plugin for Mixpanel

After you install the Mixpanel plugin, you’ll need to add your Mixpanel Token and API info into the appropriate plugin fields. To get this info, go into your Mixpanel account and you should see a circle with your initials (default value) in the upper right corner. Click it and select “Account Information”.  A popup will open with your Token and API info (see image below)

API and Token Information
Mixpanel API and Token Information

Copy these three values into the respective fields in Bubble (see image below).

Mixpanel Plugin Keys
Add Mixpanel Info to the Plugin in Your App

At this point your app is all set to use Mixpanel.  One comment on something to be aware of. Generally when creating Bubble Workflows, you don’t use the “Analytics” choice but with Mixpanel you will. To access the Mixpanel “actions” in a Bubble Workflow, you’ll need to select “Analytics” as your action choice. In the image below, you can see the four choices.  You can also refer to Bubble’s Mixpanel reference guide for more info.

Analytics action in Bubble workflow
Analytics Workflow Actions in Bubble

The how-to video shows you not only these steps but also how-to setup Workflows that are triggered when Buttons are clicked or when a Dropdown menu changes value. The video also shows you where to look in your Mixpanel account for the information passed from your app to Mixpanel. Note the video does not go into great detail on how to use Mixpanel – there are many other videos and tutorials available for using Mixpanel’s services.

Once you have Mixpanel up and running, you’ll quickly see how powerful it can be to capture user data for your analysis. As one example, if you have a user on-boarding process, you can create multiple versions of the on-boarding design and conduct A/B testing to see which design is more effective with your users. As a second example, if you have “Help” buttons throughout your app, you’ll be able to tell which ones get used the most. This will give you insight on which areas of your app that may be confusing to your users – an opportunity for redesign and make your app more user friendly. As a third example, if you have a “funnel” in your app to qualify users before they actually sign-up, you can also setup your app to see when prospects “fall out” of the funnel. Again, useful information for you so you can update your funnel and increase conversions.

These three examples show you how important and useful collecting this information is so you can make data driven decisions – decisions that will help you increase your chances of success with your app.  And adding Mixpanel to your Bubble app is quick and easy; a very powerful capability for you to take advantage of.

FREE ACCESS to this design when you join our email list!

Leave a Reply