紫から青へ変化する背景。角の丸い枠が3つ横並び。見出しの先頭に絵文字。
AIに見た目を作らせたとき、最初に出てくる画面はだいたいこの形でした。企業のサイトを3社ぶん作り直したときも、自分のサイトを作ったときも、同じです。
業種も規模も目的も違うのに、骨格が変わりませんでした。実際に渡した指示と、その結果を書きます。
最初に出てくる形は決まっていた
1社目で最初の画面が出てきたとき、思ったより整っていると感じました。完成度が高かったからです。
ところが2社目でも似た画面が出てきました。3社目でも同じです。
私が見た範囲では、次の構成が続きました。
- 画面の上部に大きな見出しと短い一文
- その下に角の丸いカードが3つ横並び
- 背景に紫から青へ変化するグラデーション
- 見出しの先頭に絵文字
- 全体に余白が広く、1画面あたりの情報が少ない
このまま納品すると、依頼してくれた会社のサイトが、見覚えのある形の1つになります。
3社の記録は AIホームページ作成の実例 HTMLを書けない私が企業3社を制作 に書いています。
「かっこよくして」では変わらなかった
最初に試したのは、率直に伝えることでした。
「もっとかっこよくしてほしい」
出てきたのは、角の丸いカードが影付きのカードに変わり、色が紫系から緑系に変わったものでした。並び方も画面全体の組み立ても、ほとんど動いていません。
「今風に」では文字量が減った
次に試したのが、これです。
「今風にしてほしい」
今度は余白が大きく広がり、画面あたりの文字量が減りました。下へスクロールしても、書いてある情報が少ないページになっています。
言葉が何を指すか決まっていなかった
このあたりで気づいたのは、私の側の問題でした。
「かっこいい」も「今風」も、指しているものが人によって違います。何を指すか決まっていない言葉を渡していたので、こちらが想像していたものと違う結果が返ってきていたわけです。
1社目と2社目は、この状態のまま調整の往復を続けました。1回直すと少し良くなりますが、次の回で別の箇所が変わります。進んでいるのか戻っているのか分からない状態でした。
3社目で渡した一覧
やり方を変えました。良し悪しを後から言うのではなく、使ってほしくないものを先に、具体的に書いて渡す形です。
実際に渡したのが、次の一覧です。
- 紫や青の斜めのグラデーションを使わない
- 角の丸いカードを3つ横に並べない
- カードの中にカードを入れない
- 見出しの先頭に絵文字を付けない
- 見出しの上に角丸四角の飾りを置かない
- 画面いっぱいの大きな見出しと短い説明文だけの冒頭にしない
- 意味のない広い余白を作らない
- 色付きの背景の上に灰色の文字を置かない
- 文字を細くしすぎない
- テーマの初期の見た目のまま使わない
この形のほうが、はるかに早く進みました。1社目と2社目で長引いた往復が、3社目では明らかに減っています。
なぜ禁止のほうが伝わるのか
理由は単純だと思います。「かっこいい」は人によって違いますが、「角の丸いカードを3つ横に並べない」は誰が読んでも同じ意味だからです。
そして、避けたい形を挙げるほうが、理想の形を言葉にするより簡単です。
私は見た目の専門家ではありません。どういう画面が良いかを言葉で説明できません。ただ、出てきたものを見て「これは違う」とは言えます。その「違う」を先に一覧にしておけば、渡せます。
ただし、禁止だけでは何も残らなかった
ここからが、この記事でいちばん書いておきたいことです。
このサイトを作るとき、私は同じ一覧を最初から渡しました。3社の経験があったので、最初から具体的に指定すればうまくいくと思っていたのです。
結果は、何も無い画面でした。
条件はすべて守られています。紫のグラデーションもなく、角の丸いカードも並んでいません。それなのに、素っ気なくて寂しい画面が出てきました。
禁止は下限しか示していない
考えてみれば当然です。「これをするな」を10個並べても、「何をするか」は1つも言っていません。
10個の禁止を全部守った結果として残るのは、何もしていない画面です。
私はこれに気づくまで、記事を11本公開していました。サイトの見た目を見て、素っ気ないと感じるまで分かりませんでした。
後から足した「置くもの」の一覧
作り直すときに、今度は置くものを一覧にしました。
- 上の帯に、分類への行き先を置く
- 記事の一覧に強弱を付ける。すべて同じ見た目で並べない
- 右の欄に、本文と同じ内容を繰り返さない
- サイトの説明を、上部に置く
- 分類ごとに色を分ける
この5つを足したら、画面が変わりました。装飾を増やしたわけではありません。構造を足しただけです。
素っ気なさの原因は装飾不足ではなかった
作り直して分かったのは、足りなかったのは飾りではなく構造だったということです。
分類を4つ作ったのに、そこへ行く道が画面のどこにもありませんでした。記事が11本あるのに、全部同じ見た目で並んでいました。右の欄には、本文と同じ一覧がもう一度出ていました。
飾りを足しても、この状態は変わりません。
サイトを作った4日間の記録は、ブログを4日で15記事まで立ち上げた記録 全部AIにやらせた にまとめています。
いま渡している形
3社と自分のサイトを経て、いまは次の順で渡しています。
- 1 使ってほしくないものの一覧を渡す
- 2 置いてほしいものの一覧を渡す
- 3 出てきたものを見て、良いか悪いかを判断する
1だけでは足りず、2だけでも足りませんでした。
そして3は、いまも自分でやっています。出てきたものが良いかどうかは、条件をいくら並べても決まりません。素っ気ないと感じたのは私で、その判断が無ければ空の画面のまま進んでいました。
指示に何を書いているかは、AIへの指示書に必ず書いている5つの項目 実物の型を公開します にまとめています。
これから頼む人へ
まず、使ってほしくないものを書き出してみてください。
理想の形を言葉にするより簡単ですし、私の場合はこれで往復が減りました。上に挙げた10個は、そのまま使っていただいて構いません。
そのうえで、何を置くかも書いてください。禁止だけを渡すと、私と同じように何も無い画面が出てきます。
そして、出てきたものを見て判断する部分は、たぶん残ります。私は3社と1サイトをやって、ここだけは任せられていません。
