做交互设计久了，你会发现所有看似 "凭感觉" 的决策背后，都有一套经过验证的心理学和行为学原理在支撑。兰亭妙微在项目中反复参考 Jon Yablonski 整理的 Lawsofux——19 条易于理解、应用广泛的 UX 原则。今天我们把这 19 条原则做一个系统梳理，每条配上一句话的核心解读，方便大家随时查阅。

说起 UI 设计，就绕不开交互设计。交互设计定义的是人与系统之间交流的内容和结构，让双方互相配合、共同达成目标。兰亭妙微在多年的设计实践中，把交互设计的底层逻辑归纳为六大原则 —— 可视性、反馈、限制、映射、一致性、启发性。这六条不是空洞的理论，而是我们做每一个项目时的自检清单。

兰亭妙微ui设计公司分享：近年已有不少完整落地项目由 AI 辅助完成，部分网站甚至可以实现产品 360° 交互预览，细节放大查看，技术的迭代正在重塑互联网行业的工作模式。

过去二十年间，互联网行业有着清晰分工：产品、研发、设计、用户研究各司其职，组成团队协作产出产品。 这套模式成立的底层逻辑，是落地实现的门槛很高，高度依赖专项技能。行业为此搭建了成熟的晋升路径，从初级、高级到专家，大家沿着专业赛道稳步向上成长。

但 AI 大幅降低了落地执行的成本。当 1‑2 个人，借助工具就能完成过去 6 个人的工作量，传统岗位分工正在遭遇拷问。 Julie 提出核心观点：AI 浪潮之下，无论身处哪个岗位，我们都要完成身份转变，成为一名「构建者（builder）」。

跳出岗位局限：学会调动资源，推动结果落地

成为构建者，不等于要求你精通全部技能，而是重塑做事思维。

旧模式里，我们习惯边界化工作：“我只负责自己模块，其余交由他人处理”。 如今 AI 可以写代码、生成文案、完成数据分析，个体完全有机会把一个想法，完整推进至落地。你的身份，不再是流水线当中的一环，而是整件事的主导者。

转变包含两个层面： 第一，心态转变 过去遇到职责外工作，第一反应是 “这不归我管”。而构建者的思考逻辑是：想要达成目标，目前还欠缺什么？我能否借助 AI，或是联动伙伴补齐缺口？ 关注点从「我的岗位要做什么」切换为「这件事如何才能做成」。

第二，能力定位转变 不要被岗位标签定义自我，聚焦你的真实能力：有的人拥有顶尖视觉能力，有的人擅长梳理复杂系统，有的人擅长从 0 到 1 开拓新项目。 认清自己的核心长板，以优势为根基，借助 AI 与他人协作补足短板。

简言之，过去比拼的是单一专业的深度；而当下，更考验整合全部资源，交付完整成果的能力。专业功底依旧是立身之本，但仅有手艺，已经不足以应对时代变化。

执行交给 AI，判断力才是核心竞争力

如今 AI 足以输出大量中等偏上水平的成果，方案的执行门槛被抹平。但甄别优劣、洞察问题、指明优化方向的判断力，成为人的核心价值。

该怎样打磨这份专业判断力？

1. 找到一线实战高手：锁定那些深耕 AI 实践、熟用各类工具，并且产出优质作品的从业者。
2. 深度拆解作品：不只是浅层浏览效果，要深挖背后的设计逻辑、完整工作流，理清创作者的思考重心。
3. 主动寻求专业反馈（最关键）：在内心建立一套好坏评判标准，带着自己的作品向高手请教，借由外部反馈迭代认知。

就好比请毕加索点评画作，不是远远仰望，而是拿出自己的作品，在反馈中实现自我成长。

拒绝纸上谈兵，一定要亲自下场实践

Julie 反复强调一个认知：不亲手实操工具，就不可能真正理解 AI。

她的观点十分直白：如果连当下技术的能力边界都不了解，很难称得上是 AI 时代优秀的设计师、产品人。行业认知无法靠读文章、听播客获得，必须亲身实操。

她本人便是如此：写代码会逐一测试 Cursor、Claude Code、v0、Lovable；会议记录依靠 Granola；数据分析使用自家产品 Sundial。 对待工具，她像面试候选人一般，逐一测评，不为追逐新潮，只为摸清每个工具的优势、短板，清楚什么任务适合交给哪款工具。

有一个很值得反思的细节：即便本身写作能力很强，Julie 依旧强迫自己切换到 AI 协作的写作模式。

人天然会依赖顺手的旧流程，越是自己擅长的领域，越抗拒改变。但恰恰是这些熟门熟路的工作方式，最容易让人停滞不前。固守旧有习惯，就很容易被善用新工具的同行超越。

道理简单朴素：不要只停留在围观讨论，把 AI 嵌入日常工作流，哪怕初期体验别扭。实操越多，越懂 AI 的能与不能，也更明白个人努力该投向何方。

管理不再是管理者专属，而是每个人的基础能力

这是一个容易被忽略的洞察：管理，正在从少数人的岗位职能，变成全员必备基本功。

经典管理模型包含三大要素：目标、人、流程。这套框架在 AI 时代依旧成立，只是资源对象发生变化。

过去，我们主要的协作资源是团队同事；现如今，AI 模型已经成为重要的 “团队成员”。 不同模型各有所长：部分擅长代码编写，部分擅长文案创作，部分擅长处理复杂数据。我们需要像管理团队一样用好 AI。

工作逻辑就变成管理者思维：明确项目目标；将合适的任务分配给适配的 AI 模型；理顺整体协作流程，让人与 AI 协同完成任务。

过去专属于领导力的各项能力，不会被 AI 替代，反而成为每个职场人的必修课。

结语

看完这些思考，未必能完全消解焦虑，但可以理清方向。 AI 替代的是重复执行工作，却夺不走人的判断力，以及从构思到落地的完整闭环思考能力，而这正是设计、产品工作最内核的价值。

不必过度纠结被 AI 取代的风险，做好两件事即可：持续打磨辨别好坏的专业眼光；跳出口头谈论，实实在在把 AI 运用到工作当中。

转载：优设

兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。

全文速览

兰亭妙微ui设计公司分享：AI 设计工程化，核心是从交付静态设计稿，升级为直接交付可落地的工程代码，尤其适配页面结构标准化、组件高度复用的 B 端业务场景。整套工作流有 5 个关键转变：

1. 交付物革新：不再输出设计稿，直接产出工程代码，消除设计到开发的二次翻译损耗
2. 流程自动化：把设计师与 IDE 反复沟通的环节沉淀为 SOP‑Skill，降低人工交互成本
3. 质量设计驱动：按照「业务流程→页面框架→组件复用→全局样式」的设计思维组织 Skill，引导 AI 生成符合业务逻辑的页面
4. 规范分层维护：Design Token、布局、基础组件统一托管；各业务线独立维护业务专属规范，避免上下文膨胀
5. 设计师把控质量：AI 是加速器，标准页面目标达成 80‑90% 提效，但模型幻觉与能力边界客观存在，设计师不能缺位质量校验

一、背景：AI 时代，B 端设计师还只能输出设计稿吗？

随着大模型快速普及，很多团队都在尝试用 AI 提升设计产能，但 AI 对不同类型需求的价值截然不同：

• 标准型需求：页面结构固定、组件复用率高、视觉自由度低、业务链路稳定，AI 理解效果最好，适合规模化提效；
• 定制 / 创意型需求：无统一范式、高度依赖业务定制，AI 更多用于发散思路、启发创意，很难直接产出终版交付物。

以淘宝闪购商家 B 端推广业务为例，业务月均 20 个需求，72% 都属于标准型页面，需求密度高、重复模式多，非常适合落地 AI 设计提效。这也抛出一个行业思考题：AI 浪潮下，设计师的产出是否可以跨过设计稿，参与到代码落地环节？本次实践就是围绕这个命题展开的实战探索。

二、技术选型：为什么选择 AI 设计工程化？

市面上 AI 赋能 UI 一共有 4 条主流实现路径，彼此核心差异在于最终交付产物：

表格

重点区分：HTML 更偏向模型输出的 “效果图”，而 React 工程代码是可直接参与项目迭代的真实产物。

AI 设计工程化两大核心优势

1. 强标准化：设计师交付产物直接对接业务代码库，研发可直接复用，省去设计稿、HTML 到工程代码的二次转译环节；
2. 高效降沟通成本：规避标注、切图等重复劳动，页面还原度接近 100%，设计‑研发之间的还原走查沟通趋近于零。

三、落地全流程：完整跑通 AI 设计工程化

整套落地分为五大阶段：

1. 前期准备：安装基础 Skill、业务流程 SOP‑Skill；
2. 仓库准备：创建设计代码仓库，创建业务开发分支；
3. 业务理解：输入 PRD 并转为结构化文档，确认 AI 对业务理解无误；
4. 一键生成设计：依据 PRD 与 Skill 驱动 AI 生成页面，完成双重 AI 校验，人工验收页面效果；
5. 推送交付：推送代码至目标分支，完成构建，交付可用代码与设计产物。

四、落地两大核心难点与解法

难点 1：全新协作模式，设计师能力边界发生变化

传统模式设计师输出效果图，而 AI 工程化模式下，设计师需要触达下游实现环节，完成从 “交付图纸” 到 “交付代码” 的转变。实践中设计师会额外承担约 30% 原属于前端的工作，带来两类痛点：

1. 不熟悉全新工作流，不知道如何推进项目；
2. 高度依赖设计师与 IDE 多轮对话，反复调试，整体效率偏低。

✅ 解决方案：联动研发沉淀SOP‑Skill，把完整流程固化，实现流程自动化，降低普通设计师上手门槛，提升工程部署效率。

难点 2：AI 生成质量不可控，如何稳定输出？

核心思路：用设计师的思考逻辑定义 Skill，搭建高质量生成框架，沉淀可复用经验。

1. 内容层：复刻设计师思维路径 设计师处理需求的完整链路：理解业务→梳理业务流程→确定页面框架→选用对应组件→对齐全局样式规范。把这套链路抽象为「业务流程‑页面框架‑组件使用‑全局样式」四步，作为 Skill 的底层逻辑，同时调研多款 AI‑UI 工具，摸清模型能力边界。
2. 框架层：轻量简洁原则 初期设想父子嵌套多层 Skill，但是层级复杂会干扰 AI 理解。最终收敛为单设计 Skill，遵循轻量、渐进式信息披露的设计原则。
3. 资产共建维护机制，规避上下文爆炸 不把所有业务规范塞进同一个 Skill，避免文件膨胀。

• 统一维护：Design Token、布局规则、基础组件、基础模板这类通用资产；
• 业务规范：交由各业务设计师独立维护，各司其职，兼顾通用性与业务差异化。

五、业务数据结果与未来展望

针对 B 端推广标准页面，本次实战拿到明确提效结果：

• 设计侧整体提效 51%：其中设计输出环节提效 40%，还原走查环节提效 90%；随着设计资产持续完善、设计与前端持续磨合，标准页面还有更大提升空间；
• 研发侧整体提效 38%：研发无需手写样式代码，可以聚焦后端业务逻辑；代码输出环节提效 25%，走查还原环节提效 90%。

团队长期目标：标准型页面实现80‑90% 设计提效，持续迭代优化。同时需要客观看待 AI 的局限：受限于模型能力与幻觉问题，现阶段无法完全替代设计师，质量把关依旧必须由人完成。

新模式对设计师的能力新要求

1. 更体系化的设计思维：跳出感性经验，学会分层拆解业务与界面；
2. 更全栈的产品能力：向前做架构设计，向后掌握基础代码认知，实现自我闭环；
3. 主动解决问题意识：不能被动等待研发排期，主动保障业务最终用户体验。

AI 是强大加速器，而非替代者。设计工程化不是让设计师写前端，而是让设计资产真正以代码形态流入产品生产链路。

转载：优设

兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。

做中后台系统的设计师，经常面临一个尴尬：C 端产品拼颜值、拼创意，后台产品拼的却是 "信息密度" 和 "操作效率"。同样的设计手法，用在 C 端是加分，用在后台可能就是灾难。

画原型只是最终的输出手段。交互设计的真正价值，在于把一个模糊的业务需求，一步步转化为用户可以顺畅操作的界面。这个过程有清晰的方法论，不是凭感觉画出来的。

经常有人问兰亭妙微的设计师："你们做交互设计，每天到底在干什么？是画原型吗？"

画原型只是最终的输出手段。交互设计的真正价值，在于把一个模糊的业务需求，一步步转化为用户可以顺畅操作的界面。这个过程有清晰的方法论，不是凭感觉画出来的。

很多人觉得运营活动页就是 "堆商品、放红包、写大字"，视觉够热闹就行。但兰亭妙微在做了大量运营项目后发现：活动页的转化高低，视觉风格只是表层，真正决定效果的是交互设计 —— 用户进来后知不知道往哪走、愿不愿意往下逛、最后会不会下单和分享。

登录界面，大概是每个产品里最 "不起眼" 却又最关键的页面之一。说它不起眼，是因为几乎每个 APP 都有，设计师往往照着竞品抄一个就完事；说它关键，是因为它是用户进入产品的第一道门 —— 登录体验差，用户可能连门都不想进。

做中后台和移动端设计的人，对导航栏再熟悉不过了 —— 顶部那一条，放标题、放返回、放操作按钮，似乎是天经地义的事。但兰亭妙微在项目中发现，很多设计师把导航栏当成了一个 "必须存在的静态容器"，不管什么页面都原样套上去，结果该沉浸的不沉浸、该突出的不突出。