出版社内容情報
「このUI、なんか使いづらい……」を「いいね!」に変える即効テクニック!
パッと見て納得、即マネできる、最前線のプロが実践している41のデザイン改善術とは?
【デザイナー&発注者必携! UXを劇的に向上させる最強バイブル!】
著者が自ら様々なクライアントのプロダクト・サービスのデザイン改善を行っていく中で得た、ユーザビリティをより良くするための41のヒントを一挙公開します。
本書では「UIとは何か?」の基礎から、業務支援システムのデザインの例を通して実践的なUIデザインの考え方と改善のプロセスまでを現場に則した形で解説していきます。
UIデザインの基本的な知識や観点を整理し、それをどのように具体的なシステムの設計・改善に活かすことができるかを「現場のあるある」を交えながら紹介しています。
【株式会社アイスリーデザインとは?】
アプリやWebサービスのデザイン&テック企業。
企業のデジタルプロダクトにおけるUI/UXデザイン支援を行っており、これまでに100件を超えるプロダクトの設計・改善に携わってきた。
その中で「ユーザーにとって使いやすいUIにするための視点は、業界やシステムの種類に関わらず一定の共通点がある」と感じるようになり、それをまとめたのが本書。
【対象読者は?】
・UIデザインを学び始めた方
・自社プロダクトの使いやすさを向上させたいと考える方
・業務支援システムに関わる関係者全般(プロダクトマネージャー、エンジニア、デザイナー、営業企画職など)
・デザイン発注をする一般ビジネスパーソンとその決裁権者
【本書の特徴】
・「Before→After」図解で、見ればすぐに違いがわかる!
・「ここが悪い!」が一目で分かる! UI改善の最短ルートを示すオールカラーのビジュアル解説
・現場で求められる“本当に使いやすい”UIの作り方がわかる!
ユーザーの「使いやすさ」から逆算したデザインの心得を一挙公開!
【目次】
序章 UIデザインとはなにか?
・UIはユーザーとシステムをつなぐ「接点」
・UIデザインと混同されやすい領域のデザイン
・UIデザインに求められる視点
・「良いUIデザイン」の3つの指針
・指針(1)10のユーザビリティヒューリスティックス
・指針(2)UX5段階モデル
・指針(3)WCAG
・本書の「読み方」
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.操作に対する
内容説明
ユーザーの「使いやすさ」から逆算したデザインの心得を一挙公開!デザインの基礎→実務への繋げ方が具体的事例で丸わかり!
目次
序章 UIデザインとは何か(UIはユーザーとシステムをつなぐ「接点」;UIデザインと混同されやすい領域のデザイン;UIデザインに求められる視点 ほか)
1 飲食店向けの注文管理システム『スマート注文くん』飲食店の注文管理システムを通じて、業務支援システムUIの基礎知識を学ぶ(アカウント登録1 全体;アカウント登録2 入力;オンボーディング;データ一覧1 カードビュー;データ一覧2 操作)
2 従業員評価管理システム『タレパス』従業員の評価管理システムを通じて、複雑な機能を使いやすくデザインするポイントを学ぶ(データ一覧3 テーブルビュー;データ詳細1 閲覧;データ詳細2 削除;データ詳細3 フィードバック;データ新規追加1 入力;データ新規追加2 エラー)
著者等紹介
佐々木祐真[ササキユウマ]
株式会社アイスリーデザイン執行役員、デザイン部部長。武蔵野美術大学卒業後、2014年にアイスリーデザインに新卒入社し、現在は執行役員、デザイン部部長。業務アプリケーションやネイティブアプリなど多岐にわたって長年デザインを担当し、現在はデザイン組織のマネジメント及び、クライアントワークでのデザインディレクションに従事
直原杏花[ナオハラキョウカ]
UIデザイナー。株式会社アイスリーデザインデザイン部所属。多摩美術大学卒業後、Webデザイン制作会社を経てアイスリーデザイン入社。業務アプリケーションをはじめとした多様なプロダクトのUIデザインに携わる。情報設計など上流工程からのデザイン支援を多く経験
岩本あかり[イワモトアカリ]
UIデザイナー。株式会社アイスリーデザインデザイン部所属。京都工芸繊維大学大学院卒業後、大手電機メーカーを経てアイスリーデザイン入社。大規模デザインシステムの構築支援を中心に、情報設計からビジュアルデザインまで幅広い領域に従事
大林志帆[オオバヤシシホ]
UIデザイナー。株式会社アイスリーデザインデザイン部所属。東京大学卒業後、PR関連企業を経てアイスリーデザイン入社。クライアントワークにおけるUIデザインに携わる一方で、自社メディアの企画・執筆・編集を通じ、社内外へのナレッジ発信にも注力(本データはこの書籍が刊行された当時に掲載されていたものです)
※書籍に掲載されている著者及び編者、訳者、監修者、イラストレーターなどの紹介情報です。