NG記事ドロップメニュー_

わざわざ入力を面倒くさくしている、ドロップダウンリスト①〜非効率な生年月日入力フォーム〜

 スマートフォン環境を意識して、最近特に濫用気味に使われている、いわゆる「プルダウンメニュー」と言われている『ドロップダウンリスト』は、その利用方法も誤用が多く、返ってユーザーの利便性を阻害して、非効率で非直感的なアイテムとなっていることが多い。
 そこで、今回は特にその中でも間違った利用方法の代表的な例として「生年月日の入力フォーム」について紹介します。

スマートフォン向けサイトの普及で、
利用率が多いドロップダウンリスト

 多くの人が「プルダウンメニュー」と十把一絡げに呼称していますが、正確には「ドロップダウンリスト」と呼びます。
 プルダウンメニューは、文字通りメニューをクリックするとそのまま、引き下げる様に選択肢が下へ表示されるのに対して、ドロップダウンは、まず選択リストの最初の枠が選択ボックスの上にドロップした後、選択肢が下方向へ延びて表示されます。
 さて、このドロップダウンリストの一番大きな特長は、2つ以上の選択肢を格納でき、かつ表示自体を1行で済ませられることで、省スペース化を図れます。
 この最大の特長が、スマートフォンでの入力フォームなどで、スクロール量を減らせてページの長さを削減できることが重宝され、もはや濫用気味と言って良いぐらい多くのサイトで多数利用されています。
 たしかに、便利ではありますが、一方でデメリットもあります。
 選択項目が「一目ですべてを一覧できない」ために、特にスマートフォンのiOS環境では、スクロール操作を伴って閲覧する必要が生じます。
 大量に選択肢がある中から、目的の情報を探し出すという行為は、特に内容がわかっていて選ぶべき項目が容易に想像しやすいものなら特に、ユーザーにとってはストレスそのものと言って良いでしょう。

ドロップダウンリストでもっとも最悪な生年月日選択

 「年」「月」「日」と3つに分割したドロップダウンリストを使った入力フォームは日常的に目にします。ほとんどの人が違和感を感じないぐらいあまりにも日常的と言えます。
 しかし、その中でも特にユーザーが「ひたすら選択肢をスクロール」しなければいけないケースが西暦の選択です。
 ドロップダウンリストから選択肢を選ぶこと自体を良しとしても、自分が入力したい情報はスピーディに選択したいはずですが、『1900年』から始まる西暦選択は最悪と言わざるを得ません。
 理由は簡単で、大多数のユーザーがカンタンに選べる 年代がスタート位置になっていないからです。1900年といえば、2019年の今年でいうと119歳です!
 日本における平均寿命は約84歳で、日本でもっとも長生きした方の年齢は113歳で、しかも世界最高齢です。
 
まったくもって意味不明な年代から、選択肢が始まるドロップダウンリストは、ほとんどのユーザーにとって半世紀以上のスクロールを強いることになります。筆者は1964年生まれですが、それでも64年分スクロールする必要がありますから、読者のみなさんはさらに20年ばかし必要でしょう笑

 余談ですが、2018年の日本における人口ピラミッドを見てみると、100歳以上は他の年代と比較すれば「約0%」で、誤差の範囲です。
 もっとも人口比率の高い年代は、40歳代で全年代の約7%強になりますから、最低限この人たちの利便性を考慮することは直感的操作性としては必要です。

1900年からリストが始まる理由は、MicrosoftのExcelにあった!

 そもそもWEBサイトで収集する情報は、データベースとして最終的にCSV形式などの出力を経てMicrosoftのExcelで処理されるでしょう。
 Excelが処理できる西暦の仕様は1900年1月1日を起点にして、経過日数というシリアル値を割り振って、表計算の中の日数などをカウントしています。
 あくまでも推測ですが、これがWEB等で収集する生年月日の基準になっているのではないでしょうか。仮に仕様だから仕方ないとしても、このドロップダウンリストの仕様は、あまりにも情報管理目線で、ユーザー視点になっていません。

直近の年代から遡る仕様はまだマシだが、使いにくさは変わらない

 利便性の観点から言えば、そもそも生きている人がいない1900年から選択肢を作るよりは、直近の年代から遡って行く方が合理的と言えます。
 しかし、それでも大多数の成人は20年以上のスクロールは必須で、少子高齢化の現代社会にマッチしているとは言いがたいのが現実です。

