VibeOps Demo - New Telemetry Dashboard Creation with Claude Code

Hello and welcome.

In this short video you'll see how to use your favorite Vibe coding tools with the Fabrics platform.

I'll demonstrate with Claude code, but you can use any Vibe coding tool you prefer.

This uses the Fabrics VX companion toolkit, which includes the relevant tools and agent skills for interacting with the Fabrics platform.

In this example, we'll create a new storyboard using telemetry data already in the platform, then generate new visualizations and a new storyboard.

Here you can see the persistent streams collecting telemetry data for this Meridian Lab environment.

Here we're looking at Claude code.

I've already set up a project with the companion toolkit and asked it to identify how many P streams contain this Data.

It found 20 different P streams.

Next, I want to build a visualization that captures data from those P streams.

I'm asking it to build a new dashboard using data from the P streams above.

I want an executive level telemetry operations summary and I'm providing a name for it.

I'm also specifying that it can use relevant widgets from Apache Echarts.

Apache Echarts is a popular JavaScript library with many different widgets, which I'll show you in a moment.

Let's get started.

Here are several examples from the Apache Echarts library, including a range of different widgets.

Not every widget will be relevant, but Claude can identify the appropriate options and use them in the dashboard.

Apache E Charts offers Heat Maps, line graphs, Sankey Charts and many other powerful widgets.

When creating visualizations in Fabrics, you're not limited to native widgets.

You can also bring in widgets from third party libraries, which is why I'm highlighting this capability.

It's already working on the Dashboard, so we'll give it a couple of minutes and then check back.

The Dashboard is now complete and available locally.

Next, we need to push it to the platform.

I'll select Push to the Platform.

It's currently being pushed to the platform.

This is the name of the Dashboard.

The Dashboard is ready.

Let's take a look.

Now we're in the platform and this is the dashboard it created.

You can see it in the Dashboard list as Meridian NOC Telemetry Operations.

The executive summary.

Here is the completed dashboard with the elements created by the Vibe coding tool using the Apache E Charts library.

It looks clean and polished.

This is another example of a dashboard created with Anti Gravity, which is a Google's Vibe coding ide.

Here we're also using the same Apache Echarts library, but with different widgets and visualizations.

With a couple of iterations and prompts, you can create dashboards tailored to your preferences and use cases.

This is another version of a dashboard using the same data with different widgets.

Thank you so much for tuning in.

See you in another video.