表層UIデザインの解剖学 ──ユーザーの知覚に訴える「見た目」の作り方(技術評論社) [電子書籍]
    • 表層UIデザインの解剖学 ──ユーザーの知覚に訴える「見た目」の作り方(技術評論社) [電子書籍]

    • ¥2,860572 ゴールドポイント(20%還元)
    • ただいま予約受付中!2026年07月08日12:00:00からお読みいただけます

表層UIデザインの解剖学 ──ユーザーの知覚に訴える「見た目」の作り方(技術評論社) [電子書籍]

本田雅人(著者)
価格:¥2,860(税込)
ゴールドポイント:572 ゴールドポイント(20%還元)(¥572相当)
フォーマット:
専用電子書籍リーダーアプリ「Doly」が必要です。無料ダウンロード
お届け日:ただいま予約受付中!
出版社:技術評論社
公開日時:2026年07月08日12:00:00からお読みいただけます。
お取り扱い: のお取り扱い商品です。
ご確認事項:電子書籍リーダーアプリ「Doly」専用コンテンツ
こちらの商品は電子書籍版です

表層UIデザインの解剖学 ──ユーザーの知覚に訴える「見た目」の作り方(技術評論社) の 商品概要

  • UI(ユーザーインターフェース)は,現代のデジタル社会において,人とサービスをつなぐ「道具」のような存在です。道具としてのUIに求められるのは,使いやすさ,アクセシビリティ,そして「また使いたい」と思わせる魅力です。良い道具は使い手の生活に溶け込み,その価値を見出され続けるものです。そして,UIデザインとは,まさにそのような「道具としての魅力」を形にする作業です。
    しかし,昨今のUIデザインは,均質化が進み,パターン化されたデザインの模倣が繰り返されがちになっており,UIは個性や独自性を失い,形式的な表現に留まりがちになっています。
    このような状況の中で,本書ではUIデザインの意義を問い直します。UIを「道具」として見つめ直し,その魅力をどう育み,サービスを通じてユーザーの心を動かす存在にするか。本書を通じて,UIが生み出す体験の価値を再定義し,デザイナーが果たすべき役割とその意義を伝えたいと考えています。
    本書は,Amebaのデザインシステム「Spindle」の制作者が,自らの経験と哲学をもとに,「なぜ表層UIデザインにこだわるのか」「どのようにその価値を深めるべきなのか」を言語化し,体系的にまとめたものです。UIデザインの初心者から中堅デザイナーまで,多くの人にとって新たな発見と視点をもたらすはずです。
    UIデザインを「道具としての魅力」という視点から深く掘り下げることで,単なる見た目を超えた,心を動かすUIデザインをともに考えましょう。
  • 目次

    第1章 今,私たちは何をデザインすべきなのか
    1.1 デザインの「意義」
    1.2 UIの意義とは
    1.3 機能的存在から文化的存在へ変化する道具
    1.4 UIにおける「情緒的価値」の創出の意義
    1.5 情緒的価値を生み出すクリエイターの矜持と執心
    1.6 共感の時代におけるデザインの役割
    1.7 多様性が生み出す豊かさ

    第2章 表層UIの価値を考える
    2.1 UI概論
    本書で扱う「表層UI」とは
    GUIの革新性と特徴
    GUIがもたらした民主化
    GUIの制約
    表層への着目
    「表層UI」を切り出す
    2.2 認知と想起から表層UIを解き明かす
    「良い」表層UIデザインを導くということ
    人間の認知とトップダウン処理
    現実世界の模倣と違和感の排除
    スキューモーフィズムの再定義
    2.3 身体性とインタラクション
    操作可能性
    デバイスと身体の一体化
    物理法則の再解釈
    2.4 人間とUIの共生関係の創造
    身体の一部としてのデバイス
    愛着を生み出す表層UIデザイン
    UIデザイナーに求められるものづくりの精神

    第3章 表層UIを解剖する
    3.1 解剖の意義
    3.2 色
    色が持つ意味
    白と黒の役割
    ダークモードの考え方
    グラデーションを用いた光沢表現
    影を使わない立体表現
    3.3 影と空間
    二次元に三次元を起こす
    影の効果
    影の物理学的制約とリアリズムの追求
    影が持つコンテキスト
    インナーシャドウ
    影の相対性と文脈依存性
    影の設計における留意点
    3.4 余白と密度
    有限な空間における選択
    情報密度とユーザーのモード
    絵としての密度
    余白は引き算ではなく設計である
    3.5 文字と言葉
    文字の二重性
    文字量と読みやすさのバランス
    日本語の形の難しさ
    3.6 ぼかし
    ぼかしの特徴
    中心視野と周辺視野
    光学的な焦点調節による被写界深度
    選択的注意によるぼやけ
    ダイアログとぼかし
    バックグラウンドブラー
    ぼかしの二つの役割
    3.7 形
    形は「なんとなく」で決められている
    形は機能を符号化している
    形の意味を支える三つの根拠
    形の「品詞」という考え方
    デザイナーにとっての形の言語化
    ユーザーにとっての形の一貫性
    形を意識的に設計する
    3.8 アイコン
    アイコンの二重性
    記号としての意味性
    表現としての可能性
    人間的個別性の体現
    情緒的価値の源泉
    制約の中の自由
    3.9 動き
    静止と運動の間
    動きが生む理解の構造
    動きの方向と意味
    動きが語るキャラクター性
    UIにおける物理法則の設計
    動きの設計における留意点

    第4章 UIが持つ表現としての可能性を考察する
    4.1 UIが持つ潜在的な意味を考える
    4.2 UIは新しい表現の探究でもある
    マテリアルメタファーの深化と技術的進歩
    デジタル世界ならではの新しいマテリアルの開拓
    4.3 UIはユーザーとのコミュニケーションとして捉える
    UIは接客でもある
    「生きた」UIをデザインする
    生きたキャラクターを意識したライティングの工夫
    タイポグラフィは声として知覚される
    インタラクションは所作として知覚される
    4.4 さらに進化するUIデザイン
    UIデザインは常に進化すべき
    技術的転換点がもたらす進化
    三次元空間への拡張がもたらす進化
    4.5 AIによって変化するUI
    「操作」から「依頼」へ
    トレードオフの存在
    複数のUIが共存する未来
    表層UIが担う責任

    第5章 デザインを運用することの意義
    5.1 デザインを運用する
    5.2 サービスを主語にし,個別性を生む
    「チームのため」ではなく「サービスのため」にある
    一貫性ではなく,「個別性」を発生させる
    5.3 理想の定義,説得力,そして普遍性へ
    Amebaで目指したのは「居心地の良さ」の定義
    説得力のない定義は,うつろう
    「なぜそうなったのか」がなければ,軌道修正できない
    変化が前提の時代に,普遍性をどこに置くか
    人間にとって都合のよい状態,物理世界にとって自然な動き
    5.4 Spindleにおける実践:アイコン形状の定義
    感覚ではなく,根拠を求める
    Ameba Sansを起点にする
    形状の分析と数式化
    現場で使える形に落とす
    根拠があることで生まれる効果
    思考の過程を残すということ
    5.5 Spindleにおける実践:ドロップシャドウの定義
    光源を定義する
    物理シミュレーションで数値を導く
    説明可能性と世界観の表現
    二つの実践に共通すること
    5.6 デザインシステムを「信じられるもの」にするために

表層UIデザインの解剖学 ──ユーザーの知覚に訴える「見た目」の作り方(技術評論社) の商品スペック

Cコード 3055
出版社名 技術評論社
本文検索
紙の本のISBN-13 9784297157067
他の技術評論社の電子書籍を探す
ファイルサイズ 18.8MB
著者名 本田雅人
著述名 著者

    技術評論社 表層UIデザインの解剖学 ──ユーザーの知覚に訴える「見た目」の作り方(技術評論社) [電子書籍] に関するレビューとQ&A

    商品に関するご意見やご感想、購入者への質問をお待ちしています!