CHAPTERS
课程章节目录
八个章节循序渐进，从思维建立到设计系统落地，完整覆盖网站 UI 设计核心。
01
从平面到界面：UI 设计的思维转换
理解网页 UI 与传统平面的本质差异，建立以用户任务为中心的界面思维，认识屏幕、分辨率与视口对设计的约束。
02
视觉层级与信息架构
用大小、色彩、间距、对比构建清晰层级，让用户在三秒内捕捉到页面重点，避免信息平铺带来的视觉混乱。
03
网页栅格与布局骨架
12 栏栅格的实战应用，掌握列宽、间距、安全边距的设定逻辑，用栅格约束让多页面保持一致的呼吸节奏。
04
组件规范入门：按钮、卡片、表单
从最常用的三类组件切入，定义尺寸、状态、间距规则，体会"统一之道"如何降低后期维护与沟通成本。
05
色彩与字体在 UI 中的运用
主色、辅助色、中性色的角色分工，字号阶梯与字重搭配，用色彩字体建立可识别的品牌视觉语言。
06
图标与插画系统
线性、面性、双色图标的选择与统一，插画在空状态、引导页中的运用，用图形强化而非干扰信息传达。
07
交互状态设计
默认、悬停、点击、聚焦、禁用、加载六种状态的视觉表现，让界面在每一次操作中都给出明确反馈。
08
设计系统搭建：从组件库到设计令牌
把零散组件收敛为设计系统，用颜色、字号、间距令牌（Token）驱动全局一致性，为多人协作与开发对接打好地基。