Cursor のデザインモード機能強化
Cursor はブラウザ内のデザインモードを強化し、マルチセレクト機能とボイス入力を追加することで、エージェントによる UI 修正の効率と直感性を大幅に向上させた。
キーポイント
マルチ要素選択機能の強化
ブラウザ上で複数の要素を同時にクリック・選択でき、エージェントがコードやレイアウト関係を理解した上で一括編集を可能にする。
ボイス入力による非同期操作
デザインモードのオーバーレイから音声で指示を出せるようになり、エージェント実行中でも次の変更をキューイングできるため待機時間が不要になった。
視覚的関係性の理解向上
選択された要素間のコード構造だけでなく、ページ上の視覚的な関係性や周囲のレイアウトもエージェントが認識し、より文脈に即した修正が行える。
重要な引用
Click on two or more elements together in the browser. Cursor sees the selected elements, their code, the surrounding layout, and the visual relationships on the page.
The mic stays available while an agent is mid-run, so you can queue the next change by voice without waiting for the previous one to finish.
影響分析・編集コメントを表示
影響分析
このアップデートは、AI エージェントによるフロントエンド開発における「視覚的推論」と「人間とのインタラクション」の質を根本から変えるものです。従来のコードベースでの指示待ちから、直感的な操作と音声による継続的なフィードバックへ移行することで、開発者の生産性が劇的に向上し、非技術者でも複雑な UI 修正に参加できる可能性が開かれます。
編集コメント
開発者がコードを書かずに視覚的な指示で UI を修正できる環境は、AI エージェントの実用化における重要なマイルストーンです。特に「実行中の待機なし」機能は、対話型 AI ツールの使い勝手を劇的に改善する要素と言えます。
Cursor ブラウザのデザインモードでは、クリックや描画、音声による説明を行うことで、エージェントに UI の更新を手伝ってもらうことができます。
複数要素の選択
ブラウザで 2 つ以上の要素を同時にクリックしてください。Cursor は選択された要素、そのコード、周囲のレイアウト、ページ上の視覚的な関係性を把握します。
エージェントに対して、一方を他方に合わせる、重複するコンテンツを削除する、あるいは一連のコンポーネントをまとめて調整するよう指示できます。
音声入力
デザインモードのオーバーレイを通じて変更内容を口頭で説明してください。エージェントが実行中の間もマイクは利用可能なので、前の処理が完了するのを待たずに、次の変更を音声でキューに追加できます。
原文を表示
With Design Mode in the Cursor browser, you can click, draw, or describe changes by voice to help agents update your UI.
Multi-select elements
Click on two or more elements together in the browser. Cursor sees the selected elements, their code, the surrounding layout, and the visual relationships on the page.
Ask the agent to make one match the other, remove repeated content, or adjust a group of components at once.
Voice input
Narrate changes through the Design Mode overlay. The mic stays available while an agent is mid-run, so you can queue the next change by voice without waiting for the previous one to finish.
関連記事
今日のまとめ
AI日報で今日の重要ニュースをまとめ読み