Component-based tracking is a simple framework to help teams define and standardise behavioural tracking events based on UI components across any digital product.
The core idea is to name behavioural events in accordance to the UI component they are connected to, such as buttons, cards, navigation elements, etc. All other information (i.e. business, user or product contexts) is passed as custom properties.
The goal is to have a single and scalable tracking schema that is easy to implement, maintain, document and use.
Depending on the entry point, sending a payment via the PayPal app takes 3 to 4 clicks. This is how event names could be named using the traditional approach:
And this is how they would be named using the component approach:
We of course need some context information to get the full granularity, and today I would use Matthew Brand’s Data Library to enrich the event with the following (amongst other) properties:
intent : the intent/context of the user action (enum)
label : the label of the text (string)
screen_name : the name of the screen where the action is triggered (string)
The reason why we call all of the above “button_click” is because they are all defined as buttons in the design component library 👉
The same follows for other UI elements like cards, notification banners, navigation elements, etc. Checkout Matthew’s Data Library schema for a full overview of the different components and their respective events, properties and contexts he suggests.
