見出し画像

斬新なUIデザインをしない

UIデザイン時に基本的なことが、意外とできていなかったので備忘録…。

落とし穴

アプリやWEBの開発時に、画面表示に手を加えるとき、正しくUI(ユーザーインターフェース)をデザインする必要がある。
そこでよくある落とし穴として、なにか革新的で斬新なモノを生み出そうとして間違ったUIをデザインをしてしまうことがある。
その考えが上手くハマることもあるが、案外落とし穴だったりする。
今まで他のデバイスやアプリでなれていた操作感で利用しようとすると、今までの操作感が通じずに思い通りの挙動にならないことがある。

具体例

スマホアプリに、「カメラ撮影機能」を追加開発をしたい場合を例にとる。
画面のどこかにカメラ撮影へ遷移するカメラボタンを表示させたい。
この場合、基本的にはカメラボタンは画面下部に用意するとよい。

なぜか…
iPhoneの場合、主にロック画面右下のカメラアイコンを強く押し込む(XRでは長押し)だけでカメラ起動。また、全モデル共通の方法として、ロック画面を右から左にスワイプすることでもカメラを起動できる。
Androidの場合、機種によって操作方法は異なるが、ソニーのXperiaシリーズの場合、シャッターボタンを搭載しており、スリープ中でもシャッターボタンを長押しすれば、カメラが即起動する(シャッターを切る設定も可能)。また、電源ボタンの2回押しでカメラを起動できる機種も多い。それ以外の機種では、ロック画面のカメラアイコンから起動できる。操作方法は、カメラアイコンのタップ、もしくはスワイプで起動できるケースがほとんど。

iPhoneもAndroidもスマホ起動時に親指の届く範囲にカメラアイコンが用意されている。さらに、ユーザーがカメラを起動させたいシーンはどんなシーンが多いか?
目的にもよるが…
・目の前の景色を撮影したい
・QRコードを読み取りたい
などが挙げられる。
いずれにしてもすぐに起動できることが望ましい。

ここまで考えるとやはり、ユーザーが慣れているであろう画面下部(親指が届く範囲)にカメラボタンを表示させることで使いやすさが生まれる。

まずやること

似た機能を持つ他のアプリや端末のキャップチャをとにかく収集する。
それらをFigmaでもEXCELでも良いので貼り付ける。
それぞれを比較して、検討。

結論

革新的で、斬新なモノを生み出そうとしないで、
まずは既存の流れがどうなっているかデータを収集すること。
それができてから、デザイン(設計)し、ユーザー目線で使いやすいモノを開発していくこと。



この記事が気に入ったらサポートをしてみませんか?