COURSE 05 · 移动端设计

移动端页面设计教学

共 8 章节 约 126 分钟 进阶

超过六成流量来自手机,移动端不再是 PC 的缩水版。本课从设备特性与触控逻辑出发,拆解移动端栅格、导航模式、字体行高、图片性能与表单设计,建立"移动优先"的设计思维,让小屏体验同样精致高效。

移动端页面设计教学课程封面
CHAPTERS

课程章节目录

八个章节从设备特性到响应式策略,系统掌握移动端设计的核心要点。

01

移动端设计基础:设备、分辨率、密度

搞懂逻辑像素与物理像素、设备像素比 DPR,理解为什么设计稿要按 2x/3x 出图,告别模糊与失真。

15 分钟入门
02

移动端栅格与单列布局

小屏空间有限,单列为主的布局策略,掌握边距、列宽与模块间距的设定,让信息密度与呼吸感平衡。

16 分钟中级
03

触控交互:热区、手势、反馈

手指不是鼠标。44px 最小热区、常用手势与触控反馈设计,让操作既好按又有清晰的即时反馈。

16 分钟中级
04

移动端导航模式

底部 Tab 栏、抽屉式导航、顶部返回的适用场景,让用户在小屏上也能快速切换和回退。

16 分钟中级
05

字体与行高在移动端的调整

小屏阅读更吃力,正文字号、行高、字间距的移动端调优,让长内容在手机上同样耐读不疲劳。

15 分钟进阶
06

图片与性能:懒加载与适配

移动网络与性能敏感,图片懒加载、响应式图片源、压缩与格式选择,兼顾清晰度与加载速度。

16 分钟进阶
07

移动端表单设计

表单是转化的最后一公里。输入框、键盘类型、错误提示的移动端优化,降低填写摩擦提升提交率。

16 分钟进阶
08

从移动优先到响应式策略

移动优先的设计思路,断点规划与渐进增强,让一套设计在手机、平板、桌面间平滑过渡。

16 分钟高阶

移动端之外,再练两种主流风格

简约风与营销页,覆盖品牌官网与转化页两大场景