タグ

uiとモバイルに関するcyber_snufkinのブックマーク (5)

  • クリエイティブなタブバー型ナビゲーションを考える | UX MILK

    モバイルナビゲーションの基パターンを選ぶときに、プロダクトデザイナーは2つの選択肢から選びます。ハンバーガーメニューとしても知られるドロワー型か、タブバー型です。どちらのナビゲーションにも長所と短所があります。 この記事はそのうち、タブバー型に関するものなので、ドロワー型を上回るタブバー型の利点から話しましょう。 ユーザーの現在地がひと目でわかる。アプリの中で自分がどの位置にいるのかをメニューを開いて確認する必要がありません。ひと目で知ることが可能です。 見つけやすさ。ユーザーはトップレベルのナビゲーションオプションを最初から見ることができます。 指の届く範囲にある。タブバーは届きやすい場所(画面の1番下)に位置しています。ユーザーは指を伸ばして選択する必要がありません。 しかし、タブバー型にはいくつかの欠点があります。 ナビゲーションに載せる選択肢の数が限られる。タッチ箇所が小さくなり

    クリエイティブなタブバー型ナビゲーションを考える | UX MILK
  • モバイルではメニューを画面下に表示すべき理由

    スマートフォンの使い方が、脳に影響を与えることがあります。ある調査によると、毎日スマートフォンを使う人は、脳の体性感覚皮質が大きいことがわかりました。体性感覚皮質は、親指のコントロールをつかさどる部位です。 また、ほかの調査では、ほとんどのユーザーがスマートフォンを片手で操作していることが明らかになりました。スマートフォンを握っているとき、ユーザーは左右どちらかの親指で画面を操作しているのです。親指はユーザーにとってマウスのようなものですが、その動きには限界もあります。 親指はマウスの代わり デスクトップデバイスでは、ユーザーは画面の操作にマウスを使用します。ナビゲーションメニューまでマウスを動かすことは簡単です。なぜなら、マウスは手首の動きを制限しないからです。 しかし、ユーザーがスマートフォンを握っているとき、親指は限られた範囲でしか動けません。画面に親指が届かない領域があるのです。こ

    モバイルではメニューを画面下に表示すべき理由
  • モバイル環境でSpeaker Deckを快適に閲覧する方法 - razokulover publog

    TL;DL モバイル環境からmをドメインの先頭に追加してアクセスすると良い感じにスライドが閲覧できます。 例) https://speakerdeck.com/qrush/the-graphql-way-a-new-path-for-json-apis ↓ https://mspeakerdeck.com/qrush/the-graphql-way-a-new-path-for-json-apis 概要 Speaker Deckはスライドを共有するサービスです。 特に大きなカンファレンスが開催された後はたくさんの発表資料がこのサービスにアップロードされるのでよく閲覧します。 Speaker Deckは、PCで閲覧する分には特に問題はないです。 しかしモバイル環境で閲覧すると少し残念です。 なぜならSpeaker DeckにはPC用のレイアウトしか存在しないからです。 通勤中にTwitter

    モバイル環境でSpeaker Deckを快適に閲覧する方法 - razokulover publog
  • モバイルUI進化中!革新的なナビゲーションメニュー実例サンプル10個まとめ

    モバイル向けナビゲーションデザインには、さまざまな形やスタイルが登場しています。すべてのナビゲーションメニューが同じ構造であれば、ユーザーにとっても直感的で分かりやすいかもしれませんが、現実はそれほど単純ではありません。 独自の問題を抱えたモバイルアプリは、ナビゲーションメニューのデザインによってそれらの問題を解決することもできます。たとえば、7〜8つほどの主要メニュー項目がある場合はおそらくハンバーガーメニューを採用し、3つほどのメニュー項目の場合はタブバー形式を実装するかもしれません。 デザイナーが製品やユーザーのために最適化したナビゲーションメニュー設計では、クリエイティブで画期的なデザインがいくつか見られます。今回は、ナビゲーションメニューを作成するときに参考にしたい、革新的な実例サンプル例をまとめてご紹介します。 ハンバーガーメニューが進化中!2018年に押さえておきたい最新トレ

    モバイルUI進化中!革新的なナビゲーションメニュー実例サンプル10個まとめ
  • 1日に何度もFacebookを見てしまうのはなぜ?モバイルUXの主流になりつつある「Alive Design」とは

    約10年のスマートフォンの歴史の中で、アプリデザイナーやUXデザイナーが考えてきたことはずっと*「この小さな画面でどうやってユーザーに心地いい体験をしてもらうか」*ということではないでしょうか。 画面が小さいので過度な装飾はできません。とはいえ単調なデザインでは飽きられてしまいます。 そこで登場したのが、*「マイクロインタラクション」*という考え方です。 マイクロインタラクションとは、小さなアニメーションを使って現在何が行われているかをフィードバックしたり、進行中のプロセスの状況を伝えたりするコミュニケーション手法のことです。 参考: マイクロインタラクションとは?UXに取り入れる際の5つのポイント これまでマイクロインタラクションは、モバイルデザインにおいては全体の中の*「要素の一部」として考えられてきました。 しかし最近では、これまでの「Static Design」(静止したデザイン)

    1日に何度もFacebookを見てしまうのはなぜ?モバイルUXの主流になりつつある「Alive Design」とは
  • 1