スマートフォンのためのUIデザイン 1
この本で学びたいこと
スマートフォンというデバイスにおいて、基本の構造・考え方についてまとめた本。iOS/Androidは問わない、またアプリ/サイトも問わないで、まずは概念について最低限の内容を把握する。
今日読んだ箇所
Chapter 0 はじめに
スマートフォンUIの概要 / ユーザーの操作と環境
Chapter 1 画面パターン
導入画面 / トップ画面 / 一覧画面 / 詳細画面 / 入力・操作画面 / 画面遷移
Chapter 2 基本UIコンポーネント
ヘッダー / フッター / モーダルウィンドウ / ウィンドウシェード / アクションパネル
Chapter 3 ナビゲーションとコントロール
タブ型ナビゲーション / セグメンテッドコントロール / スワイプナビゲーション
ドロップダウン / ドリルダウン / アコーディオン / ダッシュボード
バック/ホーム / 画面アップ/ダウン / ページャー / インフィニットリストページャー
リフレッシュコントロール/ スライドメニュー
Chapter 4 リスト
垂直型リスト / グリッドリスト / カルーセルパネル
タイムライン / カレンダー(日付リスト)
Chapter 5 フォーム
テキストフィールド / スイッチ / ピッカー / スライダー
ドラッグアンドドロップ
Chapter 6 通知とメッセージ
モーダルメッセージ / モードレスメッセージ /ブロックメッセージ
バッジ / バルーンメッセージ
Chapter 7 情報のビジュアル化
インフィニットインジケーター / プログレスバー / ページインジケーター
グラフ / レーティング
Chapter 8 アイコン
家 / 虫眼鏡 / ギア / 星 / アナログ時計 / ピン / 人 / 鉛筆 / ゴミ箱
プラス/ バツ / カメラ / 三連ドット / 連結したドット
シェア / 三連ライン / リフレッシュ
Chapter 9 モーション
スライドレフト/ライト / オーバーレイアップ/ダウン
フェードイン/アウト / 回転 / ズームイン/アウト
シェイク / ウィグル
Chapter 10 ビジュアルデザイン
標準デザイン / スキューモーフィックデザイン / フラットデザイン
アウトプット
§1-6[画面遷移図]を参考に、主要導線について画面遷移図を改めて描いた。
機能やシチュエーションを考えると2パターン画面遷移図を作れるように思う。10ヶ月前にも同じものを作成するように指示されて作ったが、作成する目的が分かっていなかったためやたらめったら画面を線で繋いだ図を作ってしまったが、「主要導線におけるCSの流れを整理する」だと下記の画面で十分である、と今なら自信を持って言える。
（めちゃくちゃ各論だったので消しました）
これらの流れについて数字をざっくり掴んでいたいし、CSのセグメント別に動きが変わることを確認できる状態にしておきたい。
※来週どこかでする
感想・その他一言
自分でアプリのUIを考える際に「なんとなく違う気がする」と思いつつ検討してしまっていた項目などあったが、「それが適切でない理由」を文言化して記載されており、今後のUI検討で活かせるであろうと思った。具体例については数を見ていくしかないと思うので、続きの項目については、今まで馴染みがなかったUIに注意して読み進めたい。
