欢迎光临散文网 会员登陆 & 注册

无需任何设计背景!这些书籍让你轻松成为交互设计领域的UI设计高手!

2023-05-29 11:37 作者:UXD尤克斯国际艺术中心  | 我要投稿



对于想学习交互设计的同学们来说,即使没有视觉或平面设计背景,仍然可以通过一些系统化、逻辑化的规则或框架来创建优秀的 UI,以一种"工程化"的方式进行设计。🙋本文 UXD 为大家强烈安利以下几本书籍+附多本书的PDF,帮助你轻松提升 UI 设计技能!


• UI Design Books

01-重构用户界面

Refactoring UI

私信获取书籍📚PDF


 ?  推荐指数:★★★★★ 

这是一本充满了实用的设计知识的书,内含多种正反案例的对比。下面是其中一个例子,它讲述了如何建立好的视觉层次结构:


视觉层次结构 — Refactoring UI(第 30-31 页)
展示调色板 — Refactoring UI(第 123-124 页)


导航栏示例说明“通过减弱来强调” — Refactoring UI(第 39 页)


这与 Scott McCloud 的 Understanding Comics 中的建议非常相似(一本关于设计和视觉思维的书籍,🌟推荐阅读),书中同样提到了“通过简化进行放大”的想法,也就是通过将用户界面精简到基本元素(或功能),来达到放大的目的。


Understanding Comics, by Scott McCloud


这本书还建议你在设计高保真之前先画草图,因为如果你在高保真环境中工作时是很难忽略细节的,画草图反而可以帮助你快速探索一系列不同的布局创意。


Refactoring UI(第 10 页)


• UI Design Books

02-实用的用户界面

Practical UI

私信获取书籍📚PDF


 ?  推荐指数:★★★★★ 

这本书介绍了很多基于逻辑的 UI 设计方法,并提供了一套明确的规则:“界面设计可能看起来像是一种神奇的艺术形式,但其中很大一部分是由逻辑规则或指南构成的。” 

你还可以与 Refactoring UI 配合阅读,因为除了视觉设计外,这本书同样也非常注重可用性和可访问性。比如,交互成本是用户体验和界面设计中的一个关键概念,它涉及用户完成任务所需的工作量。书中用一个很好的例子进行了说明:

“总交互成本为三次点击、一次滚动和一个小的鼠标移动”与“总交互成本仅为两次点击和一个非常小的鼠标移动”的对比⬇️


总交互成本 — Practical UI(第 20-21 页)


书中也包含了如何有节制和有目的地使用颜色来提高可用性的建议:

● 使用足够的颜色对比度,帮助有视力障碍的人清晰地看到界面细节;

● 不要仅仅依靠颜色来传达含义;

● 将品牌颜色应用于交互元素,让人们了解哪些是可交互的,哪些不是。


“尽量避免在非交互元素上使用品牌颜色。” — Practical UI(第 81 页)


这本书还分享了一些关于深色模式设计的技巧。例如,有一部分解释了如何创建深色调色板:


创建深色调色板 — Practical UI(第 99 页)


除此之外,还提到了摩擦设计的概念:

“在执行破坏性操作之前,你可以引入摩擦来防止人们错误地采取行动。通常情况下,这包括减少行动的突出性、将其移动到更远的位置或逐步披露。不要将动作标记为红色,因为这会使其更加突出。”


“让破坏性行为不那么突出,以防止人们错误地采取行动” — Practical UI(第 277 页)


Adham 强调:“指南可能看起来有一定的限制性,但它并不意味着限制了你的创造力。相反,应该把它们看作是一个坚实的基础,用来建立、探索和实验。”


• UI Design Books

03-UI专业人士的设计手册)

The UI Professional’s Design Manual (iOS + Android)


 ?  推荐指数:★★★★ 

这本书介绍了如何为 iOS 和 Android 创建移动应用。除了讨论如何选择颜色等原则和基础性的主题,书中还涵盖了这两个平台的对比,以下是一个例子:


