How to :: Create a Self Service Experience for your End Users [BETA]¶

If you need to give your users the ability to explore their data through visualizations, then you’re at the right place!

Important

Make sure to clean and prepare your data before you let your self-service users explore it through visualizations. It’s super important to give them the best experience!

Introduction: Data & Permissions¶

Let’s take a super easy example to show you how to implement Self Service Visualization inside your product. Here I have simple datasets about sales records from my 2 customers: Pigeon Data and Water Fox.

Dataset Preview

Now, I want to add Permissions on the data to separate it according to my user groups.

Pigeon Data users have pigeon-data group.
Water Fox users have water-fox group.

Basically, based on the group I’ll filter my dataset to return the right slice of data only. Set Permissions

Tip

Note that our example is with Toucan toco’s groups but it also works with arbitrary attributes that can be inside an user authentication token!

I have now my 2 rules configured.

Overview Permissions

Let’s begin leverage the Embed SDK to create Self Service Visualizations for my users!

Create Self Service Dashboards¶

Let’s say that our users look like that:

	Pigeon Data’s user	Water Fox’s user
username	self@pigeondata.fr	self@waterfox.com
roles	[“USER”]	[“USER”]
groups	[“pigeon-data”]	[“water-fox”]
privileges	{ “ssv-app”: [“self-contribute”] }	{ “ssv-app”: [“self-contribute”] }

What’s important here is that we introduce a new privilege: self-contribute.

The user can:

edit the dashboard they own.
create a “simple” story via a new and easy Light Editor.
use a story pre-configured inside the linked application but CAN’T edit it.

Let’s see how your developers will enable the experience for your users.

Create the dashboard¶

If you want to directly generate the Self Service Dashboard, the first thing you’ll need to check is if a dashboard exists already for your user using retrieveAndInsertLayoutByAuthor SDK’s method.

Example with self@pigeondata.fr:

const instance = new TcTcEmbed('MY_SDK_KEY');
const userToken = localStore.getItem('toucanTocoToken');
const username = 'self@pigeondata.fr'

instance.retrieveAndInsertLayoutByAuthor(
  username,
  userToken,
  'ssv-app',
  document.getElementById('embed-parent'), // the "id" is 100% your choice, it has to exist inside your DOM
)

As we don’t have a dashboard yet for self@pigeondata.fr, the method will throw an Error that we can catch in order to create one with createLayout.

const instance = new TcTcEmbed('MY_SDK_KEY');
const userToken = localStore.getItem('toucanTocoToken');
const username = 'self@pigeondata.fr'

const instance.retrieveAndInsertLayoutByAuthor(
  username,
  userToken,
  'ssv-app',
  document.getElementById('embed-parent'), // the "id" is 100% your choice, it has to exist inside your DOM
).then(() => {
}).catch(() => {
  // There's no dashboard, let's create one!
  instance.createLayout(
    'dashboard',
    userToken,
    'ssv-app',
    document.getElementById('embed-parent'),
    {
      author: username,
    }
  );
});

Tip

You can also create a Dashboard from an existing one! It will duplicate the current configuration then new things are scoped to the new dashboard!

Create from Template¶

This could be useful if you want to put a pre-configured Dashboard to your self service users to avoid them to begin from sratch, pushing them already created beautiful stories!

For instance, you can create that Dashboard and use it as a template.

Let’s say its id is MY_TEMPLATE_DASHBOARD_ID, thanks to createLayout, you’ll be able copy it for your self-service users.

Tip

Note that all the stories will be non editable but the layout is!

instance.createLayout(
    'dashboard',
    userToken,
    'ssv-app',
    document.getElementById('embed-parent'),
    {
      author: username,
      from: 'MY_TEMPLATE_DASHBOARD_ID' // Put the embed id of an existing dashboard
    }
  );

Now, our self-service user can enter the Edition Mode and will be able to create their own visualizations with the Light Editor!

Create stories with the Light Editor¶

The Light Editor is a no-code smart and simple editor that integrates data transformation behind the scenes. It allow data-neophyte user to quickly write their stories!

Warning

As of today, only the Leaderboard, Barchart, Linechart and Stackedbarchart are available! More are on the way!

Your user will land on an empty dashboard, ready to begin their journey to create insightful stories!

SSV - Empty Dashboard Builder

Clicking on “Insert a row”, they’ll have the possibility to create or use existing stories !

SSV - Choose Content

And that’s where the Light Editor comes into play! Your user will be invited to choose the dataset they want to use (prepared in advance by you), and create their first Story!

SSV - Light Editor Empty

SSV - Light Editor Select Data

Once they select the right data, your user will be able to configure their chart! Now, let’s dive deeper to discover the different aspects of the Light Editor!

On the left, we have your data columns names and types!

SSV - Light Editor Data Columns

In the center, our Smart Form helps you to quickly create your stories, including on the fly automatic data aggregation!

SSV - Light Editor Chart Configuration

Finally, on the right is your chart preview!

SSV - Light Editor Chart Preview

Let’s take a simple Linechart configuration to illustrate the Light Editor’s “smartness”. On all displayed numbers fields (eg: value or variation), the form will add an aggregation operation. By default, it’s a sum formula but your users can change it for any other formula according the story to tell!

SSV - Light Editor Sum Aggregation

SSV - Light Editor Aggregation Steps

Tada! You can now publish your dashboard with your first story!

SSV - Publish

Coming Soon in the Light Editor¶

Compute the count of label
Compute a custom arithmetical formula from data columns
Add filters in stories and at dashboard level
Easy configuration for the Waterfall Chart

Stories & data available for Self Service user¶

Story¶

You can push stories that you’ve created before! To choose which one is available for which users, you can rely on the “Visibilities” rules on the stories, directly from the application.

SSV - Visibilities

Don’t know about Visibilities? Have a look!

If the end user can select one of your pre-written stories, she will not able to edit it: it’s read-only.

She will be able to:

Change the story’s position
Resize the story
Delete the story from her dashboard

Data¶

Only published (production) data is available to self-service users for now to allow you to decide which datasets you want to provide to your users and when you want them to be made available.