2016年08月25日

事例:Twitter-メニュー


初めての方はこちらを「はじめに

仕様とはルール」で仕様はルールとして考えるべきだという話をして、仕様が不統一になってしまう例としてmixiのメニューを例に挙げました。(事例:mixi-メニュー
しかしこれはmixiをやり玉に上げようという事では無くごく普通に見かけられる事なのです。という事で今回はTwitterのメニューの仕様を見てみたいと思います。普段使っている感覚からするとTwitterは比較的統一されている印象があります。

ホーム


Twitterはメニューが少ないのでPC版とスマホ版を比べてみます。以下はPC版のTwitterのホーム画面です。

メニューは左側にアイコンの形で「ホーム」「通知」「メッセージ」となって、右側に「検索」「ロゴ(サブメニュー)」「つぶやき」用アイコンです。

次はスマホ版のホーム画面です。

ラベルは無くなりましたが左から「ホーム」「通知」「メッセージ」「検索」「ロゴ」と同様に並んでいます。「つぶやき」は次の行ですが右まで行ってはみ出たような形に見えるので違和感はありません。前回の時にも少し触れましたがPCとスマホでは画面サイズが違うのでそこに起因する仕様の変化というのはある事です。

サブメニュー


次はロゴの部分のサブメニューを見てみます。PC版は以下の様にドロップダウンメニューが出てきます。

上から「プロフィールを表示」「リスト」「ヘルプ」「キーボードショートカット」「Twitter広告」「アナリティクス」「設定」「ログアウト」となっています。このうち真ん中の「キーボードショートカット」「Twitter広告」「アナリティクス」はPC専用の機能なので比較対象からは外して、実質「プロフィールを表示」「リスト」「ヘルプ」「設定」「ログアウト」の五つを比べます。

以下がスマホ版の画面です。

上から「プロフィール」「リスト」「おすすめユーザー」「設定」「ヘルプ」「ログアウト」となっています。スマホ版固有のメニューとして「おすすめユーザー」が入って来ました。これはPC版ではホーム画面の左下に配置されていたものでスマホでは表示する領域が無かったのでこちらにメニューの形で組み込んだのではないかと思われます。それ以外の部分では「設定」と「ヘルプ」の並びがPC版とは逆になっています。
mixiと同様の現象ですね。
やはりPCとスマホで並びが変わるという事情は考え難いので統一的なルールに従って仕様が決められたのではなくPC版とスマホ版は別々に仕様を考えたのか、合わせるのを躊躇ったかのだと思われます。
もう一つmixiと同様の事が起きています。
それは用語です。
PC版では「プロフィールを表示」でスマホ版では「プロフィール」です。確かにスマホでは画面サイズの関係でなるべく文言は短くしたいところですが、少なくとも画面を見る限りでは「プロフィールを表示」のままでも十分に収まります。それにもし本当に短くしたい事情があるならばPC版を「プロフィール」に変更するべきに思えます。全てのメニューを見比べれば明らかなように「プロフィールを表示」のみが唯一単語ではなく文章の形になっています。従って普通に考えればPC版を「プロフィール」にすればスマホ版の事情も汲めて全体としても統一的になるので全て丸く収まるように思えるのですが、勿論外側から見ているだけの話なので如何なる事情があるのかは分かりません。

プロフィール


そのプロフィールのPC版の画面です。

同じくスマホ版の画面です。

概ね揃っているように見えるのですが真ん中の所の機能が決定的に違います。PC版は「ツイート」「ツイートと返信」でスマホ版は「ツイート」「画像/動画」「いいね」です。これはもう機能自体が全く違うのでどう理解したら良いのか分かりません。もしかしたらこの部分は設定があって自分がそれを変えてしまったのかもしれません。

設定


最後に設定を見てみます。以下がPC版です。

左側に分類の一覧があってそれを選択すると右側に内容が出るという形です。

以下がスマホ版です。二頁分です。


設定内容が一画面で全て表示されているようです。一応線で区切って分類がされているようですがPC版との対比は特に無さそうです。流石に設定内容については大体同じ項目なのでしょうけど、画面に関しては完全に別物のようですね。

あとがき


最初に述べた様にTwitterは比較的統一的な仕様になっていると思いますが、それでも調べて見ればやはり色々とあります。

一覧


メニュー

関連


事例:mixi-メニュー


記事を広める



posted by 善 at 22:25 | Comment(0) | TrackBack(0) | 事例 | このブログの読者になる | 更新情報をチェックする
スポンサーリンク
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバック