The analytics build into the Frontify Style Guide already gives you a convenient way of how often your guidelines or parts of it are consumed by users. However, there is times you may want to dig deeper and get more insights on the type of users, what and where they download files, videos they watch or just how the navigate over your guidelines. This is when you need to hook up your analytics tool to Frontify. Here's how.

What is Segment?

Segment.com is a cloud service that allows you to connect business applications like Frontify to 200+ analytics applications like Google Analytics. By supporting Segment, we allow you to get insights on Style Guide usage in your system of choice.

Segment is free for up to 1'000 users per month. You'll need a Frontify Enterprise plan to use this feature.

What is tracked?

Currently, we're tracking document, page and section views as well as the user login method, downloads and played videos. This allows you to analyse a variety of metrics regarding your Style Guide content, e.g. No of Views per Page, Read Time, Bounce Rate, Demographics & more. Please let us know if you need more metrics from your Style Guide.

Step 1: Prepare Segment to use in Frontify

First, you have to create a new Segment account. After logging into Segment, you need to add a new JavaScript source with your Frontify domain as the "Website URL", e.g. "company-12345.frontify.com" or your custom domain.

Once you've added the new source, copy your Segment Key (You'll need it later) and create a new destination with "Add Destination".

Choose your preferred destination from a catalogue of 200+ applications e.g. Google Analytics.

Step 2: Enable Segment in a Style Guide

Go to your Style Guide and open the General settings via Powerbar.

Scroll down to the "Segment" section and toggle "Enabled", then configure your Segment Key (see above) to enable tracking. You've successfully setup Segment integration and the data now flows into your destination system(s).

⚠️ You have to repeat this step for every Guideline you like to connect with segment
a.) If you like to track all your Guidelines in one report, use the same segment key in every Guideline
b.) If you like to track each Guideline in separate reports, use different segment keys. Which means you have to create several Segment sources.

Step 3: Test your Segment Integration

The best way to test your integration is in the segment debugger. Open your source and do some downloads on your Guideline. You should see tracking results in segment debugger instantly.

⚠️ If you have any active privacy protection or adblocker extensions in your browser, segment won't be able to track your events.

Step 4: Connect Segments with your analytics tool

To create your personal reports, Frontify sends the following dimensions.

Default dimensions

If you connect e.g. Google Analytics, this properties are displayed in all default reports.

Event Name (e.g. 'Download', 'Play')
Event Category (category, e.g 'styleguide image')
Event Label (label, e.g. the filname of your download)

Custom dimensions

Custom dimensions can be sent to your destinations. For now the following dimensions are tracked

block (e.g. 'image') 
category (e.g. 'styleguide image')
filename (uploaded file, e.g. 'logo-2x.png')
src (source of a video or download)
url (visitor's current page, e.g. frontify.com/document/420)
signup_mode (tracked per event and per anonymous session, e.g. 'SIMPLE')

isAttachment (set if download is an block's attachment)
isViewer (true if event is tracked from the frontify detail viewer)

Setup your analytics tool

⚠️ Some Analytics tools are not able to change a custom dimensions ID, so we suggest to first create the custom dimensions in your analytics tool. Segment allows to adjust the ID afterwards.

E.g. for Google Analytics there are settings in admin -> custom definitions -> custom dimensions.
Further Informations: Google Analytics custom dimensions 

Adapt Segment

E.g. for Google Analytics there is an option at the destination -> settings (sproket icon) -> 'Custom Dimensions'. Fill in the custom dimension names (E.g. 'url', 'filename', etc.) and a the index number.
Further informations: Configure Segment for custom dimensions 

Example configuration of custom dimensions with Google Analytics

⚠️The Google Analytics custom dimension's "index" must match segement's dimensions number.


Step 6: Display your custom dimensions in a custom report

The usage of cutom dimensions depends on your tool. E.g. in Google Analytics you have to create a custom report. Add there your custom dimensions and a metric, we recommend 'Total Events'.

Did this answer your question?