株式会社ユー・エス・エス／上田写真製版所 ブログ
◆Gemini 3.0で試す！指示だけでWebサイト制作はどこまで可能か？
はじめに
先日、GoogleのAIモデル「Gemini」が2.5から3.0へアップデートされました。
特に、Gemini 3.0はコーディング能力が大幅に向上したと聞いています。そこで今回は、この進化したGemini 3.0を使い、デザインやコーディングの作業を一切行わず、AIへの指示（プロンプト）だけでWebサイトをどこまで作り上げられるのかを検証してみました。
最初の挑戦：既存サイトの再現と改善
検証として、当社の既存ホームページのトップページをGeminiに作り直すよう指示しました。
まず、現在のHTMLコードを入力し、コンテンツの分析を依頼。さらに、「動きを取り入れたデザインで訴求力を高めたい」という方向性を伝えました。
しかし、最初の結果は、元のサイトとデザインも内容も酷似しており、改善されたという印象は薄いものでした。
そこで改めて、「訴求力を上げてほしい」と具体的に改善を依頼しました。
するとGemini 3.0は、以下の具体的な施策を提案してきました。
- 強いコピーライティングとストーリー性の導入
- 信頼感とインパクトの融合による印象付け
- 視線誘導のアニメーションを活用したユーザー体験向上
この提案に基づいて出来上がったサイトがこちらです。
課題の浮上：細かい修正の難しさ
提案後のサイトは、表現力が大幅に向上しました。しかし、細部には気になる箇所が残ったため、部分的な修正を依頼しました。
ここで課題が浮上しました。
AIは細かい修正指示に対しても、ページ全体を見てコードを再生成するため、小回りが利きません。結果として、一部を修正すると他の箇所が意図せず変更されてしまう、という現象が頻発し、何度も指示を繰り返す必要がありました。
制作プロセスを最適化：セクションごとのモジュール化
この非効率を改善するため、ページの作り方を根本的に見直しました。
Geminiへの指示は、非常にシンプルなものでした。
セクションごとに、HTML、CSS、JavaScriptがセットになってコピペするイメージでコードを作成してください。これなら、修正は各セクションをまるごとコピペで修正できると考えています。
この指示により、AIにはコンテンツのセクションごとに、HTML、CSS、JavaScriptをセットでまとめて出力してもらうようにしました。
これにより、セクション単位で修正指示を行い、該当箇所だけを差し替えることで、効率的に修正を重ねることが可能になりました。
この手法は、人間がマークアップする上では視認性が悪く通常は採用されない方法です。しかし、AIが「使い捨てコード」として柔軟に生成できるため、「人間がわかりやすくする必要がない」というAI制作の特性を最大限に活かしました。
ディレクターとして、表現の指示をするだけで、デザイン、コーディング、プログラミングは全てGeminiに任せ、気になるセクションを何度も修正し、完成度を高めていきました。
最終的な成果
最終的に出来上がったサイトがこちらです。 使用している画像も、ダミーとしてAdobe Fireflyで生成した画像を用いています。
まとめ
この検証から、人間がデザインスキルを持たずとも、AIに明確な方向性や表現の指示を与えるだけで、高品質なホームページが制作できる時代が、すぐそこまで来ていることを実感しました。AIの進化は、Web制作のプロセスを根本から変えようとしています。
株式会社ユー・エス・エスは、印刷物や広報ツールの制作に加え、Webサイトやフォーム、CMSの構築・運用まで、企業の情報発信をトータルでサポートしています。
今回のようなAIを活用した制作手法についても、「どう使えば実務に活かせるか」「品質をどう担保するか」といった視点でご提案可能です。
新しい技術を取り入れたWeb制作や広報の改善をご検討の際は、お気軽にご相談ください。
