Cursor で作る

Cursor は、Nodaro MCP サーバーを通じて、Web サイトを作りながら、そのサイトに必要な画像を作れます。チャットで依頼すると、Cursor のエージェントが Nodaro の画像モデルを実行し、各画像のアドレスを受け取ります。このページでは、実際の依頼を 1 つたどります。ハイキングアプリのランディングページ用の、ヒーロー画像 1 枚と機能紹介の画像 3 枚です。

まず Cursor を接続するには、Cursor を接続の手順に従います。必要なのは、リンク 1 つと、Nodaro アカウントでのログインだけです。

依頼

この例は、Cursor が接続するのと同じ Nodaro MCP サーバーを通じて、Claude Code から実行しました。Cursor も、同じモデル、設定、料金で同じツールを呼び出します。

ヒーロー画像は 2 回目で完成

最初のヒーロー画像は、ひと目では良く見えました。しかし、モデルは「room for a headline on the left」（左側に見出しを置く余白）を、文字どおりに受け取りすぎました。左の 3 分の 1 を空だけの別のパネルとして切り分けたため、画像の左から 3 分の 1 の位置に、くっきりとした縦の境目ができました。

2 回目のリクエストでは、問題をはっきりと指摘しました。空がフレーム全体に続き、ハイカーが右 3 分の 1 にいる、「one continuous photograph」（1 枚のつながった写真）を求めました。

ヒーロー画像に合わせた機能紹介の画像

3 枚の機能紹介の画像には、完成したヒーロー画像をリファレンス画像として渡し、「the warm sunrise color grade of the reference image」（リファレンス画像の、日の出の暖かなカラーグレード）に合わせるよう求めました。3 枚とも、同時に実行されました。

Cursor が実行したもの

ヒーロー画像は 1376×768、機能紹介の画像は 1200×896 で返されました。

画像をプロジェクトに入れる

各ツールは画像の Web アドレスを返し、画像は Nodaro のライブラリにも保存されます。Cursor のエージェントは、ターミナルを使って、ファイルをプロジェクトにダウンロードできます。次のような依頼で、作業が完了します。

次の依頼のアイデア

• 「SNS のシェア画像用に、ヒーロー画像の 1:1 版を作って」
• 「ナイトテーマ用に、ヒーロー画像の暗い版を作って」
• 「ヒーロー画像を 6 秒の背景動画にして」

リファレンス画像と Nodaro のすべての画像モデルについては画像生成で説明しており、モデルの比較はモデルの選び方にあります。

Cursor を接続する

1. Cursor を接続にある Add to Cursor（Cursor に追加）リンクを開きます。Cursor のインストールダイアログが、Nodaro の情報が入力済みの状態で開きます。
2. 内容を確認し、ブラウザーで Nodaro アカウントにログインします。
3. チャットで画像を依頼します。たとえば「Nodaro で、このページのヒーロー画像を作って」と入力します。

同じツールは、Claude、ChatGPT、VS Code でも使えます。