デザイン提案が「2週間→2日に」設立22年を迎えるWeb制作会社のAI活用法

デザイン提案の手戻りやリソース不足に悩むWeb制作会社必見！ “日本のWebらしさ”を徹底研究した「Hirameki 7」の実力とは。

7:05

Sponsored by: トライベック株式会社

「クライアントの要望をヒアリングしても、具体的な形が見えてこない」
「互いの頭にあるイメージをうまく共有できず、歯痒い思いをする」
「提案用のモックを作るのに時間がかかり、回せる案件数に限界が出てしまう」

――こうした“デザイン提案前のすれ違い”や“リソースのひっ迫”といった悩みを抱えるWeb制作会社は少なくない。

近年は、これらの課題を解消するために、生成AIツールを活用するケースも増えている。だが、海外製のツールでは日本語フォントをうまく扱えなかったり、いかにもAIで作ったことがバレバレの安っぽいデザインになってしまったり、どこかで見たような“没個性”なものになってしまったりと、イメージ通りの高品質なWebサイトを制作するのは難易度が高い。

デザイン提案にAIを活用してみたものの、「プロンプトをいくら変更しても、思い通りのものが出てこない」「仕上がりが微妙で、手作業での修正作業に余計な工数を割くことになった」など、生産性向上よりも落胆の声のほうが大きい現状もある。

そうしたなか、Web制作会社のカンナートは、AIツールを活用することで、クライアントとのコミュニケーションのズレを解消。デザイン提案にかかる期間を、従来の1〜2週間から、わずか1〜2日へと短縮することに成功した。

本記事では、カンナートの抱えていた課題、選んだAIツール、その使い方のノウハウなどについて詳しく聞いてみた。

従来のワークフローに潜む3つの難所をいかに乗り越えるか

カンナートは、今年22期目を迎える老舗のWeb制作会社だ。エンジニアやデザイナーを社内に抱え、Webサイトのフロント部分だけでなく裏側のシステム部分、また制作から運用まで、Webにまつわるあらゆる事業課題を解決に導く。

親会社のジェネレーションパスが巨大ECサイト「リコメン堂」を運営していることもあり、コロナ禍にはECサイト構築の依頼が殺到した。しかし昨今ではEC需要も落ち着きを見せ、BtoB企業のコーポレートサイト構築や、ECサイトの運用フェーズにおけるシステム改善のニーズが高まっているフェーズにあるという。

カンナートの古閑清氏は、営業としてこれまで多くのクライアントと対面してきた。Web制作業務の従来のフローは、どんなWebサイトにしたいのか、最初にお客様の要望をヒアリングし、その内容を社内に持ち帰り、次のデザイン提案に向けて、デザイナーにラフを起こしてもらうというものだ。

しかし、このやり方には3つの難所があった。

① 言葉に頼った抽象的な合意形成の限界

いくらクライアントと相対してヒアリングを重ねても、頭の中を直視できるわけではない。「やわらかい感じ」「重厚感」といった抽象的な概念を言語化し、作り手とクライアントの間でイメージをシンクロさせることは、極めてハードルが高い。そのため、認識の齟齬が生じることもある。

② 「参考サイト」から真の要望を汲み取る難しさ

「こんなサイトが良い」と参考となるWebサイトを提示してくれるクライアントは多いが、そのサイトのどの部分を良いと思ったのか、核心を読み取るのは難しい。たとえば、「レイアウトが気に入っているのか」「色味が好みなのか」「コンテンツの要素が好みなのか」「なんとなく全体の雰囲気が好きなのか」――もし間違った要望を汲み取ってしまうと、デザイン提案の段階で「思っていたものと違う」という認識のズレが生じ、プロジェクトの進行に大きな影響を与えてしまう。　

③ デザイン提案にかかる時間と手間

デザイン提案までの従来のフローでは、ヒアリング内容をもとにデザイナーがラフを制作するため、提案までに1〜2週間ほどかかる。また、クライアントとの事前のヒアリングで認識のズレが生じていた場合、デザインの見直しや手直しが必要となり、さらに時間を要することになる。

