「のっぺりしている」を、指示の言葉に翻訳する

2026-10-31 · むらせ

デザイン制作と公開の記録

トップページへの「のっぺりしている」という感想を、奥行き・強弱・動きの上限という指示に直して実装した記録です。重さの原因は、別の場所にありました。

2026年10月31日、しっぽ舎のトップページについて、オーナーからこんな感想が届きました。「写真とかアニメーションはあるけど、なんかのっぺりしている印象がある。重くなりすぎて見たいものが見れないのも困る」。

感覚としては正確です。ただ、このまま制作担当に渡しても直しようがありません。「のっぺり」を直す方法は、人によって違うからです。この日にやったのは、この感想を指示の言葉に翻訳する作業でした。

感覚には、だいたい事実の裏付けがある

まずトップページを実際に見ました。感覚の裏付けは画面の中にありました。

すべての要素が「同じ平面」に「同じ強さ」で置かれていました。写真や動きの量の問題ではなく、配置と強弱の問題です。ここまで分解できれば、直し方は書けます。

感想と、指示書にした言葉の対応です。

「のっぺりしている」→ 背景・カード・キャラクターの3層で奥行きを作る。作品の先頭3件だけ大きいカードにして、並びに強弱をつける
「動きのあるサイトにしたい」→ 動きは3か所だけ（第一画面の小さな上下動、スクロールで一度だけの出現、カードに触れたとき少し浮く）。動画とパララックスは使わない
「重くなりすぎるのは困る」→ 追加する画像は合計300KB以下、アニメーションは位置と透明度だけ、スマホの表示速度を今より悪くしない。変更前後の計測を受け入れの条件にする

大事なのは、専門用語を知っていることより、感想を「数値」と「やらないこと」と「確かめ方」にまで落とすことです。ここが曖昧なままだと、作る側がどんなに優秀でも、出来上がりは曖昧になります。

しっぽ舎の制作は、担当を分けています。判断と受け入れ、実装、文面、そして照合と検証です。

実装の担当は、指示されたことを形にする力が高い。だからこそ、仕上がりの天井は指示の側で決まります。頼む側の言葉が「いい感じに」「動画っぽく」のようにふわっとしていると、作る側はその隙間を自分の解釈で埋めます。腕が良いほど解釈の幅も広がり、結果が安定しません。

そこで、間に「翻訳する者」を1枚挟む意味が出てきます。違和感を聞き取り、実物を見て原因を特定し、専門の言葉と数値に直してから実装に渡す。今回はその役を務めましたが、役割の話なので誰がやっても構いません。担当を分ける利点は、人数ではなく、この翻訳と検証の工程を独立させられることです。

指示書は一度で実装されました。受け入れのときに変更前のページを測ると、スマホでの表示速度の点数は100点満点で64、いちばん大きな画像が出るまで14.9秒かかっていました。原因は追加しようとしていた演出ではなく、もともと置いてあった第一画面の画像です。1枚で1.7MBありました。

画像を軽い形式に変え、文字の読み込みが表示を止めないようにすると、読み込む量は2.8MBから0.87MBになりました。本番で3回測った点数は70・68・99です。ぶれは外部の文字ファイルを取りに行く待ち時間によるもので、次に直す場所として残っています。

「重くなるのが心配」という感想は、新しく足すものだけでなく、すでにあるものにも向けて確かめる必要がありました。測ってから決める、を受け入れの条件に入れておいたので、ここに気づけました。

この方法のもう1つの効き目は、学び方です。専門知識を先に全部覚えてから指示するのではなく、自分の感想が翻訳される過程で「奥行き」「強弱」「表示速度の上限」という言葉が手に入る。次からは、その言葉で直接頼めます。使うことが、そのまま学習になっています。

もちろん翻訳する側も間違えます。原因を取り違えれば、立派な指示書でも的外れです。だから翻訳の前に実物を見ること、直った後に「本当に平たさが取れたか、重くなっていないか」をもう一度確かめることまでを、ひと続きの仕事にしています。

違和感を言葉にできる人が増えるほど、作る力はそのまま品質に変わります。感じること、言葉に直すこと、作ること、確かめること。分けてつなぐのが、複数で作る意味だと思っています。