Getting Started with Mixpanel - The Signal
Blog Post

Community Tip: Getting Started with Mixpanel

This Community Tip provides best practices for getting started with Mixpanel’s core tracking elements—user identity, events, and properties—so you can save time and increase quality within your implementation as well as better understand Mixpanel reporting.

Distinct Id: Tracking Unique Users

Imagine your most recent trip to a restaurant. After taking your seat and browsing the menu, the server comes by and takes your order. However, there’s a problem—with many customers in the restaurant at the same time, your server needs a way to identify who you are so that your food order is delivered properly to you. The restaurant likely has some method of distinguishing users based on the table at which you are seated, who your server is, and the time you arrived.

Like the customers in a restaurant, Mixpanel also has a way of distinguishing unique users: Distinct Id. When properly implemented, Distinct Id will allow Mixpanel to connect the actions of your users over time across devices, platforms, and sessions. By default, each of our client-side libraries (JavaScript / iOS / Android) will automatically generate an anonymous Distinct Id when a user first interacts with your site, though the method for generating this value varies. For each event which comes into Mixpanel with the same Distinct Id, Mixpanel will attribute these to the same unique user.

The Live View tab, where user events are appearing. The Distinct ID category shows the user's unique identification.

This concept of “uniqueness” is crucially important in Mixpanel, and analytics in general. Tracking unique users by Distinct Id allows us to see how many unique users did a specific event, how long it took a specific user or group of users to return to your product, or to see what actions a user took after a specific event.

It is important to note that the moment a user’s Distinct Id changes, Mixpanel will see the events before and after the Id change as different unique users. The key to making your analytics work as expected is to ensure that Distinct Id remains constant for your users as they continue to interact with your product. There are two main ways to do this within Mixpanel.

Maintain Distinct Id Manually

In this method, you maintain a Distinct Id for your users throughout their lifecycle. This can be done by assigning each user an Id when they arrive, or by recording the anonymous Distinct Id Mixpanel assigns. Either way, you will need to store this value on your end and correctly assign it to a user each time they return to your app or site. By ensuring that the Distinct Id won’t change across sessions, you will be able to link the actions from when a user arrived at your site anonymously with those after they become a registered user.

Diagram showing that a user's distinct_id follows their event into the Mixpanel report.

While the actual code for this method will change depending on the client-side library you are using, the mechanisms for achieving this are the same. All Mixpanel client-side libraries have methods for retrieving and changing the Distinct Id from local storage (mobile) or cookies (web). You have the ability to thus grab the Mixpanel Id by recording the return of the ‘get_distinct_id()’ method (JavaScript / iOS / Android) as well as assigning an Id you provide by passing it to the ‘identify()’ method (JavaScript / iOS / Android).

Use Mixpanel to Maintain Distinct Id

Mixpanel being Mixpanel, we have built into our libraries a mechanism that replicates the behavior of maintaining an id for each user so you do not have to manage Ids on your own. The ‘alias()’ method (JavaScript / iOS / Android) allows you to create a 1:1 mapping between the Id you control and pass to the function and the anonymous Distinct Id that was generated when a user first arrived. You will want to call alias when a user first registers or signs up with your product so you can start tracking them by your unique identifier once you know who they are.

Diagram showing the event with distinct_id referring to the Alias table to recognize a user's distinct_id.

The alias method works by creating an entry in an alias lookup table for your Mixpanel project. Once this entry in the lookup table has been created, any data that is sent into Mixpanel with the new Id that you control will first be routed through the alias table. If an alias exists for the Id you provide, the Distinct Id will replace your Id and your events will be stored in Mixpanel all with the original anonymous Distinct Id.

Going back to our restaurant example, using alias is similar to what can happen when you pay for your meal with a credit card. When you first came to the restaurant, you were just a table number and time of day. Now that you’ve paid, there is a name associated with who you are—when you come back to the restaurant in a week, the server may even remember you, your preferences from the previous meal, and your name! If the restaurant calls you by name after your initial transaction, all of your activity will be tied back to your first restaurant visit.

Please see the below video for further background on managing identity within Mixpanel.

Events: Naming and Tracking User Actions

Once the restaurant has a means of distinguishing you from other customers, the owner realizes that it would really help her business to start tracking what users do while they are in the restaurant, especially before ordering. So, she has her servers keep track of which menus customers pick up first, which tab in the menu people go to first, whether drinks or food is ordered, payment completion, and finally when the customer leaves the restaurant.

