很多人学UI设计，卡在同一个地方：看教程都会，打开软件就不知道从哪下手。图层怎么分层、间距怎么给、卡片圆角多少、列表和宫格什么时候用——这些问题没做过几个完整页面，光看理论是补不上的。「生活圈」这类产品正好是个练手的靶子：页面结构不复杂，但该有的模块一个不少，一个人也能从头搭到尾。

这门课是UI基础阶段的实操训练，不铺开讲设计史和配色理论，就盯着一个事——把常见的生活圈页面从零搭出来。如果你临摹过图标、练过单个组件，但还没独立完成过一整套页面，缺的就是这一环。

先说清楚：它不解决什么

别指望靠它补交互逻辑、动效或产品思维。课程范围就是页面搭建本身：布局、层级、间距、视觉规范。如果你现在的问题是「图标画不好」「配色没感觉」，这门课帮不上，得先回去补基础造型和色彩。反过来说，如果你已经能临摹出单个漂亮组件，但把它们拼成一个页面就乱，那对得上。

要练的核心能力

页面拆解：拿到一张参考稿或需求，判断该用列表、宫格还是卡片流，而不是凭感觉堆元素。
布局控制：间距体系、对齐方式、安全边距怎么统一，避免每个模块各写各的数值。
视觉层级：标题、正文、辅助信息、按钮之间怎么拉开主次，让人一眼看到重点。
规范落地：颜色、字号、圆角这些变量怎么在搭建过程中保持一致，而不是做到后面全乱。

这几项单独看都不难，难的是同时顾及。课程的价值就在把「生活圈」这种信息密度适中的场景拆开，让你在具体页面里练判断，而不是背规则。

练的时候重点盯哪里

做这类页面最容易翻车的地方有三个。一是顶部区域：状态栏、导航、搜索、轮播叠在一起，很多人做到这里就开始随手给高度，结果和下方内容对不齐。二是信息流卡片：头像、昵称、时间、正文、配图、互动按钮全挤在一块，层级一乱就变成一团灰。三是底部导航和操作区：是不是留够点击区域，和内容区有没有视觉冲突。

练的时候建议别光看成品，做完一个模块就停下来问自己：这个间距是拍的还是按体系来的？换个内容长度会不会崩？带着这种检查习惯做，比多临摹十张图有用。

看完应该能回答的问题

给你一个生活圈首页的需求，你能说清每个模块为什么这样排吗？
页面里出现三种相近的灰色，你能判断是规范问题还是层级问题吗？
如果内容数量从三条变成三十条，你的布局还站得住吗？
别人给你一张更好的参考，你能说清它好在哪、自己差在哪吗？

能答上来，说明这一轮演练真的过了一遍手，而不只是看了一遍。答不上来的那个问题，就是下一步该补的地方。