AIでホームページを作れるのか、という話をよく聞くようになりました。私は小規模企業3社のホームページを、AIを使って作り直しています。仕事として引き受けたもので、練習ではありません。かかった期間は1社あたり約3日でした。
私はシステム開発の技術者ではなく、HTMLもCSSも書けません。それでも公開できる状態までは進められました。ただし3日のうち大半は、デザインの調整に消えています。
先に今回の結論を書きます。HTMLやCSSを書けなくても、企業のホームページを公開できる形まで作ることはできました。一方で、デザインの良し悪しや、その会社らしさをどう出すかという判断までは任せられませんでした。この記事では、3社でそれぞれ何が起きて、どう対処したかを書きます。
AIで企業のホームページを3社作り直しました
私がやったことは単純です。作りたいものを日本語で伝え、出てきた画面を見て、違う部分を伝えて直してもらう。この繰り返しです。コードを自分で書いた場面はありませんでした。
3社とも小規模な企業で、既存のサイトを作り直す仕事でした。1社目から3社目まで、期間はいずれも3日ほどです。日数だけを見れば短いのですが、内訳を書くと、あまり褒められた進め方ではありませんでした。
載せる内容やページの構成を決める作業は、そこまで時間がかかっていません。時間を持っていかれたのは、デザインです。
3日のうち大半はデザインの調整に使いました
制作の中で一番長かったのは、画面の見え方を整える工程でした。
文章の下書きやページの並びは、方向さえ決めれば形になります。ところがデザインは、出てきたものを見て「これは違う」と思ってから、どう違うのかを言葉にするところで詰まります。この言語化に時間がかかりました。
最初に生成されたデザインには共通点がありました
1社目で最初の画面が出てきたとき、率直に、思ったより整っていると感じました。
ところが2社目でも似た画面が出てきました。3社目でも同じです。業種も規模も違う会社なのに、レイアウトの骨格がほとんど変わりませんでした。
私が3社で見た範囲では、次のような構成が続きました。
- 画面の上部に大きな見出しと短い一文
- その下に角の丸いカードが3つ横並び
- 背景に紫から青へ変化する色
- 見出しの先頭に絵文字
これで納品すると、依頼してくれた会社のサイトが、見覚えのある形の1つになってしまいます。そこから調整に入りました。
「かっこよくして」という指示ではデザインが変わりませんでした
最初に試したのは「もっとかっこよくしてほしい」と伝えることでした。
出てきたのは、角の丸いカードが影付きのカードに変わり、色が紫系から緑系に変わったものでした。並び方や画面全体の組み立ては、ほとんど動いていません。
「今風に」と伝えたら文字量が減りました
次に「今風にしてほしい」と伝えました。今度は余白が大きく広がり、画面あたりの文字量が減りました。下へスクロールしても、書いてある情報が少ないページになっています。
このあたりで、指示の言葉が抽象的すぎることに思い当たりました。「かっこいい」も「今風」も、指しているものが人によって違います。何を指すか決まっていない言葉を渡していたので、こちらが想像していたものと違う結果が返ってきていた、ということです。
1社目と2社目は、この状態のまま調整の往復を続けました。1回直すと少し良くなりますが、次の回で別の箇所が変わってしまう。戻したり進めたりを繰り返して、そこで時間を使っています。
3社目から、先に「使わないもの」を伝える方法に変えました
3社目で、伝え方を変えました。良し悪しを後から言うのではなく、使ってほしくないものを先に、具体的に書いて渡す方法です。
実際に指定した内容
3社目で最初に渡したのは、次のような条件でした。
- 紫から青へ変化する背景は使わない
- 角の丸いカードを3つ横に並べない
- 見出しの先頭に絵文字を付けない
- 必要以上に余白を広くしない
- 文字を細くしすぎない
抽象的な形容詞を並べるより、この形のほうが早く進みました。1社目と2社目で長引いた往復が、3社目では明らかに減っています。
もし今から同じ作業をする人がいたら、私はまずこの「使わない一覧」を作ることを勧めます。理想の形を言葉にするより、避けたい形を挙げるほうが、たいていの人にとって簡単だからです。
禁止事項だけでは会社らしさは出ませんでした
ただし、これで全部が解決したわけではありません。
条件はすべて守られているのに、特徴のない画面が出てくる、という状態になりました。避けたいものを外しただけでは、その会社らしい形にはならないからです。そこから先は、どういう見え方にしたいのかを、こちらが持っている必要がありました。
結局この部分は、私が判断しています。
AIが書いた文章も、そのままでは使いませんでした
デザインと並んで手を入れたのが、文章です。
会社紹介の下書きは、日本語としては問題なく仕上がってきました。一見そのまま使えそうにも見えます。ただ読み返すと、「お客様に寄り添う」「確かな技術力」「地域に根ざした」といった、他の会社でも使える表現が多く並んでいました。
3社とも、文章はかなり書き直しています。
企業理念は自分で考えました
今回の3社では、企業理念だけは私が自分で書きました。
理念はその会社が何を大事にしているかという話なので、他社と同じ言葉になってしまうと意味がなくなると考えたためです。これは今回そうしたという話で、必ずそうしなければならない、という意味ではありません。
理念以外の部分は、出てきたものを確認しながら進めることができました。
今回のやり方で良かった点
3社を終えた時点で、良かったと感じているのは次の点です。
HTMLやCSSを自分で書く必要がありませんでした。技術者ではない私が、制作の作業そのものを進められています。出てきたものを見ながら修正を伝えられるので、完成形を先に固めなくても進行できました。結果として、1社あたり3日ほどで公開できる状態まで到達しています。
今回、難しかった点
一方で、難しかった点もはっきりしています。
デザインの調整に時間がかかりました。抽象的な指示では意図が伝わらず、往復が増えました。1か所を直すと別の箇所が変わってしまうことがあり、進んでいるのか戻っているのか分かりにくい場面もありました。文章は一般的な表現になりやすく、書き直しが必要でした。そして、その会社らしさをどう出すかは、最後まで私の側の仕事として残りました。
これから試す人が先に決めておくとよいこと
3社を通して、着手前に決めておけば時間を減らせたと思うことが3つあります。
1つ目は、使ってほしくないデザインを先に書き出しておくことです。良し悪しの判断は後で構いません。
2つ目は、理念やその会社にしか言えない部分を、自分で書くと決めておくことです。ここを預けると、書き直しの往復が増えます。
3つ目は、デザインの調整に時間がかかる前提で日程を組むことです。私の場合、3日のうち大半がそこでした。内容さえ決まれば作れる、という見込みで組むと、日程が足りなくなります。
AIだけでホームページ制作を完結できるのか
今回の3社に限って言えば、完結はしませんでした。
手を動かす作業は速くなりました。一方で、何を載せるか、どう見せたいか、出てきたものが良いかどうかを決める部分は、速くなっていません。ここは今も自分でやっています。
作業が減ったというより、自分がやる仕事の中身が、書く作業から決める作業に移った、というのが実感に近いです。
よくある質問
AIでホームページは本当に作れますか
私は小規模企業3社のホームページをAIで作り直し、いずれも公開できる状態まで進められました。ただしデザインの調整には時間がかかっています。
HTMLやCSSが分からなくてもAIでホームページを作れますか
私はどちらも書けませんが、3社とも制作を進められました。コードを書く代わりに、出てきた画面を見て修正を伝える作業が中心になります。
AIでホームページを作るのに何日かかりますか
今回は1社あたり約3日でした。サイトの規模や求める仕上がりで変わるため、一般的な期間としては言えません。
AIで作ったホームページは似たデザインになりませんか
私が3社作った範囲では、最初に出てくる画面の骨格が3社ともよく似ていました。使ってほしくない要素を先に具体的に伝えることで、この状態からは抜けられています。
AIにホームページ制作を全部任せられますか
今回の3社では任せきれませんでした。企業理念は自分で書いていますし、デザインの良し悪しの判断も自分で行っています。
まとめ
技術者ではない私が、小規模企業3社のホームページをAIで作り直しました。1社あたり約3日で、一番時間がかかったのはデザインの調整です。
「かっこよくして」のような抽象的な指示では思ったように進まず、3社目で、使ってほしくないものを先に具体的に伝える方法に切り替えました。文章は書き直しが必要で、企業理念は自分で考えています。
作業は速くなりましたが、判断する仕事は残りました。この前提で使うなら、非エンジニアでも企業サイトの制作は進められると思います。
作ったホームページを実際に公開するまでの手順は、AIで作ったホームページの公開手順 レンタルサーバーの選び方にまとめています。
