Web サイトデザインでは 2, 3 年くらい前から モバイルファーストでデザインをする [http://www.yasuhisa.com/could/article/responsive-design/] という考え方が浸透し始めていますが、最近アプリでも似たような傾向が見られるようになってきました。先週 Foursquqre が チェックインとショップガイドを分ける [http://techcrunch.com/2014/05/02/foursquare-swarms-over-swarmly/] と発表しました。一方、Facebook は、メッセージアプリを分断 [http://techcrunch.com/2014/04/09/facebook-messenger-or-the-highway/] しようとしています（Google+ は、Hangout を分断してしばらく経ちます）。 デスクトップ版の使い勝手に慣れ親しんでいる方にとっては『改悪』なのかもしれません。しかし、モバイル（又はスマートデバイス）中心で活用している方には、

小さなパッケージとしてのカード 前回の記事 [http://www.yasuhisa.com/could/article/message-card-ui/] で、メッセージのやりとりという文脈にカード UI が組合わさることで、新たな利用者体験を提供できるのではないかという話をしました。コンテンツを『ページ』としてではなく、『小さなパッケージ [http://www.yasuhisa.com/could/article/content-package-design/] 』にして利用者に配信することが主流になりつつある現在。これは、Web 上の情報のあり方を再考せざるを得ないと同時に、利用者にとって理解しやすい（ページに代わる）メタファが必要とされているのだと思います。小さなパッケージの表現方法としてカード UI は、無視できないデザインパターンのひとつです。 カード UI の可能性を最初に感じたのは、2010 年に登場したPinterest [http://pinterest.com/] 。たくさんの画像を全面に出しつつ、概要や操作を統一感を持たせてコンパクトに表現しています。P

タッチデバイスを視野にいれた UI パターンの事例がかなり出そろってきました。使いやすいと定評があるもの、流行なもの、採用例が多いものなど様々ですが、実際のところどの UI パターンを採用すれば良いか迷う場合がでてきます。「○○の場合は、このパターン」と一発で決めることが出来なくても、考慮したいパターンを絞ることができます。絞り込みの際に利用者のモードが役に立ちます。 モードとは、人がアプリケーションやサービスと向き合うときの状態のことを指します。利用者の意図、環境、時間、向き合っているデバイスに応じて、モードがダイナミックに変化することがあります。モードを理解することで、利用者のニーズに近いインターフェイスを提供することができます。同じ系統のアプリケーションでも UI が全く異なる場合がありますが、それは利用者のモードの捉え方の違いからだと考えられます。 モバイルアプリケーションの多くは以下の 5 つのモードに振り分けることができます。 1. Explore（探索）: 全貌を見渡したり、新しいものを見つけ出す 2. Consume（消費）: コンテンツ観覧にフォーカスする

UI デザインとひとことで言ってもたくさんのことを考慮しなければいけません。単一機能のシンプルなアプリの設計だったとしても、UI の課題は山のようにあります。私自身、どこから始めたら良いのか分からなくなることがありますが、UI デザインを考える始めるために、ふたつの疑問を自分自身に問いかけるようにしています。 * 利用者が期待に応えられるようなインターフェイスはなにか？ * 利用者が目的に辿り着く為の明確な道筋はなにか？ 利用者と目的の間には『溝』があります。それをどう埋めるのかを考えるのも UI デザイン。 矢印のような印がついたボタンがあれば、利用者は何を期待し、行動するのか。 この２つの疑問のなかで特に重要になのが「期待に応える」という部分です。実は、利用者の期待をうまく処理できていないために、使い難いという反応に繋がる場合があります。では、ここでいう 期待とは、どういう意味なのでしょうか。 * 次に表示される画面が、利用者の思っていたものであること * 操作した結果が、利用者が想定していたものであること それでは、逆に期待通りではない状態とはどういったもので

タッチ UI のデザインで難しいのは、表層的な部分だけを設計すれば良いものになるわけではないという点です。技術もきちんと理解することで、Web なら Web らしい、アプリならアプリらしいデザインになります。表層的な部分から入ると、見た目は良いけど使い難くなったり、「なんとなく違う」という声に繋がることもあります。 だからといって、絵を描きながら UI を模索することを否定しているわけではありません。しかしながら絵を描く過程があったとしても、人がデバイスとどのように関わるのかを理解していることが前提になります。人はどのように UI に触れて、どのようなフィードバック（アウトプット）を期待しているのでしょうか。 タッチデバイスにある新しい挑戦 多くの方がタッチデバイスを扱うようになって数年経ちますが、今はもう画面に触れるだけが唯一の方法ではありません。人とデバイスの関係はより親密になったと同時に、関わり方は多様で複雑になりました。 おさらいという意味も含めて、最近のデバイスと人との関わり（インプット & アウトプット）をまとめてみました。 多種多様なインプットとアウトプットが