AIは今やウェブデザインが得意になった

AIで作られた何千ものウェブサイトを見て気づいたこと。

AIは今やウェブデザインが得意になった

Ben Shumaker · 2026年6月15日

ここ数年、AIで作られたウェブサイトのほとんどは汎用的で平凡なものでした。だからこそ、その多くが「スロップ(雑なもの)」と呼ばれてきました。しかしこの2、3か月で、誰も話題にしていない大きな変化に気づきました。AIはウェブデザインが劇的に上手くなったのです。

私はこれをほとんどの人より良く見える立場にいます。AIウェブサイトビルダーであるRepaintのCEOだからです。これまでに、人々がAIで作った何千ものウェブサイトを見てきましたが、最近は良いものが目に見えて良くなってきています。私が思わず振り向いたものをいくつか紹介します。

Homepage for a Singapore Kyokushin karate dojo with a dark hero, bold serif headline reading "Passion. Patience. Perseverance." and a photo of a karateka in stance
Homepage for a performance neuro training coach with a bright "Optimize your energy. Reset the system." headline, neon green highlights, and a photo of Dr. Paige Roberts
Homepage for a Belgian event crew company with a black and yellow layout, a "Sterke crew. Elk event." headline, and a photo of a crew setting up an arena stage

なかなか良いですよね?私ならこれらをスロップとは呼びません。これらはほとんどのウェブデザイナーが作るものよりも優れていると、私はかなり確信しています。

私が最も感心したのはその美的感覚です。半年前なら、AIモデルがこれほどユニークに見えるウェブサイトを作ることは決してありませんでした。AIには単純に十分なセンスがなかったのです。以前は、このようなサイトを得るには、精密な指示によってセンスをすべて自分で与える必要がありました。

しかし今では、AIはずっと先まで進めるようになりました。これらのサイトはどれも数日の反復を要しましたが、最初の数バージョンで最終的な美的感覚の80%に達していました。そしてこれらは、プロのエージェンシーではなく、ビジネスオーナーがただAIと話して作ったものです。

では何が変わったのか?

その秘訣がRepaintだったと言えればいいのですが、それは主にモデルのおかげでした。私たちはAnthropic、OpenAI、Googleのモデルを使った、かなり標準的なAIエージェントを使っています。既存のウェブサイトを再構築するための特別なツールは作りましたが、このデザイン品質の飛躍を説明できるような画期的なものではありません。最新のモデルを使うツールなら、おそらく同様の改善を経験しているはずです。

現在、ウェブサイトデザインのための私たちのメインモデルはOpus 4.8です。Anthropicは立て続けにいくつかのアップデートをリリースしました。

  • Opus 4.6 - 2026年2月5日
  • Opus 4.7 - 2026年4月16日
  • Opus 4.8 - 2026年5月28日

私がこの変化に気づき始めたのは5月初旬ですが、Opus 4.6を使っていた頃にはすでに兆候があったのかもしれません。

私たちのテストでは、OpenAIとGoogleのモデルはウェブデザインにおいて同じ程度には改善していませんでした。GPT-5.5は賢いですが、作るウェブサイトは目に見えて劣ります。もしこれを読んでいるOpenAIの社員がいたら、次のモデルはウェブサイトをもっと上手く作れるようにしてください。

違い

最大の違いは、新しいモデルがデザインの方向性に従うのがずっと上手くなったことです。何を意味するかを示すために、同じプロンプトから2つのエージェントに同じランディングページを作らせました。1つ目は古いモデルのOpus 4.5を使いました。2つ目は新しいモデルのOpus 4.8を使いました。どちらも画像生成ツールにアクセスできました。プロンプトはこちらです。

建築設計事務所のウェブサイトを作ってください。バウハウスのデザインに着想を得た、ミニマルな美学にしてください。基調は主にニュートラルな色で、そこにいくつか大胆な色を加えてください。広い面積を埋める大きな画像を使ってください。

旧モデル - Opus 4.5

Hero section made by Opus 4.5
Featured work section made by Opus 4.5

このサイトは一見洗練されて見えますが、そのほとんどは画像によるものです。デザイン自体は、大きな写真を配置しただけのシンプルなレイアウトです。指定した大胆な色は無視され、認識できるバウハウス的な美学は決して生まれませんでした。それが古いモデルの限界でした。きれいなものは作れても、デザインの方向性を本当に翻訳することはできなかったのです。

新モデル - Opus 4.8

Hero section made by Opus 4.8
Featured work section by Opus 4.8

このサイトが客観的に優れているかはわかりませんが、私の指示にはるかに忠実に従っていました。Opus 4.8は、サイト全体で大胆な色とバウハウスに着想を得たデザインを使う明確な方法を見つけ出しました。その結果は本当に個性的に感じられ、明らかにプロンプトに基づいています。

新しいモデルは、はるかに幅広いスタイルにわたって指示に従えます。「web design styles」とグーグル検索すれば、試せる方向性が無数に見つかります。プロンプトでビジュアルの方向性を変えれば、それに合わせてウェブサイト全体が変わります。

これらはすべてワンショット生成です。

ブルータリズム

建築設計事務所のウェブサイトを作ってください。ブルータリズムに着想を得た、無骨で重厚な雰囲気にしてください。色味は主にコンクリートのようなトーン、黒、白を使い、そこに1つか2つの鋭いアクセントカラーを加えてください。レイアウトは少し硬質で過剰に大きく感じられてもよく、広い面積を占める大きな画像を使ってください。
A brutalist architecture firm site

遊び心のある色使い

建築設計事務所のウェブサイトを作ってください。遊び心のあるポストモダンデザインに着想を得た、明るくエネルギッシュな雰囲気にしてください。大胆な配色、シンプルな幾何学的な形、そして洗練された要素と少し風変わりな要素の組み合わせを使ってください。それでもレイアウトは洗練された印象を保ち、広い面積を占める大きな画像を使ってください。
A playful postmodern architecture firm site

レトロフューチャリズム

建築設計事務所のウェブサイトを作ってください。レトロフューチャリズムに着想を得た、大胆で少し映画的な雰囲気にしてください。色味は暗めのニュートラルカラー、メタリックなトーン、そしていくつかの鮮やかなエレクトリックカラーを使ってください。レイアウトはより実験的に感じられてもよく、広い面積を占める大きな画像を使ってください。
A retro futurist architecture firm site

1年前なら、何を頼んでも、AIはこのようなものを作っていました。

A generic AI-generated website

AIでより良いウェブサイトを作る方法

汎用的な指示を与えれば、AIは今でも汎用的なウェブサイトを作ります。今違うのは、AIが強いデザインの方向性に実際に従えるようになったことです。

結果の品質は、与える方向性によってはるかに大きく左右されます。具体的なビジュアルスタイルを明確に説明し、最新のモデルの一つと組み合わせれば、あなたがデザイナーでなくても、本当に個性的なものを生み出せます。

半年前には、それは当てはまりませんでした。