# How to monitor user engagement metrics tracking in Bubble.io: Step-by-Step Guide

- Tool: Bubble
- Difficulty: Beginner
- Time required: 20-25 min
- Compatibility: All Bubble plans (Growth+ for backend workflows)
- Last updated: March 2026

## TL;DR

Build an internal user engagement analytics dashboard in Bubble by tracking daily active users, session duration, feature usage, and conversion events. Create a UserSession Data Type that logs login and logout times, use scheduled backend workflows to aggregate metrics into daily snapshots, and display trends using chart plugins — all without external analytics tools.

## Monitoring User Engagement Metrics in Your Bubble App

Understanding how users interact with your app is essential for making product decisions. This tutorial shows you how to build an internal analytics system that tracks daily and monthly active users, session duration, feature usage, and key conversion events. You will learn to log events, aggregate them into meaningful metrics, and display dashboards with charts — giving you Google Analytics-level insights built directly into your Bubble app.

## Before you start

- A Bubble account with an app open in the editor
- User authentication set up (login/logout flows)
- A chart plugin installed (Chart.js or Bubble Chart from the marketplace)
- Backend workflows enabled for metric aggregation

## Step-by-step guide

### 1. Create Data Types for session and event tracking

Go to Data tab → Data types. Create 'UserSession' with fields: user (User), login_time (date), logout_time (date), duration_minutes (number), device_type (text). Create 'EngagementEvent' with fields: user (User), event_name (text, e.g., 'clicked_upgrade', 'viewed_pricing'), event_data (text), timestamp (date). Create 'DailyMetric' with fields: date (date), dau_count (number), new_users (number), avg_session_minutes (number), total_events (number).

**Expected result:** Three Data Types are created for raw session data, individual events, and aggregated daily metrics.

### 2. Track user sessions on login and logout