このような構造的なタイムラグが積み重なることで、案件自体のリードタイムが長期化し、人手不足で案件を回しきれないなど、事業スケールの限界を招いていた。

そこで導入したのが、DX支援ツール「Hirameki 7（ヒラメキセブン）」だった。

プロンプトからWebサイトを生成し、ノーコードで自由に編集

Hirameki 7は、トライベック社が提供する、フリーランス・中小企業向けのマーケティングDX支援ツールだ。

トライベックは2001年創業、長年にわたり、国内主要企業のWebサイトの使い勝手を客観的な指標によって評価し、「Webユーザビリティランキング」を発表し続けるなど、日本のデジタルマーケティングを黎明期から牽引してきた。Webサイトの“使いやすさ”や“成果”といった本質と向き合ってきた同社が、豊富な知見とノウハウを注ぎ込んで作り上げたのがHirameki 7だ。

Hirameki 7には、名刺管理やメルマガ配信、営業リスト検索や案件管理など、営業DXに必要な機能が多数搭載されている。その数ある機能の中で、カンナートのデザイン提案のフローを激変させたのが、AIとノーコードエディターで高品質なサイトを簡単に作成できる「AIサイト」機能である。

AIサイトでは、エディター内に、文章で簡単なプロンプトを入力すれば、わずか数分でオリジナルのWebサイトが生成される。もちろん、生成されるのは、PCとスマホ両方に対応したデザインだ。

また、生成されたデザインを修正したいとき、一般的な生成AIツールでは、理想の形になるまで何度もプロンプトを打ち直してチューニングを重ねるか、直接コードを編集するしかない。しかし、AIサイトなら、修正する場所を直接指定し、フォントを調整したり、文章を修正したりと、ノーコードで自由にデザインを編集できる。

“AI臭くない”プロ仕様のデザインを簡単に実現

古閑氏は、初めてHirameki 7に触れた時、「クオリティの高さに驚きを隠せなかった」という。AIで作ったWebサイトなのに、あまりにも“AI臭くなかった”からだ。

これまでも、モック制作のために生成AIを試してはいたのですが、一般的なAIツールですと、細かく作りこんだプロンプトを打たないとなりませんし、イメージした通りのものを作り上げるのは困難でした。
ところが、Hirameki 7では、簡単な指示で高品質なデザインが出てきます。たとえば温泉宿のWebサイトを作るとしたら、「旅館のサイトを作って」「温泉が有名」など普通の言葉をいくつか入れるだけで、完成されたデザインがサッと出てくる。プロンプトを作りこむ必要がなく、“初心者に優しい”と感じました。
また、出てきたデザインに少し直したい部分があっても、いちいちプロンプトを修正する必要はなく、ノーコードエディターでその箇所だけ簡単に修正できる柔軟さも便利でした（古閑氏）

“日本のWebサイトらしさ”を徹底的に研究

「普通のAIツールが生成したサイトには、『ちょっと違うよ』と言いたくなるところがあるものだが、Hirameki 7にはそれがない」と古閑氏は絶賛する。

Hirameki 7は、とにかく「AIスロップ」（生成AIが大量生産する、品質が低く、中身が薄い、似たようなコンテンツ）を回避することを目指して開発されたという。初期開発から携わったトライベックの佐孝徹氏は、「“AI臭さ”の原因を極力排除するために、“日本のWebサイトらしさ”を徹底的に研究した」と語る。

汎用的な生成AIや海外製のAIツールで作ったWebサイトに日本語のテキストを流し込むと、フォントが崩れたり、不自然なマージンがあったりして、“いかにも生成AIで作りました感”が出てしまいがちだ。加えて、レイアウトが日本人に馴染みのあるものではなく、海外仕様になってしまうことも違和感につながりやすい。

Hirameki 7のAIサイトは、大雑把なプロンプトで指示しても、日本人が見て心地よいと感じるデザインになるよう、何度もチューニングを重ねました。特にタイポグラフィに関しては、Google Fontsを厳選した上で日本語のWebサイトに適さないフォントをNever Useに指定したり、日本語として美しく見える文字のサイズや文字間隔のレンジをあらかじめシステム側で定義したりしています（佐孝氏）

