给开发者的设计
注意:正如您将在下面看到的,本模块目前仅为课程大纲/教学大纲。在时间允许的情况下,我们计划将来将其转换为完整的课程。
本模块的目的是(重新)向开发人员介绍设计思维。他们可能不想成为设计师,但拥有一些基本的**用户体验**和设计理论对所有参与构建网站的人都有好处,无论他们的角色是什么。至少,即使是最技术性的、“非设计师”开发者也应该理解设计简报,了解事物的设计原因,并能够进入用户的思维模式。这将帮助他们让自己的作品集看起来更好。
此外,前端开发人员经常负责项目中各种设计方面的工作。客户和雇主经常认为他们可以做到这一点,因为他们参与了网站的视觉元素。历史上,“Web 开发者”曾经比现在更像是一个混合了设计师/开发者的角色。
预备知识
课程
基础设计理论
学习成果
- UI 设计基础
- 对比度。
- 排版。
- 视觉层次。
- 比例。
- 对齐。
- 空白的使用。
- 色彩理论。
- 图像的使用。
资源
以用户为中心的设计
学习成果
- 理解我们所做的一切都是为了用户。
- 用户研究/测试入门,以及用户需求。
- 为可访问性而设计 — 考虑目标受众以及他们可能有的额外需求。从一开始就为他们进行设计。
- 理解设计模式是什么,以及 Web 上常用的模式,例如
- 暗黑模式。
- 面包屑导航。
- 卡片。
- 延迟/惰性注册。
- 无限滚动。
- 模态对话框。
- 渐进式披露。
- 表单/注册/设置中的进度指示。
- 购物车。
资源
设计简报
学习成果
- 使用设计语言,与设计师沟通。
- 解读设计简报要求以实现一个项目。
- 设计师用来向开发人员传达信息的典型工具(例如 Figma)。
另见
- 学习 UI 设计基础,Scrimba 课程合作伙伴
- 设计之形,Frank Chimero
- 为 Web 而设计,Mark Boulton
- Web 设计,Prisca Schmarsow + 其他贡献者
- 实用排版,Matthew Butterick
- Web 风格指南,Patrick J. Lynch 和 Sarah Horton
- 可以始终安全遵循的视觉设计规则,Anthony Hobday
- 16 条细微的 UI 设计规则,却能带来巨大影响,Adham Dannaway