コアターゲットが一番操作しやすい年代をフォーカスする

 前出の人口ピラミッドでもわかるように、いわゆる中年層の40歳代を中心にした比率がもっとも割合として高いということや、店舗やサービスによってターゲットとなるユーザー層は異なり、コアユーザー層のボリュームに対して利便性を考えることで、ユーザーエクスペリエンスが高まることを考えれば、そのボリュームゾーンにあたる年代を中心にすれば、それだけ多くの人がストレスを感じなくなると言えます。

 ユニクロを例にとると、1979年と1980年の間にデフォルト値が設定されていますが、前後5年ぐらいのスクロールが最適と仮定すると、35歳〜45歳がターゲットになり、この年齢の人は僅かなスクロールで生まれた年代を選ぶことができますから、大変便利だと言えます。
 事実、ユニクロのコアターゲットを推測する上で、ユニクロのアプリをダウンロードしたユーザーの所有割合からコアとなる年齢層を見てみると、もっとも多い層は30代で、次いで40代となります。

 こうしたことを踏まえると、ターゲットとなるユーザー層を考慮して、ドロップダウンリストのデフォルト値は、中心的な年代を基準に設定することがもっとも適切と結論づけてもよいのですが、これは一方で毎年調整をするなどの運用上の手間ひまが伴いますから、手放しでは喜べませんね。

直接キーボード入力した方が早く、ストレスが少ない生年月日入力

 そもそも、なぜドロップダウンリストやラジオボタン・チェックボックスなどの選択肢が生まれたかと言えば、ほぼ同じことを記入する場合でも、人によって記憶や書き方が異なるために入力にバラツキが生じるからです。
 たとえば、
 ・1999年(半角)
 ・1999年(全角)
 ・平成11年(半角)
 ・平成十一年(漢数字)
 
というように、これらはすべて同じ意味であるのに表記が統一できていないため、集計が煩雑になり、手間が膨大になることを避けるために、既定の情報から選んでもらう方法が普及しました。
 まだコンピュータやWEBが、普及しはじめたばかりのころならいざ知らず、JavaScriptなどの技術が発達した現代では、入力が全角・半角かは置換で統一することが可能であり、特にスマートフォン環境であれば入力文字種をキーボード表示で固定することも可能ですから、もはや入力に「ゆらぎ」など存在しないといっても良いでしょう。
 そう考えれば、わざわざ膨大なスクロールを強いてまで、ドロップダウンリストから目的の年号を選択させる必要などないのが正解と言えます。

ヤコブ・ニールセン博士が警告するドロップダウンリストの使い方

 ユーザビリティの研究・発表に関して著名なヤコブ・ニールセン博士が、自身のWEBサイトでドロップダウンリストに関するガイドラインを示しています。

 特にWEB表現に関係の深い項目だけリストアップすると下記になります。

●スクロールが必要なドロップダウンは、すべての選択肢を一覧できない
●打ち込んだほうが早い内容なら、ドロップダウンは使わない
●ユーザーが常に記憶している生年月日のような情報は、ドロップダウンは使わない
※邦訳:U-Site「ニールセン博士のAlertbox」
※原題:Dropdowns: Design Guidelines by Angie Li on June 11, 2017

 他社がやっている、世の中で多く使われているからと言って、それが常識だとは限らないということを念頭に置き、常にユーザーが軽快でストレスなく操作できるWEB体験とは何かを、より多くの制作者が考えながら制作することを、改めてここに推奨します。

スマートフォン上のUIデザインをもっと知りたい方におすすめ


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

note.user.nickname || note.user.urlname

東京以外で開催するUIデザインセミナー開催のための資金に、役立てたいと思います!

ありがとうございます!次の記事も期待していて下さい!
2

香西 睦|continue.jp

「だから、そのデザインはダメなんだ。 WebサイトのUI設計・情報デザイン 良い・悪いが比べてわかる」著者。電通アイソバー株式会社の設立時より2018年まで、大手企業Webサイト構築やリニューアルの中心メンバーとして多数参画。現在は、製薬系制作会社プリンシパルとして活動。

#他では絶対教えてくれないUIデザインのワザを学ぶ

UIデザインは、一朝一夕で勉強できるモノではありませんが、だからといって勉強するための「教材」が不足していることも事実。 結果的には、仕事の経験値に頼るところが大きいため、その経験が正しいことなのか間違っていたことなのかを判断する術がありません。 書籍「だから、そのデザイ...
1つ のマガジンに含まれています
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。