クライアントとのコミュニケーションが劇的に変わった

こうした工夫が凝らされたHirameki 7を導入して、「クライアントとのコミュニケーションが劇的に変わった」と古閑氏は喜ぶ。

従来であれば、クライアントにヒアリングをした内容をいったん自社に持ち帰っていたものが、会話をしながら、Hirameki 7でラフのたたきを作成して見せられるようになった。その場で具体的な“絵”を見て、完成イメージを共有しながら会話することで、初期段階から「もっとここはこうしてほしい」といった具体的な指示をもらいやすくなったという。

コミュニケーションが劇的に変化したことで、以前は1〜2週間かかっていたラフの作成が、1〜2日で終わるようになりました。私自身もお客様の求めているものを理解しやすくなったので、手戻りもほとんどありません。
私ひとりでもラフを作成できるため、デザイナーの工数を使う必要もなく、人的リソースも効率化できました。まだ導入して数か月ですが、受注の確度も上がってきています（古閑氏）

ちなみに、カンナートでは、Hirameki 7はあくまで顧客とのコミュニケーション用に活用しており、本番用のデザインは別のツールを使って作り込んでいるが、Hirameki 7が生成したデザインそのままで問題がない場合は、別途サーバーやドメインの契約をする必要なく、Hirameki 7ドメイン上にサイトを公開することもできる。CMS（コンテンツ管理）機能も備えているため、そのまま運用でき、タグ設定などSEOにも配慮されている。

Web制作会社のディレクターや営業のみならず、フリーランスはもちろん、Webサイトを内製したい中小企業などでも活用できるだろう。

参考サイトからデザインを自動生成する新機能

さらに、2026年7月に追加された「マルチモーダル」機能にも注目したい。

これまでHirameki 7でWebサイトを生成する際は、「作りたいページのイメージをプロンプトで指示する」か、「300種類ほど用意されているテンプレートから選択する」かの2種類の方法があった。

新しく追加されたマルチモーダル機能は、参考にしたいWebページのURLを入力するだけで、著作権や肖像権に配慮しつつ、そのサイトのトーン＆マナーやUI/UXの特徴を崩さずに、類似したWebサイトを生成できるというものだ。また、自社の会社概要やサービス紹介のパンフレットや提案書のPDF、PowerPointなどのファイルをアップロードしてサイトに反映させることもできる。

すでにある素材を起点にサイト制作を進めることができるため、クライアントとの打ち合わせがさらにスムーズに進められるし、既存のWebサイトからのリニューアルも容易になる。

その他にも、プロンプトのみでバナーやサムネイル画像を生成できる「AI画像生成」や、HTMLメールを生成する「AIメール」、トライベックの強みであるユーザビリティ診断やWebサイト評価のロジックをAIに組み込むことで、中小企業でも簡単に取り組める「自動ユーザビリティ診断＆改善提案機能」の搭載や、大規模サイトの運営にも耐えうるCMS機能の拡張などのアップデートを多数計画しているという。

AIと共存する制作プロセスの確立こそがWeb制作の生存戦略

古閑氏は、「生成AIによるWeb制作ツールが色々出てきているが、Hirameki 7は、AIサイトだけでなく、名刺管理やメルマガ配信、営業リスト検索や案件管理など、いろんな機能が1つのプラットフォームに使いやすく入っています。まずは触ってみたら、その使いやすさに感動すると思います。試しにでもいいから使ってみてほしい」と述べる。

佐孝氏は、「AIによるWeb制作ツールが注目されているが、これまでの経験が無になるわけではありません。トライベックが長年培ってきたデジタルマーケティングの知見にAIの力をプラスして、“より良いものを・より早く”お客様に届けるお手伝いをしていきたい」と胸を張る。

AIによって制作コストを圧縮するトレンドはあっても、要件定義や調整といった“人が介在すべき上流工程の重要性”は、これからも変わらない。制作の効率化のためにAIを活用しながら、AIと共存する制作プロセスを確立していくこと、それこそがこれからのWeb制作の生存戦略と言えそうだ。