はじめに：ChatGPTとClaude Codeで作る、新しいホームページ制作
こんにちは、クロスタのRyuichiです。最近、僕が試しているホームページの作り方があって、これはクロスタで学んでいる方にも共有しておきたいなと思ったんです。ChatGPTとClaude Codeを組み合わせると、ある程度きれいなホームページが作りやすくなったと感じていて、今日はその具体的な流れを話してみようと思います。
強力な画像生成機能が土台に
この手法を試そうと思ったきっかけは、最近のChatGPTの画像生成能力が大きく向上したことです。
すでにお使いの方もいると思いますが、日本語の扱いが非常に上手になり、まるでチラシのようなデザイン性の高い画像も作れるようになりました。僕の周りでも、この機能を使って面白い画像をたくさん作っている方がいます。
僕自身はチラシ作りやインスタグラムは今やっていないんですけど、この進化した画像生成機能をホームページ制作に応用できないかな、と考えたのが今回の手法の核になっているんです。
ステップ1：参考サイトからデザインの「部品」を集める
ホームページ制作でゼロからデザインを考えるのって、なかなか大変ですよね。そこで、プロの制作現場でも行われているように、まずは「参考サイト」を探すところから始めます。
制作会社と同じ「イメージのすり合わせ」から始める
最初に、どのようなホームページを作りたいのか、そのイメージに近い参考サイトを探します。
これ、実はホームページの制作会社がクライアントと打ち合わせをするときに、「どういうイメージが近いですか？」と参考サイトを見せながらすり合わせをする工程と全く同じ考え方です。まず完成形のイメージを固めることで、手戻りを減らすことができます。
著作権に配慮した「セクション単位」での模倣術
![複数サイトからセクションを組み合わせる](https://teachshelf-api.bigi-i