現場の「あるある」から学んだ 今すぐ使える「UIデザイン」41の法則 発売予定

序章　UIデザインとはなにか？
・UIはユーザーとシステムをつなぐ「接点」
・UIデザインと混同されやすい領域のデザイン
・UIデザインに求められる視点
・「良いUIデザイン」の3つの指針
・指針（1）10のユーザビリティヒューリスティックス
・指針（2）UX5段階モデル
・指針（3）WCAG
・本書の「読み方」
・ナビゲーター「UIじぃ」

Part1　飲食店の注文管理システムを通じて、業務支援システムUIの基礎知識を学ぶ
【アカウント登録（1）全体】
・プロダクトを使い始める準備をスムーズに進める
・01.要素の意味は「色の違い以外」で伝える
・02.重要な情報は常に表示する
・03.「ユーザーの現在地」を示す
・まとめ

【アカウント登録（2）入力】
・ユーザーの操作の手間を最小限にする
・04.自動入力を活用する
・05.デフォルトの値をユーザーに合わせる
・06.入力内容に合ったサイズにする
・まとめ

【オンボーディング】
・プロダクトの機能や操作方法を簡潔に伝える
・07.「スキップ」をできるようにする
・08.操作方法を分かりやすく提供する
・09.内容に合ったオンボーディング手法を選ぶ
・まとめ

【データ一覧（1）カードビュー】
・複雑な情報をひとまとまりでわかりやすく表示する
・10.並び順や絞り込み条件を表示する
・11.「情報の総量」を表示する
・12.押した結果が想像できる見た目にする
・13.コントラスト比は一定以上に保つ
・14.テキストの行間や文字数を読みやすくする
・まとめ

【データ一覧（2）操作】
・ユーザーの予想を裏切らない
・15.操作が正確に行えるサイズにする
・16.スクロールできることを示す
・17.「機能の違い」を見た目に反映する
・まとめ

【インサイト：道具としてのユーザーインターフェース】
・UIの本質を理解する
・「道具的UI」
・「広告的UI」
・デザインの目的の違いが生むもの
・中間的な存在～ECサイトの例～
・データとの関係性～「道具的UI」の核心～
・なぜ「道具的UI」が重要なのか

Part2　従業員の評価管理システムを通じて、複雑な機能を使いやすくデザインするポイントを学ぶ
【データ一覧　テーブルビュー】
・機能や見た目を業務フローに合わせて最適化する
・18.コンポーネントらしさが伝わる見た目にする
・19.データがない状態であることを表現する
・20.日付・時間をわかりやすい表記にする
・まとめ

【データ詳細（1）閲覧】
・情報の優先度を判断し、視覚的に表現する
・21.情報をグループ化する
・22.要素に優先順位をつける
・23.アイコンは補助的に使用する
・まとめ

【データ詳細（2）削除】
・重要なアクションの誤操作を防ぐ
・24.「削除」はほかの機能と区別する
・25.削除のしやすさを情報の重要性と合わせる
・26.ボタンテキストは動詞で表現する
・まとめ

【データ詳細（3）フィードバック】
・操作に対し適切かつ迅速なフィードバックを行う
・27.操作に対するフィードバックを返す
・28.操作箇所とフィードバックの位置を近づける
・29.ユーザーの操作を中断させない
・30.ボタン・リンクであることを示す
・31.リンクと遷移先の画面タイトルを揃える
・まとめ

【新規データ入力（1）入力】
・情報の形式に合った入力方法を用意する
・32.入力条件は事前に提示する
・33.定型的な内容の入力時は選択肢を提示する
・34.同じように使えるコンポーネントを使い分ける
・35.複数の入力方法を用意する
・36.「戻る」「閉じる」「キャンセル」を正しく使い分ける
・まとめ

【新規データ（2）エラー】
・ユーザーのエラー解消をサポートする
・37.システムメッセージは内容に応じた見た目にする
・38.システムメッセージは「身近な言葉」を使う
・39.エラーメッセージはエラーの近くに表示する
・40.メッセージにエラーを解消する方法を記載する
・41.エラーを過剰に表示しない
・まとめ

• 本商品の内容についての問い合わせ
• ご購入等に関する問い合わせ