Getting Started

Follow this guide to learn how to create an app from a dataset in Plotly Studio. To get started, if you haven't already, download and install Plotly Studio.

Opening Plotly Studio and logging in

When you open Plotly Studio, select Login to get started or log in with Dash Enterprise. See the Installing and Setting Up Plotly Studio page for more details on installing and logging into Plotly Studio for the first time.

Projects

In Plotly Studio, a Project holds your app's data, the prompts used to generate the app, and generated code.

Projects are automatically saved as you work, so you can leave a project and return to it later. Draft projects (projects that don't have an app generated yet) appear in your projects list alongside completed apps.

Creating a new project

When you log in for the first time, Plotly Studio opens on the New Project page where you can start creating your app. This takes you to the Data tab where you can add and transform your data.

The next time you open Plotly Studio you'll be taken to a list of existing projects, where you can select + New Project to start a new project.

Navigating within a project

When working on a project, three tabs are always accessible at the top of Plotly Studio:

• Data - Upload files, connect to external data sources, and query and transform your data.
• Explore - Browse suggested charts and create charts from scratch.
• App - Preview, edit, and publish your generated app.

You can switch between these tabs as you build your app. For example, you can go back to Data to change the data source, return to Explore to see more chart suggestions, or go to App to see previews, edit existing charts, and publish or export the app.

Data

From the Data tab, you can add data, query and transform it, and select which version to use for your app.

Adding data

You can add data by uploading a CSV or Parquet file (up to 200 MB), selecting Try sample data to use a built-in dataset, or using the chat to connect to an external data source. Use the quick action buttons or describe your data source in the chat. For example:

Connect to my PostgreSQL database

Connect to this data at https://plotly.github.io/datasets/country_indicators.csv

Connect to my Snowflake warehouse

If a data source requires credentials, you can add them in the Credentials tab. See Data Sources for more details on connecting to external data sources.

Querying and transforming data

After adding data, you can query and transform it using the chat. Here's an example using the built-in dataset to add a calculated column:

add a calculated column "shipping days" as the difference between created date and shipping date

As you query and transform your data, Plotly Studio saves versions as separate data sources. Use the dropdown to switch between versions.

Learn more about data transformations in Querying and transforming data.

Once you've selected the version of the data source you want to use, select Generate app to go to the Explore tab.

You can return to the Data tab at any time to modify your data source, queries, or transformations.

Explore

From the Explore tab, you can add suggested charts or write your own prompts to create charts from scratch.

Select Generate on a suggested chart to add it to your app, or select View prompt to customize it first.

Creating charts from scratch

To create a new chart from scratch, select Create new in the Start from scratch... section.

Describe the type of chart you'd like to add to the app and select Add chart.

Prompt reference and examples

In Plotly Studio, select in the top right corner to see chart types and prompt examples. You'll find further examples in the Prompt Library.

Once you've added charts, select View on a chart to see a preview of that specific chart, or select the App tab to see a preview of your full app. You can return to the Explore tab at any time to add more charts.

App

From the App tab, you can preview your full app, edit components, and publish.

App components

From the sidebar on the left, you'll find menu options to view and update specific parts of the app:

Setup:

• Layout - How the app is structured, what components it includes, and the order in which they are displayed.
• Theme - How the app is styled, and what colors and typography it uses.

Components:

• Filter component - Global filters that filter data used in other components, the data cards, data table, and charts.
• Data cards - Summary statistics and key metrics.
• Data table - Tabular view of the data.
• Charts - Visualizations of the data.

Editing components

Select a component from the sidebar and you'll see an editable prompt, a preview, a specification, and code:

You can also open a component from the app preview on the App Summary page:

Editable Prompt

The editable prompt is a high-level description of this specific part of the app. Updates to the prompt regenerate the app and update the preview.

Preview

This is a preview of this specific part of the app. Note: A preview is not available for the Layout.

Specification

The specification is a natural language description of the Python code. When updating the prompt, you can copy parts of the specification into the prompt if there are parts of the existing app that you want to retain.

Code

Editable Python code that uses Dash and other Plotly libraries. It is what powers the app and preview and is published to Plotly Cloud. It updates when you make prompt updates.

See the Working with Code in Plotly Studio page for a complete guide to how Plotly Studio generates code and how to make updates.

Editing the prompt

To update any part of your app, edit its prompt and select the regenerate button.

You can also generate a new version using the existing prompt with the Remix option:

Info

You won't see the Remix option if you have made changes to the text in the prompt box but haven't regenerated.

Regeneration using a new prompt or remixing with the existing prompt updates the preview, specification, and code.

Editing the code

If you have a plan that supports it, you can also update the code directly from the Code tab. For themes, the code is a Dash Design Kit theme file.

Adding and removing components

You can add charts directly from the App tab by selecting + Add in the Charts section of the sidebar. You can also return to the Explore tab to see more suggested charts based on your data.

To delete a component, hover over the component name in the sidebar and select its delete button. Data cards, data tables, and charts can be deleted.

Publishing

Once you are happy with your app, you can publish it to Plotly Cloud or Dash Enterprise by selecting Publish.

Select View App to go to the app:

To update your live app, select Republish app from the Publish menu: