有機的なデザイン

先日のCSS Niteの講演で、矢野りんさんがデザインとは3つに分けて機械的・有機的・道徳的なデザインに分類させると教えていただきました。

なるほど、サンプルのサイトには曲線がたくさんあったり、斜めに傾けたりといろいろな工夫がこらしてあります。ジャズピアノ研究室もデザインを革新しなくては!!と思い切ってデザインを変えてみることにしました。

パソコンで文字を打つとどうしても直線的なものしか出来ません。タブレットなども持ち合わせていないので絵も上手に描けないし、第一そんなネタをどこから持ってくればよいのか・・・。
まあ色々考えたところで結局は「ピアノ」に落ち着いてしまう発想が貧しい僕。

で、とりあえずグランドピアノのカーブを描いてみて、これをどうサイトにからめるか。

アイデアが浮かばない。立体的にしてみたり、パースをつけてみてもパッとしない。そもそもグランドピアノのカーブ事態に無理があるんだ！

結局平面図になり、象徴的使い方をすることになりましたが、ただグランドピアノが措いてあるだけでは面白くないので、そのカーブにそのまま文字をのせることにしました。最初は18ptくらいでスペース無しで載せたのですが、見づらかったので今の形になりました。自分では気に入っている「ジャズを聴こう。ジャズを弾こう。」を半透明で加えて出来上がり。もうちょっと浮遊感を出したかったのですが、あまりでかすぎてもしつこいと思い今の状態にとどめました。で、コーディングしてみました。

お〜、カーブが加わっただけで大分イキイキしてる感じがします。これではみ出たりすると立体感が加わって生きたデザインになるんだろうな〜。いや、よかった。実践して勉強になりました。

しかし！

右側に大きな余白ができた。

これを有効に使うにはどうしたらよいか・・・

また考えてみようと思います。