AI搭載エディタ「Cursor」から、開発ワークフローを大きく変える新機能「Web & Mobile Agent」が発表されました。

これにより、PCだけでなく、スマートフォンやタブレットのWebブラウザからでも、AIエージェントにコーディングタスクを指示できるようになります。

本記事では、この「Cursor Web & Mobile Agent」のセットアップから具体的な活用例、そして利用する上で知っておくべき料金体系のポイントまで解説していきます。

先に要点：

  • いつでもどこでもAI開発: Web・モバイルブラウザから利用可能なAIエージェント機能。PCを開かずにコーディングタスクを開始。

  • バックグラウンドで自律実行: バグ修正や機能開発など、時間のかかるタスクをエージェントに一任可能。

  • シームレスなエコシステム: Slackからのタスク指示、デスクトップIDEへのスムーズな引き継ぎ、PWAによるネイティブアプリのような体験を実現。

  • 料金体系: Proプラン以上の月額料金に利用枠（レートリミット）が含まれており、枠内であれば追加費用なし。

セットアップ

後半で詳しく解説していますが、利用には前提としてProプラン（月額$20）以上の契約が必須です。

まずは、どのデバイスからでも共通の基本的なセットアップ手順です。
非常に簡単です。

① Webアプリにアクセス: ブラウザで `cursor.com/agents` を開きます。
② サインイン: お使いのCursorアカウントでサインインします。

③ GitHubアカウントを連携: 画面の指示に従い、リポジトリへのアクセスを許可してください。

上限設定について
GitHub連携後、「Usage-based pricing required」という画面で上限額の設定を求められます。

これは、Proプランの無料枠を超過した場合の利用を制限する安全装置です。ここで設定した金額がすぐに請求されることはなく、まずはプランの無料枠が消費されるのでご安心ください。

詳細は後半の「料金体系のポイント」で解説します。

これで基本的なセットアップは完了です。すぐにエージェントにタスクを依頼できます。


モバイルでの利用 (PWA)

スマートフォンでより快適に利用するために、WebアプリをPWAとしてホーム画面に追加できます。

PWA (Progressive Web App)とは、WebサイトをApp Store等を介さずにネイティブアプリのようにインストールできる技術で、プッシュ通知や全画面表示といった体験が可能になります。

iOS (Safari)

① Safariで `cursor.com/agents` を開きます。
② 画面下部の「共有」アイコンをタップします。

③ 「ホーム画面に追加」を選択します。

ホーム画面に追加されると以下のように表示されます。

Android (Chrome)

① Chromeで `cursor.com/agents` を開きます。

② 右上のメニュー（︙）をタップします。
③「アプリをインストール」または「ホーム画面に追加」を選択します。

これで、ホーム画面に追加されたアイコンからアクセスできるようになります。


基本的な使い方

セットアップが完了したら、早速エージェントを使ってみましょう。

Web UIからのタスク実行

このファイル内のすべての関数に、機能、引数、返り値を説明するJSDocコメントを追加してください。

ホーム画面では、対象のリポジトリ、ブランチ、使用するモデルを選択できます。

プロンプトを送信すると、エージェントがバックグラウンドで作業を開始てくれます。

実行状況の確認と操作

エージェントが開始したタスクは、専用画面で進捗をリアルタイムに確認できます。

ここにエージェントの作業進捗画面のスクリーンショットを挿入

  • 変更差分(diff)のレビュー: エージェントによるコード変更は、見やすい差分形式で表示されます。

  • デスクトップへの引き継ぎ: Web上での確認・修正が難しい場合は、「Open in Cursor」ボタンでデスクトップのCursor IDEに作業を直接引き継ぐことができます。

共有とプルリクエスト

  • 実行結果の共有: 各エージェントの実行画面のURLを共有することで、チームメンバーも作業内容を確認できます。

  • プルリクエストの作成: エージェントの作業が完了し、内容に問題がなければ、Web UIから直接プルリクエストを作成できます。


具体的な使用例

より具体的なシナリオでエージェントを動かしてみます。

①：既存コンポーネントに「クリップボードコピー機能」を追加する

外出先で、既存のUIコンポーネントにちょっとした機能追加を思いついた、という状況を想定して、スマートフォンからエージェントに直接指示してみます。

対象のコード: `src/components/SubtitleControls.tsx`

import React, { useState } from 'react';
// ... (中略) ...
export const SubtitleControls: React.FC<SubtitleControlsProps> = ({
  transcript,
  onBurnSubtitles,
  isProcessing,
}) => {
// ... (コンポーネントの実装) ...
};

送信したプロンプト：

src/components/SubtitleControls.tsx に、トランスクリプトの内容をクリップボードにコピーする機能を追加してください。「SRTファイルをダウンロード」ボタンの隣に「テキストをコピー」ボタンを新設し、クリックするとトランスクリプトの全テキストがクリップボードにコピーされるように実装をお願いします。

スマートフォンから送信してみます。以下のようなUIになります。

今回の指示では、処理が完全に完了するまでに約33分を要しました。少し時間がかかった印象です。

すべての作業が完了すると、Web UI上でプルリクエストが作成されたことが確認できます。スマートフォンからでも「View PR」ボタンで直接GitHubのプルリクエスト画面に飛んだり、差分(diff)を確認したりできます。


料金体系

Web & Mobile Agentの料金体系は、一見すると分かりにくい部分がありますが、Proプラン以上の有料プランユーザーは、月額料金内で追加費用なしに利用を開始できます。

Proプラン以上に含まれる「無料利用枠」

  • 前提条件: Web & Mobile Agentを利用するには、Proプラン（月額$20）以上の契約が必須です。

  • 無料利用枠（Rate Limits）: これらの有料プランには、月額料金の一部として、「レートリミット」が予め含まれています。Web & Mobile Agent（=Max Mode）を利用すると、この枠内からリソースが消費されます。

  • このレートリミットを使い切るまでは、追加の従量課金は一切発生しません。

実際にコストがかかっているかどうかはダッシュボードのUsageから確認できます。


レートリミットを超過した場合

プランに含まれる無料利用枠をすべて使い切ると、エージェントの実行時に初めて通知が表示され以下の3つの選択肢を選ぶ形になります。

  1. レートリミットが高いモデルに切り替える（例：OpusからSonnetへ）

  2. 従量課金に切り替える: レートリミットを超えた分の利用に対してのみ、トークンベースの料金を支払う。

  3. 上位プランにアップグレードする

ちなみに、Cursorのプランは以下のようになっています：

まとめ

先日発表された、Gemini CLI、OpenAIのCodexやDevin、そしてClaude CodeといったAIエージェントによる開発体験が注目される中で、Cursorもこの分野への取り組みを加速させています。

Cursor Web & Mobile Agentの大きな特徴は、既存のデスクトップIDEとのシームレスな連携にあります。従来、Slack経由での指示も可能でしたが、公式のWebインターフェースが提供されたことで、UI/UXは格段に向上した印象です。

移動中などのPCが使えない状況でも、スマートフォンからコーディングタスクを依頼できます。そして修正をデスクトップのCursorにワンクリックで引き継ぐ、という一貫した開発体験が可能になります。

ただし、現状ではCLI操作など、完全なターミナルアクセスが提供されているわけではありません。あくまでコードの生成や編集といったタスクに特化している点は、認識しておく必要があります。

ぜひこの記事も参考にご自身の環境で試してみてください！

公式リソース

Web App: cursor.com/agents
公式ドキュメント: