読者です 読者をやめる 読者になる 読者になる

よりぶろ

アプリのUIとかについて書いてく予定

三本線

最近、iPhoneアプリで三本線をよく見るようになりました。

三本線ていうのは

f:id:ryo_pan:20120929235135p:plain

↑のピンクで囲んだとこのアイコンね。タップすると画面が左にずれてメニューが出てくる。

意味合いとしては「リスト」なんだけど、最近はFacebookアプリの影響もあってか「スライドメニュー」という意味合いが強く付加されてる気がする。

社内でも時々「このアプリ、三本線なのにスライドメニューじゃねえ!」みたいな話が出てくる。

個人的には、スライドメニューだってリストなんだからスライドしなくても驚かないなあと思いつつ、アプリのTOP画面にTabBarがなくてNavigationBarの左上にこのアイコンがあったら「おっ、スライドメニューか」と反応してしまったり。

Google DriveみたいにBackボタンに使われてるのとか、SumallyみたいにTabBarがあるのは違うと理解できる)

f:id:ryo_pan:20120930004710p:plain

f:id:ryo_pan:20120930005036p:plain

 

で、こうなってくると「他のアプリだとどんな挙動があるんだろう?」「Appleの純正アプリは?」みたいな疑問が湧いてきたので、簡単にざらっと見てみた。

 

以下結論から言うと

Apple製のアプリはスライドメニューに使っていない(ひょっとしたらどこかにあるかも…

サードパーティ製のアプリはほぼスライドメニューとして使っている

でした。

まずApple製ですが、一番それっぽいリマインダーの動きは、

f:id:ryo_pan:20120930010351p:plain

ModalView(ウィンドウが下からにょーんて出てくるやつ)でした。

個人的には、リマインダーは機能が少ないので混乱はないかな、と思います。

独自UIなので対象外ではあるのですが、ボイスメモも同様で、単純に記録したデータがリストで表示されます。

f:id:ryo_pan:20120930010903p:plain

 

ちょっと謎なのがiTunesで、

f:id:ryo_pan:20120930010934p:plain

TabBarがあるからまあメニューではないだろうなというのは理解できるのですが、右上にあるボタン、タップすると何が出てくると思いますか?

 

f:id:ryo_pan:20120930011429p:plain

な ぜ か 履 歴 が 出 て く る

 

いやまあ確かに「リスト」だけど…履歴って、もっと違う表現があったんじゃないかなぁ。今後別の内容も表示するのだろうか?

 

蛇足ですが、

f:id:ryo_pan:20120930011555p:plain

Game CenterではTabBarの「リクエスト」アイコンに三本線を使っています。

おそらくリクエストを送るか貰うとここにリスト形式で表示されるものと思われます。

 

以上から、Appleは三本線を「リスト形式のアイテムを表示するために使っている(スライドメニューとか知ったことじゃねえ!)」ことがわかりました。

まあある意味本来の使い方だよね。(でもiTunesのはどうにかしたほうがいいと思う…)

 

 

で、サードパーティ製のほうはと言うと、これはもう単純に名前と画面を並べるだけになってしまうので割愛。Facebookの影響強しというところでしょうか。

ひとつだけ面白い事例を紹介すると、Falavaというアプリなのですが、

f:id:ryo_pan:20120930012458p:plain

このアプリはスライドメニューを出すアイコンに三点リーダを使っています。

標準のTabBarにアイテムを6個以上加えると「more」として処理されるのですが、それを意識したんじゃないかなーと思います。

 

さてお仕事的な話をすると、果たしてApple的な方針で使ったほうがいいのか、Facebook的な方針で使ったほうがいいのかちょっと困りどころです。

個人的には、スライドメニューは広く浸透しているという意味で盛り込みやすい機能だと思います。Apple的な使い方は若干混乱を招くかな?サムネイルとの切り替え時に使うくらいですかね。

もちろん、スライドメニューが最適解というわけではないです。アプリの目的によってデザインは異なるし、スライドメニューが持っている意図を別のインタラクションで表現しているアプリもあります。

あとは若干食傷気味に感じられ始めてもいるので、何か別の方法を探っていきたいですね。