直感的で指の可動域を考えたホイールUI
スマートフォンでのUIに活用されるホイールUI。歴史を辿るとApple社のipod（Scroll Wheel〜第5世代）もホイール型だっけと思い返したり。その頃は、ITなら聞いたことあるけど、UIて言葉が一般的ではなかった時代。ただ、Appleってかっこいいから、日本のメーカーにないボタンの置き方するよなって、そんな説明書いらずのipodを使ってる自分に酔っていたよね。本当に、何も考えずに。今から、20年も前にApple社は、そんな可動域から設計を考えていたんですね。
フラットデザインが主流になった今も、半円になったり多少変形しつつも健在ですね。むしろ、ユニークと捉えられるかも。そこには、理由があったんです。何より片手で操作がしやすいということ。なので、reachする範囲に、主要なボタンを集約してホイールをタップするとスラスラとメニューもスライドする手法。デザインの遊びに見えて、ちゃんと理由があるんですね。
case01_スマートフォン/タブレットのデバイスで楽しむ塗り絵アプリのUI
選びたい色や筆先の大きさをホイールUIパレットから選択できて、メインの画像を隠すことなく塗り絵を楽しめます。
case02_引越しの際に必要な移動手配を簡単に行えるアプリのUI
画面遷移なく操作できる上、ホイールの境界のアイコンで手配のフェーズを常に把握できるように設計されています。そしてフェーズアイコンと対応した色玉に下層の選択要素を配置してあり一つの画面で引越しの手配プロセス全てが進行できるようになっています。
case03_音楽再生アプリのUI
プレイリストをレコードのように円盤の形で表示され、素早く曲を選択できるように設計されています。また、ボタンの押しやすさは「フィッツの法則」を適用しているそうです。
※フィッツの法則をUIデザインに活用する https://uxmilk.jp/80092
【参考にした本】UIデザインの教科書［新版］ マルチデバイス時代のインターフェース設計/［新版］UI GRAPHICS 成功事例と思想から学ぶ、これからのインターフェイスデザインとUX
この記事が気に入ったらサポートをしてみませんか？