By leveraging modern capabilities of embedded analytics development environments, such as data and visual authoring, developers can rapidly build beautiful interactive dashboards that their end users will love. Let’s look at how Logi Composer can fully transform an application in just 30 minutes.
This screenshot is an example of a common implementation that we see in the field with some of our partners. Looking at this existing application, we notice that the dashboard is completely static. As an end user of this application, I’m unable to slice and dice data to find insights.
This is why we’re going to use Logic Composer to transform this into a more modern interactive dashboard. Logi Composer is the first out-of-box development experience for embedded analytics. Let’s look at the process from end to end.
Establish a Direct Data Connection
The first step is to establish a direct connection to existing data sources. All I need is a connection string and nothing more. For this example, I’m going to use an upload API to add in a real-time sales data stream to build out a real-time dashboard. I’m going to start from the Source tab, click on Add Source, and name this data set “New Real-Time World Sales.”
Instead of typing out my JSON structure of what my data format will look like, I can immediately go in and import a sample of my data. After that, we have some very light data preparation setup. For example, I can quickly change the alias, my time of granularity, and my price column data format.
If we wish to go ahead and start creating calculated metrics, we can also do that here using the UI itself. The last important step before we can start creating content is to set up global defaults. For example, to make our new data set real-time, I just click on this Live Mode button—and my rates of data coming in will be one second.
Next, on the left-hand side, we can begin to exert more control over our end user’s experience. We have a list of standard visualizations out of the box (see image above). But for example, if the box plot is too much for my users to handle, I can take that out as an option. So, users wouldn’t accidentally create a chart and be unsure what this chart does. Now I save the data set and we can jump into creating a dashboard from scratch.
Create the Dashboard
I’m hitting the New Dashboard button and I can go ahead and add some new visualizations based on the data set that we have just set up. I’ll be able to select a data set and the information I want to display very easily in a drag-and-drop manner. Within a millisecond we can put together a general layout for our dashboard.
Now is time to make some more adjustments. Perhaps I want the bar chart on the left-hand side to group my sales reps by name instead of country. All I need to do is click on the Group button and adjust that quickly. No matter what type of chart I want to customize, I’ll use the panel on the right-hand side. So, as a developer, I can quickly put together a dashboard without having to write any code.
Now that we’ve given our users a modern-looking dashboard, we also want to empower them to make decisions. All of the charts in Logi Composer, by default, come with interactivity. So, users can immediately say, “I want to jump in, slice and dice on Tiffany’s sales record based on country and perhaps take a look at her sales by trend and adjust the granularity.” And lastly, if we want to get to the detailed data immediately, we can also just click on the Detail button. We can perform filters across the entire dashboard very easily.
Now, a common desire when providing out-of-the-box interaction like this is that we also want to maintain control and really tailor our user experience—and we can do that with Logi Composer, too!
Tailor the Experience
I’m fairly satisfied with this new dashboard, so I’m going to quickly save it. Let’s call this Hayley’s Dashboard. Now it’s time to replace our old dashboard.
Embed the Dashboard
Let’s go ahead and copy that to my clipboard. Jumping into the HTML off my page, I was using an image to represent the older dashboard. So, let’s go ahead and comment those outs. And for my new Logi content, I have to find a div tag where the Logi dashboard will live. Let’s enable the div and I am now going to paste in that embed script that I have copied from the dashboard we just built. I’ll hit Save, come back and give it a refresh.
And voila! We’ve built out a fully interactive dashboard with real-time streaming data. The dashboard looks exactly as we configured it, and end users will get the tailored options we have set up as developers.
However, Logic Composer doesn’t stop here. We can also give developers even more control and creativity using the API first approach. To learn how you can use Logi Composer to achieve a deeper level of integration with your platform, view the full on-demand webinar.