タブビュー型UIとは

sp_capture_01
PinterestやFacebook,Twitterアプリでよく見られるタブビュー型UI（ユーザーインターフェース）。
アプリでは多く見られるデザインですが、スマートフォンサイトではあまりこういったアイコンを使用したタブビュー型UIは、現時点では多くありません。
言ってみればPCのwebサイトのグローバルナビゲーションの役割になるものです。
アプリではAppleやAndroidのルール上、画面下に配置されてますが、webではそのルールはないので画面上にアイコンでなくても文字を配置してナビゲーションの役割を果たすことができます。

スマートフォンを使用するシーンとして”ながら読みが多い”

スマートフォンは家でくつろぎながら利用する事もありますが、移動中や、ご飯を食べた後など、ちょっとした隙間時間に利用する事が多いデバイスです。
情報設計もそれらを考慮して設計されていなければなりません。

必要な情報に簡単にアクセスできる様に

content_matrix_01
何度もタップしないと目的の情報までたどり着かない情報設計であった場合、移動中や隙間時間に利用する人たちは途中で諦めてページを離脱する事が予測されます。
移動中や隙間時間にスマートフォンを利用しているときは周りの環境も見ながら操作するので、集中して操作できないことが多いからです。その状況で何度も何度もタップを強いるのでは当然離脱されることが多くなります。
ですので、情報構造として階層は浅い作りにしていないといけません。

何度も頻繁に使用する様な要素はタブビューの要素へ

sp_moc
何度も頻繁に使用する機能やページ導線が一度タップしないと出てこない状態を考えるとわかりやすいと思いますが、この状態にあるとユーザーにストレスを与えてしまいUX（ユーザーエクスペリエンス）も損ねてしまいます。
例えばハンバーガーメニューの中に頻繁に使用やページ導線があったらどうでしょう？
毎度メニューボタンをタップしないといけないというのは、かなりストレスになるのではないでしょうか。
タブビュー型UIを採用するとことでこの課題が解決できる場合があります。
できる場合があるというのは、頻繁に使用する機能やページ導線が多すぎてもタブビュー型UIは向かないからです。

タブビュー型UIに配置する要素の基準

  • よく利用される機能
  • イチオシの情報への導線
  • サイト全体のページへ遷移できるページへの導線
  • ユーザーの行動

上記の様な優先度を付ける項目を用意して考えると配置する要素の意思決定が行いやすくなると思います。

まとめ

情報量が少ないスマートフォンサイトであったとしても見てもらいたい情報が必ずあるはずです。
見た目がシンプルだからハンバーガーメニューの中にしまい込むのでなく、しっかりと情報設計を考えて最適なUIを選ぶ事が大事です。