AI News HubLIVE
サイト内リライト2 分で読了

キャンバスでインタラクティブな体験を構築する方法

GitHub Copilotの「キャンバス」拡張機能は、AIを対話型ツールから視覚的でインタラクティブなワークスペースに変えます。開発者はプロンプトを使用して、課題のトリアージ、コードの可視化、セッション管理、プロンプトコーチング、知識検索などのタスク向けにカスタムキャンバスを作成できます。キャンバスはリアルタイムのコラボレーションをサポートし、ユーザーとAIエージェントが一緒に反復処理を行えます。

ソースGitHub AI & ML著者: Jacklyn Carroll

現在、ほとんどの開発者はAIエージェントと連携しているか、少なくともその方法に慣れています。エージェントはアイデアを探求し、プロジェクトの計画からワークフローの自動化まで、アクションに変換するのに役立ちます。多くの場合、会話だけで作業を進めることができます。

しかし、会話形式にうまく適合しないタスクもあります。複雑な情報を視覚化したり、複数のソースから情報を統合したりする必要がある場合、視覚的インターフェースを使用すると、パターンを理解し、関連性を見つけ、アクションを実行しやすくなります。GitHub Copilotの「キャンバス」拡張機能はまさにそのためにあります。これらはAIを対話型ツールから共有のインタラクティブワークスペースに変えます。

キャンバスはCopilotアプリ内の拡張インターフェースで、開発者とAIエージェントがリアルタイムでコラボレーションできます。エージェントは作業中にキャンバスを更新でき、ユーザーはクリックや編集などの操作で同じワークスペースと対話できます。これらの対話はエージェントに送り返すか、キャンバスでローカルに処理できます。Copilotにキャンバスの反復を依頼することで、新機能の追加や既存機能の改良など、継続的に体験を形成できます。

キャンバスを作成するには、Copilotアプリのエージェントセッションで/create-canvasを使用し、作成したいものとサポートすべき機能を説明します。キャンバスはプロンプトから生成され、ワークフローとともに進化するため、さまざまな形態をとることができます。以下にいくつかの例を示します。

課題トリアージヘルパー:GitHub Issuesを視覚的に素早くトリアージします。プロンプトでカード形式のインターフェースを作成し、右にスワイプで承認、左にスワイプで拒否。キャンバスはリアルタイムで更新され、決定を追跡します。

インタラクティブコードベース図:プロジェクトの構造とコンポーネントの関係を視覚化します。プロンプトで動的な図を生成し、各ノードがシステムの異なる部分を表し、ホバー、ドラッグ、フィルターが可能です。

セッションワークツリービュー:アクティブなCopilotセッションと関連するGitワークツリーを表示し、アクティブかスタックかを明確に示します。ボタンクリックでスタックしたワークツリーをクリーンアップできます。

エージェントプロンプトコーチ:過去のプロンプトを分析し、改善点(欠落したコンテキストやスペルミスなど)を提案して、エージェントとのコミュニケーションを最適化します。

知識ファインダー:Slack、Teams、メール、ドキュメントを横断して特定のファイルやトピックに関する知識を持つ人を検索し、関連性の高い人を表示します。

これらの例はキャンバスの可能性の一部にすぎません。キャンバスはAIを会話ツールから、情報を視覚化し、ワークフローを探索し、退屈なタスクを楽しい体験に変える場所に変えます。ぜひGitHub Copilotアプリで試してみてください。詳細はドキュメントをご覧ください。