対象読者： AIを使ったサイト制作に興味があるけど、エンジニアではない個人事業主・中小企業のWeb担当者
「スキーマ設計」って何ですか？
正直に言います。昨日まで「スキーマ」という言葉の意味を、サイト制作の文脈では知りませんでした。
ただ、仕事柄「ボディスキーマ」という言葉を使うので、「図式」「構造」というイメージは持っていました。それがそのままサイト設計にも当てはまりました。
サイトのスキーマ設計＝サイトの構造を設計すること。
具体的には「このサイトにどんなコンテンツを入れるか」を定義する作業です。今回は以下の5つを設計しました。
- 実践記（記事本文・タイトル・カテゴリ・公開日など）
- カテゴリ（記事の分類）
- 著者（プロフィール・アイコンなど）
- サイト設定（サイト名・キャッチコピー・SNSリンクなど）
- サービス（提供サービス・料金・問い合わせURLなど）
WordPressで言えば、投稿タイプやカスタムフィールドを設定するイメージに近いです。
AIに投げたら一瞬でファイルが5つできた
スキーマの設計は、Cursor（AIコードエディタ）のチャット欄に必要なコンテンツの内容を書いて投げるだけでした。
数秒後には5つのファイルが自動生成されていました。
正直に言うと、AIにやってもらった感覚が強いです。 自分でやった感じはあまりしません。
でも、これが今の時代の「作り方」なのだと思っています。大工が電動工具を使うように、AIというツールを使って作業を進める。ツールを使いこなすこと自体がスキルです。
エラーが出た。でも解決できた
スムーズにはいきませんでした。
Cursorがファイルを作ってくれたにもかかわらず、Sanity Studioを開いても「No document types」と表示されたままでした。
原因はexportの書き方の違いでした。Cursorが生成したコードと、既存の設定ファイルの読み込み方が噛み合っていなかったのです。
ただ、コードが分からない自分には「何が原因か」が全く分かりませんでした。
そこで活用したのがClaudeへのセカンドオピニオンです。
実はこれ、以前Difyで自動化設定を作ったときにも同じことがありました。CursorでPythonコードやJSONコードを書き出してもらったのに、コードに誤りがあって動かない。でもコードが分からないので原因が分からない。その時はChatGPTにセカンドオピニオンをもらって解決しました。
この経験から学んだことがあります。
AIの出力に別のAIで監査を入れると、精度が上がる。
ただし、何度もやるとクドくなるので「2回まで」など回数制限を決めておくのが現実的だと感じています。
「作業AI」と「会話AI」の使い分け
今回の作業を通じて、AIの使い分けが見えてきました。
| 役割 | 使ったAI |
|---|---|
| コードを書く・ファイルを作る | Cursor |
| エラーの原因を調べる・相談する | Claude |
作業を実行するツールと、Chat型のAIを使い分けるのがいい。
これが今の自分の結論です。エンジニアではない自分でも、この使い分けを意識するだけで作業が格段に進めやすくなりました。
Sanity Studioに5つのメニューが表示された瞬間
修正後にブラウザを開いたら、左側に「実践記・カテゴリ・著者・サイト設定・サービス」の5つが並んでいました。
「これでいいのかな？」というのが正直な感想です。
使ったことがないツールなので、合っているのかどうか自分では判断できません。Claudeに「完璧です！」と言われて初めて安心しました。
自分で判断できないことをAIに確認してもらう、という使い方が自分には合っているようです。
2日間やってみて思ったこと
セットアップからスキーマ設計まで2日間やってみた率直な感想はこれです。
「自分にはできないけど、AIを使えばできそう。」
エンジニアでない自分が、コードを一行も書かずにSanityのスキーマ設計まで完了しました。AIなしでは絶対に無理でした。でも、AIと一緒なら動けました。
これはWordPressのテンプレートを使って「自分でサイトを作った」という感覚に近いかもしれません。仕組みは分からなくても、ツールを使いこなせれば前に進める。
次回予告
次はNext.jsとSanityを接続して、サイトとしてブラウザに表示される状態を作ります。
「コンテンツを管理する仕組み（Sanity）」と「サイトとして見せる仕組み（Next.js）」が繋がる瞬間です。引き続き、全部見せていきます。