見出し画像

ドアノブのついた引き戸問題

先日、こんな記事を読んだ。

このやりとり、よくあるんだよなぁ。なぜなんだろうか。

なぜこのやりとりがよく起きるのか、どうやったら減らせるのか、私なりに考えてみた。


「動き」があるときに気づかない

「このボタンって、どう動くんですか?」

そもそもエンジニアは「いつ」、上の質問をデザイナーにしているのか。


私の感覚だと、エンジニアがボタンを画面に置いて、いざボタンを押そうとした時だ。

「動き」を作ろうとした時に、「あれ?」となることが多い。

デザインはレビューもされているのに、レビューのタイミングでは気づかれていないのだ。


レビューでは何が見られている?

例えば、家を作っている時に、ドアのデザインがあがってきたシーンを想像してみてほしい。

チェックされるのは、そのドアが適切な配置にあるか、色味や装飾が雰囲気に合っているか、だろう。

「ドアノブの位置を標準的な高さにしましょう。」

「もっと色味の明るい木材にしてください。」

このようにレビューは、止まっている状態のチェックがまず行われる。


ただ、ドアは動かすものだ。


動きが表現されていないとき、デザインを見た人は、漫画を読むように無意識にコマとコマの間の動きをふわっとイメージして補完する。


先ほどのドアのデザインをもとに、いざ作る段階になり、実際にドアを置いて気づく。

「あれ、思っていた動きだとまずいな・・」

プロトタイプがないとき、エンジニアはプロダクトを動かす1人目のユーザーになる。


誰のためのデザインなのか

そういったときに、どのようにUIの意思決定をしたか、説明して納得してもらう必要があります。

アプリの話に戻ると、アプリにとって望ましい状態はユーザーが説明なしで使えることだと私は思う。


「このボタンって、どう動くんですか?」

作り手の中でこんな疑問が出た時、ユーザーも疑問に思うはずなので見直しが必要だ。


これはGoogleドライブの並び替え機能だが、「名前 ↑」は1つのタッチ領域だ。

「文字 + 上下矢印」はセットで1つの並び替え機能として使われていることが多い。


冒頭の記事のように「文字」「上下矢印」を分けて、2つの機能にするのはユーザーが期待する動きとズレそうだ。


仮説だが"1人目のユーザー"はそういったズレも感じて、「どう動くんですか?」と聞いたのかもしれないなあと思った。


全く同じデザインの2枚の連続したドアがあり、手前側がスライド式の自動ドア、奥側が観音開きの手動ドアになっている。これは本当に危ない。

同じ見た目のものには、同じ動きを期待してしまうものだ。


"意識的に"頭の中でアプリを動かす

ユーザーが期待する動きと、実際のアプリの動きが違うことを避けるためには動かしてみるしかない。

プロトタイプがあればいいけれど、作るのにはコストがかかる。実際、コストを加味して作らない選択をとることもある。


プロトタイプがないなら、目の前のデザインを頭の中で動かしてみるべきだ。縦にスクロールしたり、横にスワイプしたり、画面を移動したり、文字を入力して保存してみたり。


「あっちの画面ではタップできたのに、こっちではタップできなかった。」

「入力を完了したけど、保存が完了したことがわからなかった。」

「横スワイプして、1つ前の画像を見ようとしたら、1つ前の画面に戻ってしまった。」


そんなことに気づくかもしれない。


無意識にふわっと動きをイメージすると、例えば引き戸にドアノブがついていても、「まあドアだしノブはあるよね」くらいに流してしまう。意識的に1つ1つのモノを動かした方が良い。

見た目は問題ないけど使うときに困る、または使う時に気づくというのは「ドアノブのついた引き戸」と同じ状態だ。触った人は疑いもせず、ドアを押したり引いたりするだろう。


作り手として、ユーザーの「分からない」をなくして、プロダクトの提供する楽しさに夢中になれるようにしたい。


(引用させていただいた記事については、共感しており特に批判するつもりはありません)

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

励みになります!ありがとうございます!
27

hmatsue

モノづくりが好きなエンジニア。何を誰に届けるかを考えて届けたい。

#デザイン 記事まとめ

デザイン系の記事を収集してまとめるマガジン。ハッシュタグ #デザイン のついた記事などをチェックしています。広告プロモーションがメインのものは、基本的にはNGの方向で運用します。
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。