小程序怎么才好用？15个交互名词看图懂
文章以模拟的Punk咖啡馆点单小程序为例，图文讲解15个常见交互名词：导航栏、TabBar、页内Tabs、卡片、单元格、按钮、点击热区、表单校验、选择器、轻提示、对话框、操作面板、骨架屏、空状态与错误状态、无障碍。沿“选咖啡→选规格→加入购物袋→确认订单”的完整点单路径，说明每一步页面应有的回应，如选中状态、数量与总价更新、加载与失败提示等。最后强调提交后要区分等待、失败和结果不明三种情况，结合服务端幂等防止重复下单，并给出用AI按业务补齐交互的模板。
全部文档 / 标签: UI组件
6 篇
两个网站和两个 Skills，拯救你的 vibe coding 审美
文章针对 AI 编程生成的网页千篇一律（紫色渐变、圆角卡片、Inter 字体等）的问题，推荐四个工具：getdesign.md 提供现成网站的 DESIGN.md 设计参考，让 AI 按指定风格编写；libraries.dev 提供 UI 效果库，可直接复制 prompt 添加视觉组件；Impeccable 是项目完成后的设计审查 Skill，可对页面做 polish、audit、critique 等操作；OpenDesign 是本地优先的设计 Agent 工作空间，强调设计系统和资产复用。作者强调 vibe coding 不等于把审美外包给 AI，颜色、留白和取舍仍需人做决定。
写代码这关程序员大多都能趟过去，真正把人卡住的难道是审美
作者认为写代码对程序员来说不是难题，真正卡住人的是审美——界面丑到连自己都不想打开。他分享了偷懒招数：把顺眼的 UI 组件当积木，丢给 AI Agent 自己翻、挑并塞进项目。文章推荐了 5 个 UI 组件资源网站：Beautiful UI、BeUI、Rare UI、Transitions 和 shadcn/ui，链接可直接扔给 Claude Code、Codex 等编码 Agent，让它们自动扒组件、抠代码、调样式并集成到项目中。作者强调不需要懂设计，只要知道在哪里能淘到好看的组件就够了。
不会前端设计没关系会抄作业就行
文章指出程序员最缺的往往不是代码能力而是审美，提出将优秀 UI 组件当作乐高，直接交给 AI Agent 挑选并整合进项目的方法。作者推荐了 5 个 UI 组件资源网站：Beautiful UI、BeUI、Rare UI、Transitions 和 shadcn/ui，只需把链接发给 Claude Code、Codex 这类 Agent，让它们自动查找组件、获取代码、修改样式并整合进项目。核心观点是：你不需要成为设计师，只需要知道去哪里找好设计。
Nexus Dashboard 4.1 发布
daisyUI 团队发布 Nexus Dashboard 4.1，包含 8 种仪表盘布局（CRM、电商、Gen-AI、增长、AI Ops、财务、SRE、安全运营）、落地页、文件管理器与聊天应用布局、Gen-AI 应用页面、认证页面等，并提供 15+ UI 区块、50+ 布局示例、100+ 交互示例及 10 个额外仪表盘模板，支持 HTML、React、Next.js、SvelteKit 等多种技术栈。
Vibe Coding 视觉词典（上篇）：布局、页面结构、导航与常用组件
文章针对 AI 做网页时指令模糊的问题，提出了“视觉词典”概念。通过拆解页面布局、结构、导航和组件四个层级，提供了 26 个具体的网页设计模式（如 Bento Grid、Masonry Layout、Sticky Navbar）。每个词条包含概念说明、适用场景及可直接复制给 AI 的提示词，旨在帮助用户更精准地指挥 AI 生成高质量的网页设计。