In your login workflow (after the 'Log the user in' action), add: Create a new thing UserSession (user = Current User, login_time = Current date/time, device_type = detect via user agent or leave blank). Store the Result of step's unique id in a custom state called 'current_session_id.' In your logout workflow (before 'Log the user out'), add: Make changes to UserSession where unique id = page's current_session_id → logout_time = Current date/time, duration_minutes = (Current date/time - This UserSession's login_time):format as seconds / 60 rounded to 0.

> Pro tip: Also track sessions ending from page close using the 'User is logged out' page event or a 'Page is unloading' JavaScript trigger.

**Expected result:** Each user login creates a session record, and logout populates the end time and duration.

### 3. Log feature usage events throughout the app

At key interaction points in your app, add event logging. For example, when a user clicks the pricing page button, add a workflow action: Create a new thing EngagementEvent (user = Current User, event_name = 'viewed_pricing', timestamp = Current date/time). Do the same for other important actions: 'completed_signup,' 'created_project,' 'invited_teammate,' 'upgraded_plan.' Keep event names consistent (lowercase with underscores) so they are easy to aggregate later.

**Expected result:** Key user actions are logged as EngagementEvent records with timestamps and event names.

### 4. Set up a scheduled backend workflow to aggregate daily metrics

Go to Backend workflows and create a workflow called 'aggregate_daily_metrics.' Schedule it to run daily at midnight. In the workflow: (1) Calculate DAU by searching UserSessions where login_time is today, then counting unique users. (2) Calculate new users by searching Users where Created Date is today:count. (3) Calculate average session duration from today's UserSessions. (4) Count total EngagementEvents from today. (5) Create a new DailyMetric record with all these values. Schedule the workflow to re-run itself tomorrow.

**Expected result:** Every day at midnight, a DailyMetric record is created with aggregated engagement numbers.

### 5. Build the analytics dashboard with charts

Create an 'analytics' page. Add a chart element (from the Chart.js plugin). Set the chart type to 'Line.' For the X-axis, use DailyMetric records' dates (search DailyMetrics sorted by date, last 30 days). For the Y-axis dataset, use dau_count values. Add a second dataset for new_users in a different color. Below the chart, add summary cards: a Group showing 'Today's DAU' (search DailyMetrics where date = today's dau_count), 'This Month's MAU' (search UserSessions where login_time >= first day of month, unique users count), and 'Average Session Duration.' Style cards with large numbers and labels.

**Expected result:** The analytics dashboard shows a 30-day trend chart and summary cards with key engagement metrics.

### 6. Add event breakdown and filtering

Below the main chart, add a Repeating Group showing event name breakdown. Data source: search EngagementEvents where timestamp >= 30 days ago, grouped by event_name, aggregation: count. Display each event name with its count and a percentage of total. Add date range filters (two Date Picker elements for start and end dates) that constrain all searches on the page. Add a Dropdown filter for specific event names so admins can drill down into specific user actions.

**Expected result:** Admins can see which features are used most, filter by date range, and drill into specific event types.

## Complete code example

File: `Workflow summary`

```text
USER ENGAGEMENT TRACKING SYSTEM
=================================

Data Types:
  UserSession: user (User), login_time, logout_time,
               duration_minutes, device_type
  EngagementEvent: user (User), event_name, event_data, timestamp
  DailyMetric: date, dau_count, new_users,
               avg_session_minutes, total_events

Session Tracking:
  On Login:
    Create UserSession (user, login_time = now)
    Set state: current_session_id = Result's unique id
  On Logout:
    Make changes to UserSession (current_session_id)
      logout_time = now
      duration_minutes = (now - login_time) in minutes

Event Logging (at key interaction points):
  Create EngagementEvent
    user = Current User
    event_name = 'viewed_pricing' | 'created_project' | etc.
    timestamp = Current date/time

Daily Aggregation (Backend Workflow - midnight):
  1. DAU = Search UserSessions (today):unique users:count
  2. New Users = Search Users (created today):count
  3. Avg Session = Search UserSessions (today):each duration:average
  4. Total Events = Search EngagementEvents (today):count
  5. Create DailyMetric with above values
  6. Schedule self for tomorrow midnight

Dashboard Page:
  Line Chart: DailyMetric date (x) vs dau_count + new_users (y)
  Summary Cards: Today DAU, Month MAU, Avg Session, Total Events
  Event Breakdown: RG grouped by event_name with counts
  Filters: Date range pickers, event name dropdown
```

## Common mistakes

- **Counting total sessions instead of unique users for DAU** — A single user may log in multiple times per day. Counting sessions instead of unique users inflates your DAU metric. Fix: Use ':unique elements' on the user field of your UserSession search results before counting, or use ':group by' on user.
- **Not handling session end for users who close the browser without logging out** — Many users simply close the tab instead of clicking logout. These sessions will have no logout_time or duration. Fix: Add a scheduled backend workflow that finds sessions older than 24 hours with no logout_time and sets the duration based on the last known activity time.
- **Logging too many events and overwhelming the database** — Tracking every mouse click or scroll creates enormous data volumes that slow searches and consume WUs. Fix: Only track meaningful events: key conversions, feature usage, and navigation to important pages. Quality over quantity.

## Best practices

- Track sessions (login/logout times) and discrete events (feature clicks) as separate Data Types
- Aggregate raw data into DailyMetric snapshots to avoid expensive real-time calculations
- Use consistent, lowercase event names with underscores for easy grouping and filtering
- Schedule daily aggregation via backend workflows rather than calculating metrics on page load
- Handle orphaned sessions (no logout time) with a cleanup backend workflow
- Add date range filters to all dashboard views so admins can analyze any time period
- Keep raw event data for at least 90 days for detailed analysis, then archive or delete

## Frequently asked questions

### Can I track engagement without building my own system?

Yes. You can embed Google Analytics, Mixpanel, or Amplitude via script tags in your page header. However, building your own gives you full control and avoids third-party data sharing.

### How do I calculate Monthly Active Users (MAU)?

Search UserSessions where login_time is within the current month, then count unique users. Store this as a monthly metric or calculate it on demand on your dashboard.

### Will tracking events consume a lot of Workload Units?

Each event creation costs approximately 0.5 WU. For an app with 1,000 DAU and 5 events per user per day, that is about 2,500 WU per day — manageable on Growth plans and above.

### How do I export analytics data?

Go to Data tab → App data → select DailyMetric or EngagementEvent → click the export button to download a CSV file that you can analyze in spreadsheets or BI tools.

### Can RapidDev help build a custom analytics dashboard?

Yes. RapidDev builds custom analytics dashboards in Bubble with advanced features like cohort analysis, funnel tracking, and real-time metric displays tailored to your specific KPIs.

---

Source: https://www.rapidevelopers.com/bubble-tutorial/monitor-user-engagement-metrics-tracking-bubble
© RapidDev — https://www.rapidevelopers.com/bubble-tutorial/monitor-user-engagement-metrics-tracking-bubble