Tutorial: Using Gradio with Comet

Comet allows data scientists to track their machine learning experiments at every stage, from training to production. Any metric can be aggregated over samples and shown in Panels in a customizable dashboard, like below:

A Comet dashboard showing various aggregate metrics

While aggregate metrics are a good summary of a model’s performance, a complementary approach is to allow users to interactively explore a model’s prediction on a single sample. By dragging-and-dropping an image, writing text, recording audio, etc., interdisciplinary machine learning teams can test models and help discover their biases and failure points through demos like this one:

Building these demos often takes quite a lot of time since it involves creating a web-based front end and infrastructure for hosting and sharing the model. This is where Gradio comes in. The open-source Python library (with more than 2,700 stars) lets machine learning developers create demos and GUIs from models very easily, with just a few lines of Python. Here’s the code for image classification demo like the one above:

We’re excited to share that Gradio and Comet now work beautifully together! You can create a Gradio demo and include it in your Comet dashboard with just 1 extra line of code so colleagues and team members can understand and explore your model, regardless of their technical backgrounds!

Here’s how it works, from start to finish, in 8 steps. (If you’d like, refresh your knowledge of the basics of Gradio and the basics of Comet, first)

1. Create a Comet account

Follow instructions at www.comet.ml to create your free account:

2. Get Your Comet API Key

Once you’re logged in, click on your username and select Settings from the dropdown. In the Settings page, scroll down to “Developer Information” and click “Generate API key”.

3. Create a Project

Go back to the main Comet page (by clicking on the logo in the top left corner), and click on the “+ New Project” button. Here, you’ll be able to make your project private or public.

4. Add the “Gradio” Panel

Click on the “+ Add Panel” button in the center of the screen:

Then, navigate to the “Public” tab and search for “Gradio”. Once you find the panel, click “Add >” to add it to your experiment.

5. Install Gradio and Comet

Now, we’re ready to write code. Start by installing Graido and Comet. Since both are open-source Python libraries, open up the environment where you are running Python and run:

pip install gradio comet_ml

6. Create a Gradio Demo

In your Jupyter notebook or Python environment, create a Gradio demo, just as you would normally. Here’s an image classification model in PyTorch, but you can use any type of model.

7. Create a Comet Experiment

Create a Comet experiment, just as you would normally, by entering your API key, project name (using the name you used in Step 3), and workspace (your username for an individual project).

8. Create a Comet Experiment

The last step — integrating your Gradio demo with your Comet dashboard — is just one extra line:

If you navigate back to your Comet dashboard, you’ll see the following image classification Panel has appeared! You can drag-and-drop your images and see predictions (like I’ve done with this image of a lion), or share your dashboard with your teammates so that they can do the same!

And that’s it! Start building and sharing your new, interactive models today at www.comet.ml!