UI界面设计（李洪海 ）

当前，移动互联网、智能硬件以及虚拟世界的丰富体验，让人们对未来的数字生活充满畅想，市场上对数字界面类产品的需求也逐年倍增。这让用户体验、交互设计、UI界面设计等概念更加深入人心。为了应对数字产品的发展，越来越多的企业都建设了用户体验设计中心，其重要性甚至比肩研发中心。这一领域需要大量的交互设计师、界面设计师以及用户体验人员，而传统的视觉传达设计、工业设计、媒体设计教育领域比其他领域更早地感受到了数字化转型带来的冲击。新时代的产品数字化趋势让设计师需要以交互与界面设计的思维重新思考原有的设计对象。UI界面设计思维的核心是操作逻辑优先、标准化设计、规范化制作。这与传统的视觉传达设计、工业设计以及媒体设计有着很大的不同。这要求界面设计的流程更加关注用户的认知心理、使用习惯以及视觉逻辑，界面设计师发挥才华的空间发生了转移。更多的时候，界面设计师要考虑的是用户能不能理解一个按键的操作方式，或者斟酌多放置一个像素的内容会不会让页面太过拥挤。因此，界面设计师的核心能力也发生了演变，同理心成为一个优秀的界面设计师的素质。同时，界面设计师要对视觉元素微妙的差异保持敏感，更加重要的是思考如何将设计意图完美地呈现在上市的产品中。界面设计师是数字时代的新型职业，具有很强的交叉性和成长性，其未来的职业发展充满机遇。本书基于行业未来对数字设计人才的需求，以培养学生的界面实操能力为主要目标，从界面设计实战角度出发，设置了大量的案例讲解。其中，第1章为UI界面设计概述；第2章着重讲解了界面架构设计的方法；第3章从视觉认识的视角解析了界面设计的原则与规范；第4章讲解了界面视觉设计的详细流程与方法；第5～7章分别用案例讲解的方式介绍了视觉设计、动效设计以及原型设计的软件操作；第8、9章讲解了桌面端以及移动端的两个综合设计案例。希望通过这些知识与技能的讲解，帮助学生建立界面设计知识框架，激发其界面设计思维，提升其界面设计的实操能力，让其上好界面设计师的职业第一课。需要说明的是，书中个别图片因汉化不到位等原因而存在表达不规范等问题。本书的主编为北京信息科技大学李洪海，副主编为济源职业技术学院郜亚丽、黑龙江工程学院昆仑旅游学院于娜娜、武汉商学院周宇，武汉汇众计算机职业培训学校李桑、武汉商学院肖雷参与编写。在此，感谢各位编者的辛勤劳动，感谢侯林飞、史昊冉、李昊谦等同学的帮助，感谢化学工业出版社编辑们的耐心与付出，感谢多年来支持我们的读者朋友！由于时间、精力有限，书中难免有疏漏之处，真诚地希望读者提出宝贵建议，让我们在学习UI界面设计的道路上共同成长！李洪海2023年3月

本书为交互设计入门教材，在讲解交互设计基本概念与基础知识、交互设计的基本流程与常用方法的基础上，教授交互设计调研方法、信息架构与交互模式设计、交互原型制作与测试、交互界面视觉设计、交互界面开发基础等交互设计师的基本技能，并使读者能够掌握相关交互设计软件如Axure、Sketch、Adobe XD等的使用。本书在讲解交互设计理论、方法的同时，基于作者丰富的设计经验，提供了较多的实际设计案例。这些案例跨越PC端界面、移动端界面等多个平台，过程详细，可以帮助读者更好的掌握交互设计的方法和技巧，具有很强的实践指导价值。为便于读者立体化学习，本书配备有以综合案例讲解为主的数字资源。

李洪海，北京信息科技大学，讲师，1997年9月至2001年7月，就读于燕山大学工业设计专业，获得学士学位。 2001年9月至2004年4月 就读于北京理工大学设计艺术学院，获得硕士学位。2004年4月至今，在北京信息科技大学工业设计专业任教。2008年9月至2009年1月，美国明尼苏达大学进修。主要从事交互设计，多媒体设计的研究与教学工作，并有大量的设计作品面世。长期担任人机交互设计、多媒体设计的课堂教学工作，积累了很多的相关经验。

第1章 UI界面设计概述认识UI界面设计 1UI界面设计的定义 2界面设计的历史、现状与未来 3界面设计的流程与方法 6界面设计师的知识体系 7界面设计师的职业类型与发展 9第2章 界面架构设计页面间信息架构设计 11页面内信息架构设计 16界面架构设计的方法 21第3章 界面视觉设计原则与规范格式塔原则 24差异化设计原则 27效率优先原则 29简洁设计原则 34防错原则 38界面视觉设计规范 40第4章 界面视觉设计流程与方法界面视觉设计流程 41界面版式设计 43界面色彩设计 46界面图标设计 55第5章 界面视觉设计案例用Sketch设计与制作新拟物风格界面 61用Figma设计与制作毛玻璃风格界面 77第6章 界面动效设计界面动效设计流程与方法 98界面动效设计要求 100After Effects界面动效设计案例 101第7章 界面高保真原型制作界面高保真原型制作工具 118Figma软件中交互原型工具介绍及应用 119案例实战：宠物App界面原型设计与制作 123第8章 桌面端界面设计案例桌面端界面设计案例规划 141案例实战：灯具电商网站界面设计 142第9章 移动端界面设计案例移动端界面设计案例规划 152案例实战：移动端界面设计 154参考文献 176

本书为交互设计入门教材，在讲解交互设计基本概念与基础知识、交互设计的基本流程与常用方法的基础上，教授交互设计调研方法、信息架构与交互模式设计、交互原型制作与测试、交互界面视觉设计、交互界面开发基础等交互设计师的基本技能，并使读者能够掌握相关交互设计软件如Axure、Sketch、Adobe XD等的使用。本书在讲解交互设计理论、方法的同时，基于作者丰富的设计经验，提供了较多的实际设计案例。这些案例跨越PC端界面、移动端界面等多个平台，过程详细，可以帮助读者更好的掌握交互设计的方法和技巧，具有很强的实践指导价值。为便于读者立体化学习，本书配备有以综合案例讲解为主的数字资源。

李洪海，北京信息科技大学，讲师，1997年9月至2001年7月，就读于燕山大学工业设计专业，获得学士学位。 2001年9月至2004年4月 就读于北京理工大学设计艺术学院，获得硕士学位。2004年4月至今，在北京信息科技大学工业设计专业任教。2008年9月至2009年1月，美国明尼苏达大学进修。主要从事交互设计，多媒体设计的研究与教学工作，并有大量的设计作品面世。长期担任人机交互设计、多媒体设计的课堂教学工作，积累了很多的相关经验。