GPT-5.6 Sol、フロントエンドデザイン部門で首位に――AIにありがちな定番パターンを避ける美的センスを獲得
- Design Arenaのウェブデザイン部門(非agentic)ランキングで、OpenAIのGPT-5.6 Solが1位に。前世代のGPT-5.5より18位アップし、OpenAIのモデルとして初の首位獲得。
- 評価チームが生成した1000件のウェブページを画像ベクトルに変換してクラスタリングしたところ、デザインマップに明らかな空白があり、それは紫グラデーション・便当箱型レイアウト・巨大見出しといったAIにありがちな定番パターンの位置と一致していた。
- 同じく定番パターンを避けているGLM-5.2は、そもそもこれらのパターンを学習していないだけ。対してGPT-5.6 Solは、学習した上で意図的に描かないという選択をしている。
- 信頼できるテンプレートを出発点にしつつ、個々の要件に応じて大幅にカスタマイズする――画一性と完全な自由奔放さの中間に位置している。
- すべての弱点を回避できたわけではない。作品の26.5%に紙吹雪(confetti)が入っており、データチャート作成能力も弱い。
一目でわかる「AIウェブページ」、それをやらないことを学んだ
AIが作ったウェブページは、たいてい一目で見分けがつきます。紫から青へのグラデーション背景、画面いっぱいに敷き詰められた便当箱型のブロックカード、ファーストビューを占領する巨大な見出し。見慣れると、あの「一目でニセモノとわかる」プラスチックのような感触は、AIウェブページの烙印のようなものになっています。
Design Arenaのやり方は、異なるモデルに同じウェブページ生成タスクをやらせ、完成品を人間にブラインドで選ばせるというもの。多く選ばれたモデルほど上位にランクされます。GPT-5.6 Solが獲得したのは「ウェブデザイン(非agentic)」部門、つまり一発生成で、複数ターンの自動改善を伴わないタイプです。
一目で「AIが作った」とわかる定番パターン
先ほど触れた紫グラデーションや便当箱型レイアウトは、この手の定番パターンのほんの一部に過ぎません。業界ではこれらを総称して「アンチパターン」あるいは「デザインスメル(design smell、デザインの悪臭)」と呼びます。一目で正体がバレる紋切り型という意味です。今回の発見を理解するには、まずこの一群の「悪臭」を全部見ておく必要があります。
3ヶ月前、Design ArenaがGPT-5.5を分析した際にこの種のリストをまとめていました。主なものは以下の通りです。
| 悪臭パターン | どんな見た目か |
|---|---|
| 紫〜青グラデーション | 背景を一律に紫から青へのグラデーションで塗る、AI生成の代名詞的配色 |
| 便当箱型レイアウト(bento box) | ページを大小さまざまなブロックカードに区切り、弁当箱のように画面いっぱいに敷き詰める |
| 巨大な見出し文字 | メイン画像を置かず、いきなり巨大な1行の見出しでファーストビューを占領する |
| ずらし配置(offset) | 要素をわざと左右にずらし、「デザイン性が高い」ように見せているが実は紋切り型 |
| グリッド背景 | ページ全体に薄い方眼線を敷く |
これらは単体で見れば別に間違いではありません。問題はAIがあまりに多用しすぎて、読者が一目で見抜けるようになってしまったことです。Design Arenaの評価では、こうした悪臭パターンを含む作品は、たいてい人間に選ばれず負ける側になります。
1000件のウェブページを1枚の地図に描いたら、いくつか空白があった
良い/悪いという評価は主観に左右されます。評価チームは目に見える証拠を求め、あることを実行しました。GPT-5.6 Solが生成した1000件のウェブページすべてを、1枚の地図上の点に変換したのです。
これは2段階で行われました。第一段階、各ウェブページのスクリーンショットをCLIPというモデルに入力すると、それぞれの画像に対して長い数列が出力されます。この数列は、その画像に付けられた「遺伝子コード」のようなものだと考えてください。スタイルが似た2枚の画像は、コードも近くなります。第二段階、UMAPという手法を使い、この長いコードを2次元平面上の1点に圧縮します。このとき、元の空間での距離関係をできるだけ保持するため、スタイルが近い点同士は地図上でも近くに配置されます。
CLIPは各ウェブ作品に「スタイルの身分証明書」(長いコード列)を発行するようなもの。UMAPは、立体的な星雲全体を1枚の平面星図に押しつぶす作業です。星々の元の密集具合や、寄り集まり方、そして途中にある空白は、押しつぶした後もほぼそのまま残ります。
1000個の点が広がると、それがこのモデルの「デザイン空間」――つまりこのモデルが好んで、頻繁に生成するスタイル領域全体になります。広げてみると、評価チームはあってはならないものを発見しました。地図上に明らかな空白があり、点群の中に不自然に欠けている部分があったのです。
以下は評価チームが示した実際の投影図です。1枚目はGPT-5.6 Solで、びっしりと並ぶ点の中にいくつかの窪みが見えます。2枚目はGPT-5.5で、点群は隙間なく埋まっており、このような欠損はありません。
UMAPによる投影は、理論上、元の空間にあった窪みをそのまま保持します。つまり、あるモデルの地図には穴があり、別のモデルにはない――これが意味するのは、GPT-5.6 Solはその領域を本来描けるし、他の場所では実際に描いてもいるのに、あえてそこには何も置かないということです。
穴の中身を確かめるため、評価チームはGPT-5.6 SolとGPT-5.5の作品を同一の図に重ねました。GPT-5.6 Solの点をオレンジ色に染め、GPT-5.5の点の上に重ねます。オレンジの点がある場所はGPT-5.6 Solが行く領域、地色だけでオレンジの点がない場所は、GPT-5.6 Solが避け、前世代モデルは行っていた領域です。
2つのモデルはほとんどの領域で重なっているが、紫グラデーションのクラスターだけはオレンジの点が1つもない。便当箱型レイアウト、巨大な見出し、ずらし配置といった悪臭パターンも同様で、穴の中身はまさにこの一群のAIあるあるだったのです。
同じ悪臭パターンを避けるにも、2つのモデルは違う道を歩んでいた
AIあるあるを避けているモデルは、GPT-5.6 Solだけではありません。ただし、その避け方はほかのモデルとは違います。今回の分析でもっとも直感に反する点がここです。
順位が上のGLM-5.2と比較してみましょう。GLM-5.2も同様に巨大見出しのような悪臭パターンをほとんど出しませんが、そのやり方は、高評価のテンプレートを一群学習しており、そのテンプレート自体にこうした定番パターンが含まれていない、というものです。つまり、GLM-5.2のデザイン空間にはそもそも「紫グラデーション」という領域が存在せず、当然描くこともできません。地図上にも穴は残りません。なぜならその場所は最初から空白だからです。
GPT-5.6 Solはこれとは別物です。その地図に穴が残っているということは、まさにこのモデルがこうした定番パターンを学習しており、描く能力を持っているにもかかわらず、生成のたびに毎回それを避けていることを示しています。紫グラデーションがどんな見た目か知っていて、どこに配置すればいいかも知っていて、その上であえて置かないことを選んでいるのです。
デザイン空間はこうした悪臭パターンの位置をカバーしているが、あえてそこに生成しない。結果、地図上に穴が残る。つまり「知っていて、やらない」。
悪臭パターンを含まない一群のテンプレートで作画しており、そのスタイルはそもそも能力の範囲に入っていない。地図上にも対応する領域自体が存在しない。つまり「そもそも選択肢がない」。
2つの道は、成果物の上ではどちらも紋切り型を避けられているように見えるかもしれません。違いは能力の「形」にあります。一方は「この土地を囲って『立入禁止』の札を立てる」、もう一方は「そもそもこの土地を地図に描き込んでいない」。評価チームは、GPT-5.6 Solは学習した上で主体的に抑制しているようだと見ており、これはモデルとしては珍しいやり方だとしています。
信頼できるテンプレートを出発点に、要件ごとに大きく手を加える
これが評価チームの語る2つ目の発見で、「パーソナライズ」に関するものです。ウェブページを作るモデルには大きく2つの傾向があります。1つはテンプレートに大きく依存するタイプで、安定してはいるが毎回似たような仕上がりになる。もう1つはほぼテンプレートを使わないタイプで、要件ごとにゼロから育て上げるためバリエーションは豊富だが、必ずしも安定しない。GPT-5.6 Solはその中間に位置しています。
GPT-5.6 Solは、実績のある一群のデザイン構造から出発しつつ、個々の具体的な要件に応じて大幅に調整を加えます。同じテンプレートの下から、互いに関連しながらもそれぞれ異なるバリエーションが生まれます。評価チームはこれを、細菌が近縁の異なる菌株に進化していく様子にたとえています。共通の土台を持ちながら、それぞれ独自に育っていくイメージです。
両端の対照として:GLM-5.2は今回もかなり上位にランクされていますが、その原動力は高評価のテンプレートを一群学習していることです。安定しているのが利点ですが、バリエーションは基本的に要件そのものの違いから生まれるだけで、同じテンプレートが繰り返し現れます。Claude Fable 5はテンプレートの痕跡がほぼ見られないタイプで、デザイン空間はより分散しており、各作品が要件に応じて高度にカスタマイズされています。
GPT-5.6 Solはこの両端の間に位置しています。テンプレートで下限を保証しつつ、カスタマイズで差をつける。評価チームは、これによってどのユーザーも自分の要件に合った、かつプロの手による作品のように見えるページを得られるとしており、これが上位ランクインの大きな要因の1つだとしています。目立つ小さな弱点として、異なるページの画像を用意する際、同じ画像を複数の異なる場面で使い回すことがよくあります。
紙吹雪が撒き散らされ、チャート作成もまだ未熟
悪臭パターンを主体的に抑制するという点でも、GPT-5.6 Solがすべてを達成できているわけではありません。評価は2つの明らかな弱点を指摘しています。
1つ目は紙吹雪です。ページ上にconfetti(お祝い用のカラフルな紙吹雪アニメーション)を撒き散らすのが特に好きで、作品の26.5%以上に登場します。どれほど徹底しているかというと、既製の紙吹雪ライブラリを与えなくても、自分で1つ手書きして使うほどです。これ自体もAIあるあるの1つですが、こちらは避けられていません。
2つ目はデータチャートです。チャートやデータの可視化における表現力が比較的弱く、chart.js(一般的なウェブ用チャートライブラリ)を使ってもまともなチャートを描けません。
紫グラデーション、便当箱型レイアウト、巨大見出し、ずらし配置、グリッド背景――地図上にすべて穴が残っている。
紙吹雪が作品の26.5%に登場、しかも自分で紙吹雪ライブラリを手書きしてしまう。データチャートも不得手。
従来の首位モデルより2倍以上速く、価格は半分
順位や美的センスだけでなく、GPT-5.6 Solは速度と価格の面でも一歩リードしています。評価チームによれば、同時に2つの新たな最適境界線を打ち立てたとのこと。1つは「見た目の質対速度」、もう1つは「見た目の質対価格」です。
あらかじめ引かれた1本の境界線を想像してください。その線上に立っている限り、ページをより見栄え良くしたければ、より多くの時間かお金をかける必要があり、タダでは手に入りません。GPT-5.6 Solはこの境界線を一段階前に押し出しました。つまり、同じ見た目の質であれば、より速く、より安く実現できるということです。
より厳しくなり、より柔軟になった
評価チームは今回の観察を2つの言葉にまとめています。
1つ目、より厳しくなったこと。どの視覚的パターンがウェブページを「一目でAI製とわかる」ものにしてしまうかを学習した上で、それらを主体的に抑え込みつつ、いつでも使える一群の信頼できるデザイン構造は保持している、という具合です。2つ目、より柔軟になったこと。テンプレートとカスタマイズを組み合わせ、テンプレートで最低限の質を保証しつつ、各要件に大きく手を加える。これにより、誰もが自分にフィットした、かつプロの手による作品のように見えるページを得られるのです。
この2点を合わせたものが、Design Arenaが示した、GPT-5.6 Solが単発生成部門のランキングで首位を走れる主な理由です。避けられなかった紙吹雪や、うまく描けないチャートについても、同じく評価結果に並べて示されており、両方を合わせて初めて全体像が見えてきます。
GLM-5.2はこうしたデザインの悪臭パターンをそもそも学習していないため、生み出すこともない。一方GPT-5.6 Solは、学習してこれらの悪臭パターンの存在を知っていながら、それを描くことを拒否しているように見える。 Design Arena、GPT-5.6 Solに関する評価分析
OpenAIのGPT-5.6 Sol、ウェブデザインランキングで首位に――AIの「一目でバレる」定番パターンを学びながら、あえて描かない
第三者評価プラットフォームDesign Arenaが1000件のウェブページを1枚の地図に描き出したところ、欠けているのはまさに紫グラデーションなどAIあるあるが本来あるべき場所だった。図解つき1ページで理解する。
↓ 1ページで読み切り · 動く図が1つあります
Design Arenaは第三者のAIデザイン評価プラットフォームで、やり方はシンプルです。異なるモデルに同じウェブページ生成タスクをやらせ、完成品を並べて人間にブラインドで選ばせる。多く選ばれたモデルほど上位にランクされます。
AIが作ったウェブページは、たいてい一目で見分けがつきます。紫から青へのグラデーション背景、画面いっぱいにブロックカードを敷き詰めたレイアウト、ファーストビューを占領する巨大見出し。この「一目でバレる」感覚は、ほぼAIウェブページの烙印になっていました。ところがOpenAIの新モデルGPT-5.6 Solが、最近このランキングで1位を獲得。前世代より18位アップで、OpenAIのモデルとして初の首位です。評価チームはその勝因を突き止めるため、1000件の生成作品を解析しました。
解析の結果、評価チームが見つけた最大の違いはこうです。一目でバレるこうした定番パターンを学習していながら、あえてページに反映しない。
紫グラデーション、便当箱型レイアウトといった手法を学んだら、そのまま積み重ねて生成。仕上がりは一目でバレる
同じ手法を学んでいながら、毎回あえて避ける。仕上がりはAI製に見えない
とはいえ「パターンを避ける」という表現自体、まだ主観的です。良し悪しは人それぞれ。評価チームは目に見える証拠を出す必要がありました。
証拠はこう見つけました。GPT-5.6 Solが生成した1000件のウェブページすべてを、1枚の地図上の点に変換したのです。
2段階で行います。まずCLIPというモデルで、各ウェブページのスクリーンショットにコードを付与します(内容やスタイルが似た画像は、コードも近くなります)。次にUMAPという手法で、その長いコードを平面上の1点に押しつぶします。スタイルが近い点は近くに配置されます。1000個の点が広がったものが、このモデルが好んで生成するスタイル領域全体です。評価チームが見てみると、真ん中にいくつか不自然な欠けが見つかりました。
評価チームが2モデルの作品を重ねて見たところ、紫グラデーションのクラスターにはGPT-5.6 Solの点が1つもなく、便当箱型レイアウト、巨大見出しも同様でした。穴の中身は、まさにこの一群のAIあるあるだったのです。同じく避けているとはいえ、GLM-5.2は別の道を歩んでいます。そもそもこうした手法を学習しておらず、地図上のその領域はもとから空白。GPT-5.6 Solは学習していて描く能力もありながら、毎回あえて避けている。一方は「できない」、もう一方は「できるのに、やらない」です。
同じ地図からもう1つわかることがあります。点は画一的に一箇所に固まっているわけではありません。実績ある一群のテンプレートを出発点に、要件ごとに大きく手を加えており、「画一的」と「完全に自由奔放」の中間に位置しています。
美的センスだけでなく、GPT-5.6 Solは速度と価格の面でも一歩リードしています。
すべてを避けられているわけではありません。紙吹雪は作品の4分の1以上に登場し、既製の紙吹雪ライブラリを与えなくても自分で1つ手書きしてしまいます。データチャート作成も比較的弱く、chart.js(一般的なウェブ用チャートライブラリ)を使ってもまともなチャートを描けません。これらも評価に併せて示されています。