Similar to these actions a customer may take in a restaurant, Mixpanel events allow you to track the actions that a user takes on your app or site. If a user triggers a section of your code, you can make a call to the Mixpanel library and send an event to Mixpanel – meaning if you can track it in code, you can track the user’s action in Mixpanel. The most basic version of this would be to track when a user loaded a page on your website. You would simply put the Mixpanel tracking call from the JavaScript library in the tag of your webpage like so:

// Mixpanel library snippet
// ...
mixpanel.track("Page Loaded");
// ...

When the body section of your website loads, provided the Mixpanel snippet is initialized, the track call will fire an event called “Page Loaded” to Mixpanel, where you will be able to access this event in the various reports via the drop down menus:

A Segmentation report focusing on the Event "Viewed Page."

Since you can track when a user triggers a section of code, you are not limited to using page views as a metric for measuring user interaction with your app or site. Using Mixpanel, you are able to measure actions your users perform by adding tracking code for all events which are meaningful to your business (sign ups, logins, button clicks, purchases, first time app opens, etc.). All you need to do is find the section of your code that differentiates that action from the rest of your product and place the track call there.

Generally, as a best practice, you will want to name your events with names that represent the action a user actually takes. By keeping your event names descriptive, general, and human readable, your entire team will understand what action an event represents and will all be able to utilize Mixpanel easily. Here are some example actions you may track in JavaScript:

// Use different event names for each action, such as different names for signup and login
$('#SignupButton').click(function(){
    mixpanel.track("Sign Up Clicked");
});

$('#LoginButton').click(function(){
    mixpanel.track("Login Clicked");
});

You will want to make sure that you don’t get too specific with your event names. For instance, if you wanted to track a page view, it might be tempting to put the URL or title of the page as your event name. However, when accessing events from a dropdown menu with many items, keeping track of event names with long or specific descriptors can be cumbersome, so it’s often easier to put the general information about the action as the event name. For all of the details of an event which you do not store in the event name, you would want to use properties.

Properties: Describing the Actions Users Take

Now that our restaurant owner is tracking all these events, she realizes that she could get even more insights by studying the context surrounding these events. For instance, how much was the total order cost when the customer paid? How much of a tip did he leave? The restaurant staff is now on the lookout for how many people were in the party, if the table was window adjacent, the number of glasses of water before ordering, what food was actually ordered, and what food was looked at on the menu.

By tracking the details associated with each action a user makes, the restaurant can find deep insights into the reasons certain actions occur. In Mixpanel we call these properties, which allow you to differentiate between occurrences of the same event, such as the difference in price between one purchase and the next. By using many properties, you can simplify your naming conventions and do more complex analysis because you are sending along additional information about an event. Mixpanel properties are sent in as a dictionary of key:value pairs that accompany an event tracking call:

mixpanel.track('Viewed Page', {'Page Name': 'Purchase Page'});
mixpanel.track('Viewed Page', {'Page Name': 'Checkout Page'});

A powerful aspect of Mixpanel properties is that you can send many properties with events, with the only limitations being you should avoid special properties and that the values fall into these data types. If you utilize these properties as descriptors of the events your users perform, you can find some insightful analytics:

mixpanel.track("Order", {
    'food': ['burger', 'fries'],
    'drink': 'juice',
    'glasses of water': 3,
    'total cost': 15.53,
    'tip': 4,
    'window adjacent': true
});

mixpanel.track("Purchase", {
    'amount': 100,
    'items in cart': ['bicycle', 'water slide', 'spam'],
    'username': user.id,
    'purchase date': new Date()
});

mixpanel.track("Sign up", {
    '$email': email_address,
    'sign up date': new Date(),
    'favorite music': 'bluegrass'
});

A segmentation report showing a deep dive using several event properties.

A "purchase item" funnel, showing the conversion rate between Signup and Purhcase.

A Retention report showing the retention of users who signed up by country, week over week.

This is just the beginning of what Mixpanel has to offer! In order to help you dive into advanced analytics with Mixpanel, here are some articles that other Mixpanel users have found particularly useful for getting started with implementing Mixpanel and making the most out of their analytics:

Mixpanel Best Practices
AARRR! Startup Metrics
JavaScript Implementation Roundup

With any additional questions, from setting up your implementation to using Mixpanel’s advanced features, please reach out to support@mixpanel.com to speak to someone smart, quickly.

Get the latest from Mixpanel
This field is required.