Feedback Loop

エンジニアの日記帳。ものづくり、プログラミング、読書などについて書いてます。

はみ出すデザイン

2024/11/23

個人開発のデザインは自分で考えることが多いので、自分なりにこうすれば分かりやすい、という思考ができてきた。しかし最近それはレイアウトや整理整頓的な部分であって、「魅せる」デザインはまた別の道があると感じている。

アプリやWebサービスの中身でいうと、機能やそれを使って実現できる体験に価値があり、ボタンやテキストはあくまでそれを補助する役割だ。各部品が目立つ必要はなく、必要なタイミングで「次このボタンを押してね」と自己主張するくらいで良い。一方でサービス紹介ページやキャンペーンページは人の注意を引く必要がある。それはダイナミックな配置であったり大きめのアニメーションであったりするが、これはまったく経験がなくて難しい。

発表スライドのレイアウトやWebサービスのデザインでは、一貫性や規則正しさが求められる。注意を引くためには逆で、はみ出し感が必要。四角形や丸で囲った枠から人の写真をはみ出させる、画面スクロールにあわせて要素をアニメーションつきで登場させる、背景の区切りを真っ直ぐではなく斜めや波線で示す。同じデザインという呼び名で括られるが求められる力は別で、ひとつ自分が学ぶべき分野があったな、という感覚。

そしてデザインをはみ出させて気を引く技術は、Webサービスを使いやすくするデザインにも活きてくる。使いやすさとはメリハリで、パッとその画面を見た時にどこに注目すれば良いか一瞬で分かることだ。優れたデザインは色や形、コントラストで視線を適切に誘導するが、このはみ出しもそれに一役買える。アニメーションで注意を引いたりグラデーションで主役を際立たせたりする。使いすぎるとゴチャゴチャしたサービスになってしまうが、ピンポイントで使えば効果的。特にさりげないアニメーションは手触りの良さや空間の心地よさに直結していると最近よく思うのでこの分野はちゃんと学びたい。

シンプルな中にもワンポイント魅せる要素がある。マニュアルを読むことなしに適当に使ってたら使えて、詳しくなると高度な機能も理解できて使いこなせていく。そういうデザインを目指したい。