二级导航 — The UI Professional’s Design Manual (iOS + Android)(第 233–234 页)


本书最大的价值之一是它附带了一个金融科技 UI 工具包,并介绍了使用该 UI 工具包创建移动应用程序的过程。


详细的设计指南和 UI 套件 — The UI Professional’s Design Manual (iOS + Android)(第 663–664 页)


除了实用技巧之外,本书的每个部分都包含一个理论部分,例如这里是配置文件设置章节的一些部分:


配置文件设置-理论 — The UI Professional’s Design Manual (iOS + Android)(第727–728页)


理论之后,还为你提供了一个循序渐进的教程:


Profile settings-practice — The UI Professional’s Design Manual (iOS + Android)(第741-742页)


• UI Design Books

04-UI设计系统的精髓)

UI Design Systems Mastery


 ?  推荐指数:★★★★ 

Marina Budarina 的 UI Design Systems Mastery 是一个实用指南,教你如何创建你的第一个设计系统。你将全面了解设计系统的构建方式,并学习到设计自己系统所需的关键步骤。

除了设计师身份外,Marina 还是一位软件工程师。这本书主要面向初学者,它易于理解,结构良好且轻量级,除此之外还有一个优势,就是它汇集和整理了一切你需要了解的内容。Marina 在每章的结尾处都加入了重要观点的摘要。


每章都以要点(和作业)结尾 — UI Design Systems Mastery(第 102 页)


这本书以循序渐进的方式解释了每个方面,例如,它解释了如何为你的设计系统创建令牌。


创建版式标记 — UI Design Systems Mastery(第 170 页)


你不仅会学到很多关于构建设计系统的知识,还会掌握很多 UI 设计知识,例如下面关于布局网格的部分:

固定和灵活布局网格的组合 — UI Design Systems Mastery(第 217 页)


• UI Design Books

05-设计用户界面)

Designing User Interfaces

私信获取书籍📚PDF


 ?  推荐指数:★★★★ 

这本书涵盖了许多成为一名好的设计师的相关内容,例如如何:

● 进行用户界面审计;

● 展示你的作品;

● 有效地与开发人员沟通;

● 开始一个设计项目。

如何开始设计项目 — Designing User Interfaces(第 427 页)


• UI Design Books

06-掌握UI设计元素)

Master UI Design Elements


 ?  推荐指数:★★★★ 

像 Refactoring UI 一样,这本 UI 设计书中以这样的建议开始:“如果你在高保真环境中工作时无法忽略细节,那就用纸和笔开始设计,并在那里勾勒出你的功能。”对于初学者来说,一个非常有用的技巧是始终在不同的视口尺寸上检查你的设计,在真实设备上进行测试。


“确保显示的文本足够清晰,并始终在真实设备上进行测试。” — Master UI Design Elements(第 182 页)




更多知识干货以及其他海外留学的资讯可以关注UXD交互工业产品设计分享或者添加小助手,还可获取讲座直播哦~

|福利大放送 | WELFARE 
对于设计初学者,完成从0开始创作几乎是不可能的,就像学习过程中书读百遍其义自见一样。有了大量的积累,才能在脑海里建立素材库,这些素材库能帮助同学们完成最初的设计想法积累,基于这样的基础再进行个性化的创作,最终才能做出高质量的作品集。全球院校最新作品集免费拿!添加小助手即可获取:

▲  顶级名校作品集参考

UXD交互工业产品设计学院是尤克斯国际旗下的一家专注于交互、服务、工业、产品设计专业的顶级设计学院。除了一对一设计课、基础技能课程、小组课题、设计评图、联合教学外,我们提供不定主题的公开课和内部小组课,教学计划课程由三大部分组成,包括基础软件技能教学、设计理论系统讲座、申请必备知识解析等。


本文版权归UXD尤克斯所有

部分图片来自于网络

如有侵权请与我们联系

无需任何设计背景!这些书籍让你轻松成为交互设计领域的UI设计高手!的评论 (共 条)

分享到微博请遵守国家法律