随着智能手机、平板电脑的快速普及,越来越多的企业意识到建立自己的App应用和移动网站的重要性,也有越来越多的设计师开始转战移动平台,这就关系到移动应用的产品设计。产品设计其实是一个由抽象的概念到具体形象化的处理过程。本书通过需求、产品、界面、图标、动效、情感这6大块内容,全方面解析移动应用的产品设计。 本书分为6章,第1章分析了用户的需求,从展开需求评估到信息的架构组织来进行阐述,也就是真正意义上的发现需求;第2章剖析了产品设计,包含草图的绘制、原型的设计及交互设计,这几大方面都是为了用户体验而生;第3章剖析了产品的界面设计,包括UI设计的原则、界面模式及UI设计的基本规范;第4章讲解了图标设计的原则和图标的案例示范;第5章讲解了动效设计的重要性及如何实现动画效果;第6章讲解了产品的情感化设计,包括情感化设计的意义和它在UI设计中的运用。 本书适合产品经理、交互设计师、用户体验设计师、平面设计师,以及准备转入产品设计行业的人士学习使用,同时,也适合产品设计相关专业的学生或者设计爱好者阅读。
博学交互设计师倾心之作。
10位行业专家和教授联袂推荐。
6大块内容全解析:通过需求、产品、界面、图标、动效、情感这6大块的内容,全方面的解析了移动应用的产品设计。
何天平,毕业于中国传媒大学数字媒体艺术专业,现为中国人民大学新闻学院博士生,沐思工作室产品总监。从事移动端产品设计四年,设计产品十余项。为高校讲授《移动互联网应用》《新媒体概论》等课程。 白珩,毕业于中国传媒大学数字媒体艺术专业,现为猫眼用户体验设计中心(MIX)高级视觉设计师,沐思工作室视觉总监。Dribbble、站酷等设计平台人气设计师。
绪论:如何在纷繁的市场中发现人们的“需求”
1.为什么需要一款应用产品 /010
2.发现身边的微观世界 /011
3.在群体特征里找“痛点” /017
4.“无聊”也是一种需求 /020
01 从理解用户需求开始 /021
1.1 需求评估如何开展 /022
1.1.1 用户需求这件“小”事 /022
1.1.2 产品调研方法概述 /028
1.1.3 为“人物”做产品 /028
1.1.4 为“市场”做产品 /037
1.1.5 重视需求重构的工作 /043
1.2 信息架构如何组织 /046
1.2.1 信息架构的功能、流程与可视化设计 /046
1.2.2 工具的使用规范与操作要点 /049
02 为体验而生的产品设计 /053
2.1 草图是产品可视化的及时步 /054
2.1.1 如何绘制草图 /054
2.1.2 让草图“动”起来 /057
2.2 系统性开展原型设计 /061
2.2.1 工具的选择与使用 /061
2.2.2 如何开展原型设计 /071
2.2.3 及时考虑原型的可用性 /079
2.3 始于细节的交互设计 /082
2.3.1 友好的用户体验是前提 /082
2.3.2 手势的重要性 /083
2.3.3 不要忽视声音 /086
2.3.4 设备即是“内容”/089
03 不只是美观的界面设计 /091
3.1 UI设计为什么不能叫“美工” /092
3.1.1 产品功能与UI设计 /092
3.1.2 移动UI视觉设计的基本原则 /093
3.1.3 移动UI视觉设计中色彩的搭配与运用 /101
3.2 常规界面模式的UI设计 /104
3.2.1 辅助界面 /104
3.2.2 首页/主界面 /109
3.2.3 列表界面 /113
3.2.4 详情界面 /115
3.2.5 输入/操作界面 /118
3.3 UI设计的基本设计规范 /119
3.3.1 界面设计尺寸 /119
3.3.2 字体的选择与大小 /126
3.3.3 标注与切图 /127
04 微“图”大义的图标设计 /129
4.1 UI设计中的图标设计 /130
4.1.1 图标设计的特点与意义 /130
4.1.2 如何确定图标的物象 /141
4.2 如何设计图标/152
4.2.1 图标的设计风格与表现力/152
4.2.2 常用图标的设计方法 /158
05 “微交互”视野下的动效设计 /175
5.1 能令界面“活”起来的动效设计 /176
5.1.1 动效设计的特点与意义 /176
5.1.2 开展动效设计前的准备 /184
5.2 如何设计动效 /186
5.2.1 动效设计的基本原则 /186
5.2.2 常用动效的设计方法 /193
06 有“温度”的情感化设计 /201
6.1 UI设计中的情感体验 /202
6.1.1 情感化设计的特点与意义 /202
6.1.2 如何表达情感化设计 /205
6.2 情感化设计在UI设计中的运用 /209
6.2.1 启动界面 /209
6.2.2 主题皮肤 /213
6.2.3 其他场景 /214