Cursor、コード生成物を視覚的に整理する「Canvases」を追加Canvases
匿名の公開いいねです。記事の保存・お気に入りではなく、Featured、Top 3、重要度、掲載順位には影響しません。仕組みとプライバシーAnonymous public likes are reactions, not saved articles or bookmarks. They do not affect Featured, Top 3, importance, or listing order.How it works and privacy
- Cursorに、エージェントの回答をインタラクティブな「Canvases」として作成できる新機能が加わった。
- 生成内容を視覚的に扱える作業空間により、開発者は複雑なタスクの把握や整理を進めやすくなる。
Cursor adds Canvases, enabling agents to present responses as interactive visual workspaces and helping developers organize and understand complex output.
本ページの本文と要約は AI による自動生成です。日本語版と英語版は言語ごとに独立して生成されるため、表現や詳しさが異なる場合があります。正確性は元記事 (cursor.com) をご確認ください。The body and summaries are AI-generated independently for each language, so wording and detail may differ. Verify accuracy at the original source (cursor.com).
要約と収集メタデータに基づく AI 解説。元記事全文の転載・翻訳ではありません。AI explainer based on the summaries and collected metadata, not a copy or translation of the full source article.
Canvases
Cursorに、エージェントの応答を対話型の「Canvases」として作成する機能が加わった。生成された内容を視覚的な作業空間として扱えるため、開発者が複雑な出力を把握し、整理しやすくなる。
ビジュアル表現
キャンバスには、テーブル、ボックス、図、グラフといった標準コンポーネントを配置できる。これらを組み合わせ、情報をまとめたダッシュボードや、用途に合わせたカスタムインターフェースを構築することが可能だ。文章だけで応答するのではなく、内容に応じた視覚的な形式で提示できる点が特徴となる。
Cursor部品
標準コンポーネントに加えて、diffやToDoリストなど、既存のCursorコンポーネントもキャンバスに含められる。コードの差分と作業項目を、ほかの図表やボックスと同じビジュアル表現の中で扱えるため、エージェントが生成した複数種類の情報を一つの作業空間に整理できる。
サイドパネル
エージェントウィンドウでは、キャンバスは永続的なアーティファクトとしてサイドパネルに表示される。配置上はターミナル、ブラウザ、ソース管理と並ぶ形となり、一時的な応答ではなく、作業中に参照できる表示として扱われる。Canvasesは、Cursor 3.1のエージェントウィンドウまたはエディターで試せる。
Interactive Canvases
Cursor has added Canvases, enabling agents to present their responses as interactive visual workspaces. The feature matters because it gives developers a visual way to organize and understand complex generated output.
Rather than limiting a response to a conventional presentation, an agent can create a canvas containing visual representations and interactive material. These canvases can serve as workspaces for handling generated content and keeping different parts of a complex task organized.
Dashboards and Custom Interfaces
Canvases can include dashboards and custom interfaces built from standard components. Supported elements described in the announcement include tables, boxes, diagrams, and charts.
These components allow an agent’s response to be arranged according to the material being presented. Tables can appear alongside diagrams or charts, while boxes can provide additional structure within the same visual representation. The result can be organized as a dashboard or as a custom interface rather than a single undifferentiated response.
Canvases can also incorporate existing Cursor components. The examples provided are diffs and ToDo lists, allowing those elements to appear within the broader visual workspace alongside the standard canvas components.
Agent Window
In the Agent window, a canvas appears as a persistent artifact in the side panel. It is presented alongside the terminal, browser, and source control.
This placement means the canvas remains available as part of the Agent window rather than appearing only as a transient response. Developers can use that persistent visual artifact to keep generated material arranged while working with the other side-panel elements.
Cursor 3.1
Canvases are available to try in the Cursor 3.1 Agent window or editor. In either location, agents can respond by creating an interactive canvas that combines visual components, dashboards, custom interfaces, diffs, and ToDo lists into an organized workspace.
ポコとTECHガイドPoko & TECH Guide
ポコと当サイトのTECHガイドが、記事の要約と収集した情報から読みどころを語るAI生成の対話です。Poko and TECH Dashboard's own TECH Guide discuss the article's highlights in an AI-generated conversation based on its summary and collected source details.
- ポコPokoCursor 3.1では、エージェントの返事を対話型の画面にできるんだね。これって大きい変化？In Cursor 3.1, agent responses can become interactive visual workspaces. Is that a big change?
- TECHガイドTECH Guideこの記事では、表や図、グラフなどで複雑な生成内容を整理しやすくなる変化として紹介しているよ。The article frames it as a way to organize complex output using tables, diagrams, graphs, and other visual components.
- ポコPokoキャンバスに入れられる「diff」って、なんだろう？What’s a “diff,” one of the things a Canvas can include?
- TECHガイドTECH Guide変更前と変更後の差分を見せるものだよ。どこが変わったかを確かめるための表示、と考えると近いよ。It shows the difference between before and after a change—basically, a view for checking what changed.
- ポコPokoぼくなら、複雑な作業でToDoリストとdiffを並べて、順番に確認してみたいな。I’d use it for a complex task, putting a ToDo list beside a diff and checking each step in order.
- TECHガイドTECH Guideそれなら内容を見比べやすそうだね。Cursor 3.1のエージェントウィンドウかエディターで試せて、サイドパネルにも残るよ。That could make the output easier to compare. It’s available in the Cursor 3.1 agent window or editor, and the Canvas remains in the side panel.
