先日、頼まれて知人のサイトを作った。載せられるコンテンツはほとんどないものの、会社っぽい体裁にはしたいとのことだ。そんなわけで、要素はほとんどないなりに、多少なりとも見栄えがするようにデザインしてみた。要するに、このサイトみたいな極端な作りにはしなかったってこと。
このサイトは、どんなビューポートのサイズで見ようがほとんどスタイルが変わらない。レイアウトも文字サイズもそのまま。ウェブページって別にそれでいいんだけど、困ることがあるとすれば、見栄えがしない。やはり、大きく表示したときにはそれ相応のスタイルが適用されていないと、手抜きに見える。あとまあ、小さいよりはデカい方が見やすいですね。
そういう意味において合理的な手法のひとつとして、fluid typographyがある。これをTailwind CSSでも扱いやすいように僕は、arbitrary valuesを引数として扱うことでon the flyでCSSを生成できるプラグインを作り、その場かぎりの値——つまりデザイントークンと言われるような秩序立てて整理された値ではないもの——をいくつもソースコードに埋め込みながら、ガシガシと見栄えを整えていった。
急ぎの話だったので最初は手早く完成させたけど、一度公開してしまってからは、しばらくチマチマと余白や文字サイズを細かく調整したりして遊んでいた。そのなかで、揃ってないところを揃えようと思っていろいろ試してみていると、ふと、昔使ったUtopiaのことを思い出した。あの時はあまりうまくいかなかったけど、実際のところ何がダメだったんだろう。いちおう振り返りは書いてみたものの、あまり的を射た分析ができなかった気がする。当時は自分とは別にデザイナーがいたけれど、今は自分自身で作っているのだから、今度こそあの時掴めなかった何かに到達できるかもしれない。
そうしてUtopiaを使い始めた。タイプスケールのパラメータをいじりながらソースコードにも適用し、またパラメータをいじるということを繰り返してみると、この辺がよさそうだなと落ち着くポイントが見つかった。ただ、ページを少しスクロールして、そのスケールを別のところにも適用した状態を見てみると、どうにもコレジャナイ感が出る。というのも、さっき見つけたポイントというのは、その時見ていた文字のサイズから逆算してそれに近い計算結果になるようにパラメータを調整しただけのものだったからだ。そこで続けて、ほかの部分がきれいになるように同じくパラメータの再調整をしてみると、次はまた別の部分がイマイチになってしまった。これでは埒が開かない。
イマイチに見えるのは、文字とレイアウトの関係性がいい感じになってないからだろう。しかしこれは、一度完成したものの文字サイズだけを後から変えたからだという、制作の順番の問題なのか？ もしタイプスケールの方を先に決めてから作り始めればうまくハマったのか？ しかし本当に順番の問題なのであれば、今からレイアウトを作り直せばいいだけの話だ。でも、それはできなかった。思うにこれは多分、意識の問題だ。
「先に外枠があってから、そのなかに文字がはめ込まれる」のか、それとも「先に文字があってから、それが主体となって周囲を形作る」のかという、主従関係の問題だ。僕が「見栄えがするように」と考えた結果立ち上がった意識が、文字を従属させたのである。外枠からの要求を満たすために文字があるのだとすれば、タイプスケールという文字主体のルール設定は成り立たない。
一方、文字が主体であるという意識さえ確立されていれば、極端なことを言えば、ひとつひとつのスケールのサイズなんてなんであっても成り立つはずだ。各スケールに明確な役割（セマンティクス）を与えられれば、それに駆動されるようにしてデザインができる。この場合、タイプスケールの数は最小限に収まるだろう。
逆に、文字が従属関係にありながらもタイプスケール的な発想が成り立つとすれば、アウトプットされるもののブレを間引いて丸めるための仕組みとしての機能になるだろう。ひとつひとつのステップの間隔を狭めたスケールを作って、出力値を刻むための目盛りとしてそれを位置付けることで、誤差が生じる確率を軽減するための機構となる。
これらはそれぞれ逆方向からのアプローチと言える。インプット側に働きかけるか、アウトプット側に働きかけるかという違いである。
タイプスケールと言うとき、そのどちらの働きを期待するかによって、意図するものや内容物は変わってくる。もし明確な問題意識があれば、そのとき必要なのはどちらか、自ずと判断できるだろう。
本質的には、Utopia自体の問題ではなかったように思う。しかし、モジュラースケールという、ステップ間隔の広いタイプスケールを生成する仕組みがあることと、始点と終点という決まった2値の掛け合わせにデザインを委ねることのマインド的な難しさによって、問題を顕在化させる結果に繋がったようだ。
こうして言葉にしてしまえば凡庸な話に思える。ただおそらく、これはけっこうクリティカルである気もするのである。
「内から外へ」の発想は、以前のタケルさんのブログから着想を得た。