2026-08-25 00:00:00
Moonvy 月维是一款面向设计团队的设计资源管理与交付工具。
它可以把设计文件、设计交付、团队协作和版本管理放在同一个地方完成。设计师可以从 Figma、Sketch、即时设计或 Photoshop 上传设计资源，产品和开发成员则可以直接查看设计图、标注、切图和代码。
本文按照月维目前的产品页面整理主要功能、套餐信息和插件支持情况。价格和套餐权益可能会调整，具体以官网价格页当前显示为准。
| 功能模块 | 主要能力 | 适合场景 |
|---|---|---|
| 设计交付 | 设计图标注、图层查看、尺寸与样式查看、代码查看 | 设计师向产品和开发交付设计稿 |
| 切图导出 | 多格式切图、重复切图识别、PNG 压缩、复制 SVG 代码 | 下载图片资源和前端开发 |
| 文件管理 | 多种格式在线预览、多级文件夹、文件属性、标签和颜色检索 | 归档和查找团队设计资产 |
| 视图管理 | 图标视图、画布视图等多种方式查看文件 | 整理设计稿、素材和项目文件 |
| 团队协作 | 评论、备注、在线成员、文件分享、附加链接 | 方案评审和日常沟通 |
| 团队管理 | 成员邀请、项目管理、权限设置、项目动态 | 管理不同项目和协作成员 |
| 个性化设置 | 黑夜模式、缩放习惯、剪贴板上传、复制图片到剪贴板 | 按个人习惯使用月维 |
月维的设计交付功能主要服务于设计师、产品经理和开发者之间的协作。
| 交付功能 | 说明 |
|---|---|
| 设计图标注 | 查看图层尺寸、位置、间距、颜色、字体、填充、描边和投影等信息 |
| 图层查看 | 显示图层结构和图层轮廓，快速理解页面布局 |
| 代码查看 | 根据设计图查看多种代码格式，方便工程师实现页面 |
| 自动布局与变量 | 识别 Figma 自动布局和设计变量等信息 |
| 切图导出 | 支持多种切图格式，并可切换设计倍数和开发平台单位 |
| 图片优化 | 对 PNG 切图进行压缩，减少资源体积 |
| SVG 代码 | 无需下载文件，直接复制 SVG 代码 |
在查看设计标注时，可以根据开发平台切换代码类型：
| 开发平台 | 支持的代码类型 |
|---|---|
| Web |
CSS、CSS in JS、CSS in HTML、Tailwind、UnoCSS
|
| Android |
Android XML、Android Compose
|
| Apple |
iOS SwiftUI、iOS UIKit Swift、iOS Objective-C
|
| 跨平台 |
Qt Style Sheets、Qt QML
|
月维不只是一次性的设计交付工具，也可以用来长期管理团队设计资源。
| 场景 | 月维提供的能力 |
|---|---|
| 资源归档 | 图片、视频、动画、PSD、AI、Sketch、Figma 等资源可以集中管理 |
| 文件查找 | 使用文件夹、标签、颜色和多种视图快速定位资源 |
| 版本管理 | 保留设计图历史版本，方便查看更新记录和恢复旧方案 |
| 文件预览 | 直接在浏览器中预览图片、视频、动画、Word、Excel、PPT 和部分设计源文件 |
| 方案评审 | 给文件添加评论、备注和外部链接，保留讨论过程 |
| 客户分享 | 通过分享链接和访问密码，让未注册用户查看设计方案 |
| 团队协作 | 邀请成员加入项目，按不同权限参与上传、编辑、下载和交付 |
| 文件类型 | 支持格式 | 查看说明 |
|---|---|---|
| 图片 |
PNG、JPEG、BMP、SVG、TIFF、ICO、AVIF、JXL、WebP、HEIC、TGA
|
在线预览图片 |
| 动画 |
GIF、Lottie JSON、RIV、PAG
|
在线预览动画效果 |
| 办公文档 |
DOC、DOCX、XLS、XLSX、PPT、PPTX
|
在线预览 Word 文档、Excel 表格和 PowerPoint 演示文稿 |
| 设计源文件 |
PSD、AI、FIG、XD、SKETCH
|
支持预览缩略图 |
| 视频 |
MP4、WebM
|
能否播放取决于浏览器支持情况 |
| 骨骼动画 | Spine 2D |
在线预览骨骼动画，并查看动作与 Skin |
| Axure 原型 | Axure 导出的 HTML 文件 | 支持托管并查看原型交互 |
以下价格按官网目前的年度套餐信息整理。价格可能因活动、支付方式或产品调整发生变化，购买前请以月维价格页为准。
| 套餐 | 协作成员 | 访客数量 | 团队容量 | 价格参考 |
|---|---|---|---|---|
| 免费版 | 10 人以内 | 50 人 | 1 GB 起 | 免费 |
| 专业版 | 20 人 | 100 人 | 40 GB 起 | ¥69 / 人 / 年 |
| 企业版 | 21 人及以上 | 500 人 | 100 GB 起 | ¥188 / 人 / 年 |
| 个人大会员 | 仅限(免费团队) + 1 人 | — | + 10 GB | ￥159 / 年 |
| 类型 | 可以做什么 | 是否占用协作成员额度 |
|---|---|---|
| 协作成员 | 上传、编辑、下载资源，查看标注并生成代码 | 是 |
| 访客 | 浏览团队资源和设计内容 | 否 |
如果一个成员只需要查看设计稿，不需要编辑、下载资源或生成标注代码，可以将其设置为访客，从而减少团队的协作成员占用。
月维支持单独购买容量包。容量包适合团队成员数量不变，但设计文件、视频或源文件不断增加的情况。
容量包支持叠加使用，可以根据团队实际需要分次购买。作为参考，1 GB ≈ 1600 张 APP 设计图，实际数量会因设计图尺寸和文件大小有所不同。对于大多数团队来说，20 GB 容量包是更推荐的选择，通常可以满足日常设计资源、视频和源文件的存储需求。
| 容量包 | 适合场景 | 价格 |
|---|---|---|
| 2 GB 容量包 | 补充少量设计资源空间 | ￥39 / 年 |
| 20 GB 容量包 | 推荐大多数团队使用，存储较多设计源文件、视频和项目资料 | ￥299 / 年 |
月维通过插件连接设计工具和在线交付空间。设计师可以在熟悉的设计工具中上传设计图，再在月维中完成标注、切图和代码查看。
| 设计工具 | 插件状态 | 支持情况 | 入口 |
|---|---|---|---|
| Figma | 已支持 | 上传设计图并进行设计交付 | 安装 Figma 插件 |
| Sketch | 已支持 | 支持 Sketch 72 及以上版本 | 下载 Sketch 插件 |
| 即时设计 | 已支持 | 在即时设计中上传设计稿到月维 | 安装即时设计插件 |
| Photoshop | 已支持 | 支持 Photoshop 2024（v25）及以上版本 | 下载 Photoshop 插件 |
插件的具体安装方式和版本要求，建议前往月维插件下载页查看。
| 步骤 | 参与者 | 操作 |
|---|---|---|
| 1 | 设计师 | 在 Figma、Sketch、即时设计或 Photoshop 中完成设计 |
| 2 | 设计师 | 使用月维插件上传设计稿和资源 |
| 3 | 产品经理 | 在月维中预览设计方案并添加评论或备注 |
| 4 | 开发者 | 查看尺寸、颜色、字体、切图和代码信息 |
| 5 | 团队成员 | 通过版本记录追踪修改，并在同一个项目中持续协作 |
| 使用情况 | 推荐选择 | 原因 |
|---|---|---|
| 个人使用，偶尔交付设计稿 | 免费版或个人大会员 | 先使用基础功能，空间不足时再增加容量 |
| 10 人以内的小团队 | 免费版 | 免费使用主要协作能力，适合设计师、产品和开发组成的团队 |
| 11–20 人、需要稳定协作的团队 | 专业版 | 专业版从 11 人起，增加协作成员和团队容量，适合持续交付项目 |
| 21 人及以上、资源量较大的团队 | 企业版 | 支持更多成员和更大的团队资源空间 |
如果你正在寻找一款可以同时完成设计资源管理和设计交付的工具，可以先从免费注册月维开始，再根据团队规模和存储需求选择合适的套餐。
2026-08-25 00:00:00
10 人以内团队，目前可以免费使用月维。
对于还处在早期阶段的团队，可以先使用基础的项目管理、设计交付和资源协作能力。
团队本身就会不断变化：今天可能只有 3 个人，下个月加入一名前端，过一段时间又增加一名产品经理。
团队可以根据成员规模、存储空间和项目需求，逐步选择适合自己的服务方案。
这也是月维目前坚持的方式：
先让小团队把项目跑起来，再根据实际需求逐步升级。
如果你还没有使用过月维，可以把它理解为一个：
设计资源管理 + 设计交付 + 团队协作工具。
除了查看设计稿、标注、切图和查看代码，月维还希望解决一个长期存在的问题：
很多团队的设计资源分散在电脑、网盘、聊天记录、设计工具和各种临时文件夹中。
时间一长，就容易出现这些问题：
所以，月维从一开始就不只是关注「把设计稿交付出去」，也希望帮助团队长期整理和沉淀设计资产。
目前，月维可以统一管理：
图片、PSD、AI、Sketch、Figma、Word、Excel、PPT、视频、动画等多种设计资源。
很多设计源文件还可以直接查看缩略图和文件信息，不必每次下载到本地再打开确认。
设计稿上传到月维后，可以直接完成：
标注、切图、代码查看、颜色与变量查看、历史版本管理等操作。
设计和开发之间，不必再为了一个尺寸、一张切图或一段样式代码反复沟通。
设计稿更新后，历史版本也会继续保留。
谁改了什么、哪个版本是之前的方案，都可以继续追溯。
简单来说：
从设计资源管理到设计交付，团队可以在同一个地方完成协作。
除了团队内部协作，月维也支持多种分享方式。
比如「密码分享」可以把设计灵感、设计方案和 Demo 直接分享给客户或其他协作者。
对方无需注册月维账号，打开链接并输入访问密码即可查看。
对于客户预览、方案评审和临时分享等场景，会更加方便。
很多真正需要设计协作的团队，其实并没有那么大。
比如，一个典型的小型产品团队可能包括：
一共 8 个人。
在月维里，这样的团队目前依然可以免费使用。
团队可以创建项目、整理设计资源、上传设计稿、进行标注和切图，也可以邀请成员一起协作。
免费版可以满足小团队日常的资源管理、设计交付和团队协作需要。
当然，随着团队规模扩大，对存储空间、权限管理、协作人数和服务能力的需求也会增加。
到了那个阶段，再根据实际规模选择合适的付费方案，是很自然的事情。
但在团队还只有几个人时，我们更希望大家先把工具用起来：把项目跑起来，把设计资源管理起来，等团队真的长大了，再考虑更大的方案。
这也是月维目前对团队定价的基本思路：团队可以慢慢长大，成本也应该逐步增加。
如果你正在寻找一款可以同时完成设计资源管理、设计交付和团队协作的工具，可以试试月维。
10 人以内团队，目前免费使用。
不只是完成一次设计交付，也可以把散落在各个地方的资源，慢慢整理成真正属于团队的设计资产。
如果你想进一步了解月维的完整功能、套餐价格和适用人群，可以继续阅读：《月维是什么？功能、价格与适用人群一篇讲清楚》。
2026-08-24 00:00:00
Figma Make 最近加入了更接近传统设计工具的可视化编辑方式。选中预览中的元素后，可以直接在属性面板里调整间距、字号、行高、圆角、透明度、层级和边框等属性，修改结果会先暂存在聊天框中，确认后再应用到代码里。
如果是交互、动效或需要结合上下文的修改，则可以使用「Annotate for agent」在画面上圈出目标，再直接描述希望发生的变化，例如 hover 放大、延迟出现或点击后的过渡。属性面板适合精确调整视觉参数，标注则更适合把意图交给 Agent 执行，两种方式可以组合使用。
目前这项能力正在逐步开放，属性面板只适用于新建的 Make 文件，应用修改会消耗 AI credits。
官方介绍：https://www.figma.com/blog/properties-panel-and-annotations-now-in-figma-make/
使用文档：https://help.figma.com/hc/en-us/articles/42009840449175-Edit-a-Figma-Make-file
OpenPencil 是一款开源的 AI 原生设计编辑器，它把设计文件当作可读、可查询、可修改的节点树，而不只是一个只能在特定软件里打开的画布。项目支持导入 Figma .fig 文件，并提供桌面端、网页端、CLI、MCP Server 和 Vue SDK。
它的有趣之处在于：设计师可以在画布上编辑，脚本可以批量修改 Token，AI Agent 也可以通过同一套操作创建和调整界面。CLI 还能检查、查询、分析、导出和转换设计文件，适合想把设计文件纳入代码工作流的团队。项目采用 MIT 协议，桌面端体积也比较轻。
GitHub：https://github.com/open-pencil/open-pencil
Motion UI 是 Motion 团队新推出的 React 动效组件库，提供可以直接组合到页面里的 Hero、通知、页面过渡和数字动画等组件。它可以通过 Motion+ MCP、AI 适配提示或 shadcn CLI 安装，比较适合已经在使用 React、Tailwind 和 shadcn/ui 的项目。
它没有把动效当成散落在各个组件里的参数，而是提供了一个统一的 motion.theme.ts，用 snap、ui、gentle、lively 和 ambient 等语义化名称管理整套产品的动效感觉。每个组件还带有 MotionScore 性能评级，并提供 reduced-motion 处理，方便在追求表现力的同时控制渲染成本和无障碍体验。
目前 Motion UI 包含在 Motion+ 会员中。
发布介绍：https://motion.dev/magazine/introducing-motion-ui
UIAble 是一套基于 shadcn 和 Base UI 的 React 组件系统，最近发布了新版本。它不只提供单个 Button、Input、Switch 这类基础组件，还把表单、消息、文件上传、交易、数据卡片等常见应用界面整理成可以直接参考和组合的结构。
项目强调开源、可访问性、完整代码所有权和 AI 友好，组件可以复制到自己的项目中继续修改，不需要被锁定在一个不可编辑的运行时里。对于使用 Next.js、Tailwind 或 shadcn 体系快速搭建后台、SaaS 和产品官网的开发者来说，它可以作为一套更有视觉完成度的起点。
组件浏览：https://uiable.com/components
MapCN 是一套免费、开源、可以直接复制到自己项目里的 React 地图组件。它基于 MapLibre GL，使用 Tailwind 样式，并沿用了 shadcn/ui 的组件习惯，支持零配置和一条命令安装，不需要被锁定在某个封闭的地图运行时里。
除了基础地图，还整理了主题切换、标记、弹窗、Tooltip、标签、路线，以及缩放、指南针、定位和全屏等控制组件。对于正在用 React、Next.js、Tailwind 和 shadcn/ui 搭建后台或数据产品的人来说，它可以直接补上地图这一类通常比较费时间的界面模块，也很适合交给 Agent 作为可读、可改的代码上下文。
需要注意的是，仓库默认使用 CARTO 的底图服务，商业使用需要遵循 CARTO 的授权条款；如果项目有不同的授权要求，也可以替换成 OpenStreetMap、MapTiler 或其他兼容 MapLibre 的瓦片服务。组件本身采用 MIT License。
MapCN 官网：https://www.mapcn.dev/
GitHub：https://github.com/AnmolSaini16/mapcn
Mono Charts 是 Amicro 里的一组 React 动画图表组件，主打简洁的视觉风格和轻量的交互反馈。它提供折线图、柱状图、面积图、环形图、雷达图、热力图、漏斗图、散点图、KPI 卡片等多种常见图表，适合后台、数据产品和营销页面中的信息展示。
现在可以通过 Amicro 的 CLI 把图表直接添加到自己的项目里，例如：
npx @subhanhq/amicro@latest add mono-rounded-line
组件会以代码的形式进入项目，可以继续修改颜色、数据、动画和布局，不需要把产品绑定在一个只能在线调用的图表服务上。项目开源，适合先从一个漂亮的折线图或趋势卡片开始，再按自己的设计系统逐步调整。
官网与在线示例：https://amicro.vercel.app/
GitHub 源码：https://github.com/Subhan-code/Amicro--Micro-transitions-
UISFX 是一个专门为产品界面准备的开源声音效果库。它把常见的 UI 状态拆成 78 个语义化提示音，再为每个状态提供 12 种不同的声音感觉：Minimal、Soft、Glass、Arcade、Mechanical、Organic、Dreamy、Sci-fi、Rubber、Cinematic、Studio 和 Zen。
目前库里共有 936 种声音，包括 72 个短促的一次性提示音和 6 个可循环声音。可以直接在网页里试听，也可以通过 npm install uisfx 接入项目；网站还准备了给 coding agent 的实现提示词，让 Agent 根据产品气质选择合适的 sound feel。代码采用 MIT，音频采用 CC0，适合给 SaaS、AI Agent、游戏、媒体和教育产品补上一套有一致性的声音语言。
声音不应该取代视觉反馈，而应该强化用户已经看到的状态。尤其是 Agent 产品，等待、处理中、完成、成功、错误、通知等状态很适合用克制的提示音建立节奏，但最好同时保留静音、音量和无障碍设置。
GitHub：https://github.com/romainsimon/uisfx
npm：https://www.npmjs.com/package/uisfx
Codex Pets 是一个为 Codex 准备的动画像素宠物社区和分享画廊。你可以浏览各种会动的小角色，按最新、喜欢、浏览、讨论或随机排序，也可以搜索和筛选；每个宠物都支持悬停预览、3D Playground、下载、分享、点赞和快速评论。
它有意思的地方，是把 Agent 时代的终端工具变成了一个有角色、有收藏感的社区。你可以给 Codex 挑一只陪伴开发的像素宠物，也可以上传自己的 spritesheet，创建个人作品，再把宠物带入多人 Playground。背后的开源项目还支持自托管，适合 fork 成自己的素材分享站或角色资产库。
站点底层的设计也很完整：宠物用 pet.json 和 spritesheet 组成标准包，作品可以被下载、复用，并通过 CLI 拉进终端。需要注意的是，社区里有些作品会受已有角色或品牌启发，实际使用时仍然要确认版权和授权范围。
在线画廊：https://codex-pets.net/#/
GitHub 开源项目：https://github.com/portons/codex-pet-share
作者 @mosesbabychrist：https://x.com/mosesbabychrist
BoardUI 是一套为 Agentic Interface 准备的 React + Tailwind CSS 设计系统。它不只是把 Button、Input 这样的基础组件放在一起，而是把后台和 AI 产品里真正会用到的界面整理成可直接参考和安装的模块：数据表格、图表、日历、会议安排、Agent 进度、Prompt Composer、图片生成加载器、侧边栏、仪表盘模板等。
目前官网提供 50+ 个独立组件、180+ 个 building blocks 和 400+ 个设计 Token，设计稿来自 Figma，并且内置深色模式变量。组件可以通过 CLI 加入项目，例如：
npm boardui@latest add button-group
它比较适合用来搭建 SaaS、数据后台和 AI 工作台：先从完整的界面结构开始，再根据自己的产品调整颜色、Token、数据和交互，而不是让 Agent 每次从一块空白画布重新猜一个后台应该长什么样。基础组件和部分模板可以免费使用，Pro 则提供更多组件、区块、模板和图表。
官网与组件浏览：https://www.boardui.com/
原帖：https://x.com/sitenley/status/2090206983328526418
IP as Logo 是一个把产品吉祥物设计规则写成 Agent Skill 的开源项目。它的目标不是生成一张复杂的角色插画，而是把一个产品主题压缩成在小尺寸下依然清楚、可爱、容易记住的品牌符号；如果放在产品仓库里，它还可以先读取 README、页面文案和设计 Token，再根据产品语境提出方向。
这套 Skill 对视觉约束写得很具体：主体通常由 4–7 个大形状组成，默认使用两个 IP 颜色加一个背景色，采用粗圆角轮廓、单色背景和从左下或右下探出的构图。工作流会先给出 3 个设计方向，确认后再生成 6 个独立的方形候选，适合用来做 GitHub、Favicon、应用图标或新产品的第一版品牌资产。
如果想让 Agent 直接使用，可以安装：
npx skills@latest add s1dashu/ip-as-logo-skill
不想安装 Skill，也可以直接去官网浏览和免费下载现成的 IP Logo；仓库采用 MIT 协议，官网提供的 Logo 支持商业使用。它很适合个人开发者和小团队在项目刚开始时快速建立一个有性格、但不会过度复杂的视觉入口。
官网与免费 Logo 库：https://ipaslogo.com/
GitHub 开源 Skill：https://github.com/s1dashu/ip-as-logo-skill
原帖：https://x.com/tranmautritam/status/2090726424651202877
morphicons 是一个专门处理图标形变的轻量级库，可以让一个描边图标通过流畅的弹簧动画转换成另一个图标。它会自动计算形状之间的对齐和旋转关系，不需要为每一对图标手动编写 from/to 路径或额外的旋转规则。
在 React 中，只要改变 MorphIcon 的 icon 属性，就可以让 Menu 变成 X、Play 变成 Pause、Chevron 变成 Arrow；如果需要更精细的控制，也可以使用 progress 做拖拽 scrubbing，或者调用 morphTo 播放指定的变形。库本身零运行时依赖，压缩后约 7 KB，并同时提供 Vue、Svelte、React Native、Web Component 和原生 DOM 的用法。
它很适合用在菜单开关、播放状态、收藏按钮、步骤状态和工具栏操作里，把“图标换了”变成一段能解释状态变化的微交互。开源项目还提供了在线 playground，可以直接试玩不同图标之间的变形效果。
在线 Playground：https://www.morphicons.com/
GitHub 源码：https://github.com/guillermolg00/morphicons
Bloub 是一个把 x.ai 的聊天机器人头像复刻成 SVG 动画的视觉实验：一个黑色形状在 14 个状态之间平滑变形，整个过程不依赖动画库。它和 morphicons 一样关注“形状如何自然地变成另一个形状”，但更偏向一个完成度很高的单一主题作品，而不是通用组件；很适合观察如何用少量 SVG 状态做出有记忆点的形变。
Bloub：https://bloub.vercel.app/
Bible Strong Avatar Lab 是一个可以直接在浏览器中使用的程序化 2D 头像工具。你可以从基础形象开始调整头像的外观、表情和动画，把原本需要逐个绘制的角色变化变成一组可以重复组合和修改的参数。
完成后可以导出 SVG、PNG，以及可以直接放进项目里的 React 或 JavaScript 资源。它适合制作用户头像、AI Agent 状态、聊天角色、产品空状态和带有轻量动画的品牌形象；如果希望一套头像在不同页面、尺寸和状态之间保持一致，程序化生成也比单独准备很多静态图片更容易维护。
官网：https://avatars.bible-strong.app/
UISqueezy Studio 是一个专门管理设计 Token 的在线工作台，可以集中维护颜色、字体、间距、圆角、阴影、尺寸、断点和 z-index 等规范，再导出为 CSS Variables、SCSS 或 LESS。它还提供 Figma 插件，可以把 Token 同步到 Figma Variables，减少设计稿、代码和文档之间反复复制粘贴的工作。
工具提供工作区、项目、成员权限、活动记录和版本历史等团队协作能力，也保留了适合个人设计师的免费方案。需要注意的是，Tailwind CSS 和 Style Dictionary 目前仍标记为计划中的导出目标，使用前可以先确认当前项目需要的格式。
很多字体下载下来之后，只是暂时想看看效果，并不想立刻安装到系统里。TypeTray 可以直接读取文件夹中的字体，在不改变系统字体库的情况下预览和整理，支持 TTF、OTF、TTC、dfont 和 WOFF2 等格式。
它不只是把字体名称列出来，还会把可变字体的 weight、width 等轴放进列表里实时调整，支持切换 stylistic alternates、查看字体自带的 glyph set、按实际语言覆盖筛选，并自动识别字体的子样式。分散在多个文件名里的同一家族可以合并展示，重复的静态字体和变量字体也更容易被发现；还可以叠加另一款字体，直接比较基线和字面高度。
如果你的下载文件夹里积累了大量字体，但又不想为了挑选一个标题字体而反复安装、卸载，TypeTray 很适合当作一个轻量的字体检视台。它是 macOS 原生应用，需要 macOS 14 或更高版本。
官网：https://plkv.works/typetray
一组适合用来提升网页视觉表现的渐变与颜色工具：从实时 WebGL 网格渐变，到符合 WCAG 标准的颜色 Token，再到动画 3D Shader、曲线渐变和 4K 动态背景。可以按项目需要选择一个深入使用，也可以把它们当作做视觉探索时的灵感库。
如果想在网页中加入 Mesh Gradient、噪点、半色调、波纹或类似液态玻璃的动态背景，Paper Shaders 是一个很方便的起点。它提供零额外依赖的 Canvas Shader，可以通过 React 组件或原生 JavaScript 使用，也可以在 Paper 中可视化调节参数后导出代码。
目前项目包含 MeshGradient、DotOrbit、Dithering、Warp、Noise、Metaballs 等多种效果，支持静态或动画状态。代码体积小、参数直观，适合用在 Hero 背景、卡片遮罩、按钮状态和品牌视觉实验中。项目采用 Apache 2.0 协议，可用于商业项目。
官网：https://shaders.paper.design
GitHub：https://github.com/paper-design/shaders
Shader Lab 是 Basement Studio 做的一款在线 Shader 实验工具，界面本身就像一个轻量级的动效合成器。它把 Gradient、Pattern、Text、Dithering 和 CRT 等效果拆成可以单独调整的图层，支持修改色相、饱和度、扫描线、色差、噪点、故障、Bloom 和暗角等参数。
除了手动调参，还可以给参数添加关键帧，或把参数连接到音频，让视觉效果随着时间和声音变化。它很适合快速试做复古屏幕、扫描线、故障艺术和带节奏感的网页背景；即使暂时不需要导出代码，也可以把它当成一个实时视觉灵感板使用。
官网：https://eng.basement.studio/tools/shader-lab
这是一个专门为 Figma 制作透视效果的插件，可以将向量、文字、群组和 Frame 放入自定义的透视空间中。除了常规的透视变形，它还支持创建透视网格、球体、Logo 和各种 Mockup，适合用来制作具有空间感的界面展示、品牌图形和产品视觉。
作者表示这是因为没有找到合适的工具才自己开发的，目前可以在 Figma Community 免费使用。
原帖与演示：https://x.com/todelsz/status/2090837476743008491?s=20
插件：https://figma.com/community/plugin/1671949687141196785
这是一个可以把网页上复制的 CSS 样式直接粘贴到 Figma 的小插件，帮助你快速还原网页中的颜色、字体、间距和其他视觉样式。对于需要参考现有网页、整理设计规范或把前端样式带回设计稿的场景，可以减少手动设置属性的时间。
Figma 社区插件：https://www.figma.com/community/plugin/1671481846182486959/c-cssfigma
页查查是一款面向前端开发者和设计师的 Chrome 插件。点击网页中的任意元素，就能快速查看它的 CSS 样式；同时支持预览和下载页面中的图片、视频与 SVG，并以可视化的图层结构展示网页元素和标注信息。
如果遇到网页中特殊的 CSS 效果，可以先用页查查检查和获取样式，再配合前面的「C马-css样式粘贴到figma」插件，将样式带回 Figma 中进行还原和参考。
Chrome 扩展：https://chromewebstore.google.com/detail/fkkgnnieicfhijjebnebjbgibfhmmkjh
页改改是一款可以为任意网页注入自定义 CSS 样式和 JavaScript 脚本的 Chrome 插件。CSS 与 JS 可以分别管理、互不干扰，并支持按网址或正则表达式设置匹配规则，让修改只应用到指定的网站或页面。
插件提供内置代码编辑器和实时预览，编辑后的改动会立即呈现在目标网页上；还带有 CSS 语法检查，适合用来调整网页样式、测试前端效果，或打造更符合个人习惯的浏览体验。
Chrome 扩展：https://chromewebstore.google.com/detail/bfmkkbnbfimgkaloeibphmoilmlgpgpn
AI 可以很快写出一个页面，但很难凭空写出这种细腻的交互。Aceternity UI 的 Labs 收集了一批完成度很高的交互实验，每个案例都可以现场试玩，并查看和修改对应代码。
这里的案例不只是换个颜色或加一个 hover，而是把交互拆成了可以研究的具体问题：SVG Path Morphing 让播放按钮在暂停和播放之间平滑变形，Fey Cards 会在 hover 或点击时展开卡片并切换标题渐变，Interface Craft Cards 研究卡片的缩放和布局动画，另外还有 Gooey Dropdown、Wispr Flow Text Animation、3D Globe、Pixelated Canvas 等实验。
很适合把组件链接和截图一起丢给 Codex，让 AI 先理解参考案例的运动规律，再按照自己的产品风格重新实现一版。这样得到的通常不只是“一个看起来差不多的页面”，而是一套更接近真实产品的交互细节。
官网：https://ui.aceternity.com/labs
Viscose Carousel 是一个很值得拆开研究的作品集轮播实验。它没有把项目卡片放在普通的网格或横向滑块里，而是让卡片沿着一个大部分位于屏幕外的环运动：卡片靠近时会融合成一团，分开时又会拉出细细的“丝线”，整个效果由一个全屏 fragment shader 统一绘制。
交互也做得很完整：可以滚动、拖拽或滑动来转动环形轨道，松手后会带着惯性停在最近的卡片；hover 时鼠标附近的表面会变软，并把相邻卡片推开；移动端则用长按手势代替 hover。项目还把约 136 个可调参数整理成开发面板，方便继续调节卡片尺寸、环半径、响应式断点、指针反馈、丝线和玻璃边缘等效果。
它更适合作为视觉和技术参考，而不是直接拿来当生产组件：仓库明确标注为 WIP，目前还缺少键盘控制和 reduced-motion 支持，演示用的作品图片与部分字体也不能直接用于商业项目。源码基于 Next.js、React、Three.js、GSAP 和 Tailwind，适合用来研究“如何把一组卡片做成有物理感的空间交互”。
在线预览：https://viscose-carousel.vercel.app/
GitHub 源码：https://github.com/Yousuf-developer/Viscose-carousel
原帖：https://x.com/YousufSoomroDev/status/2088657289410687111
这是一篇很适合收藏的图标设计过程记录：作者用了大约一年时间，为 Cursor 手绘完成 600 多个图标，覆盖 16px 和 24px 两种尺寸，以及 Outline 线框和 Filled 填充两种风格，而且没有使用 AI 生成。
文章真正有价值的地方，不只是展示最终的图标，而是把从探索到落地的过程拆开了。它会讨论如何让几百个图标保持统一，为什么同一个图标需要针对不同尺寸做光学调整，线条交汇处如何避免堵塞，小尺寸下如何适当减薄笔画，以及圆角、端点、留白和视觉重心怎样共同形成一套稳定的图标语言。
如果平时只把图标当成“找一个差不多的 SVG”，这篇文章很适合拿来重新理解图标系统：真正难的是建立规则之后，仍然愿意为那些看起来几乎没有差别的细节反复修改。做产品图标、设计系统或组件库时，也可以把里面的检查方法整理成自己的验收清单。
原文：https://www.minoradventures.co/blog/the-making-of-cursors-icons
推荐这篇文章的原帖：https://x.com/vikingmute/status/2088623349890990336
上传一张 Logo 后，可以用下面这段提示词把它转成更有实体感的 3D 霓虹灯招牌。重点不是简单给 Logo 加一层发光滤镜，而是要求模型把平面图形重新理解成真实的灯管装置：保留原始识别度，同时补足灯管厚度、弯折、接缝、安装结构和光线反射。
将上传的 Logo 转换成一块高质感、风格化的 3D 霓虹灯招牌。保留 Logo 的核心轮廓和标志性结构，让它一眼仍然可识别，但不要再把它表现成平面图形，而要将其重建为真实的实体霓虹装置。
Logo 由沿着原始几何形状弯曲的粗霓虹灯管组成，具有明显的立体厚度、真实的灯管尺寸、圆润接头和专业招牌制作细节。加入灯管内部发出的强烈彩色光、明亮核心、柔和的环境光晕、微妙反射，以及落在周围结构上的发光溢出。保留 Logo 原本的颜色，并让颜色通过霓虹照明自然呈现。
加入少量真实的安装件和电气结构，但保持画面干净、精致、商业化。整体风格要具有电影感、标志性和高级感；使用戏剧化的棚拍光线、受控高光和细腻的环境遮蔽。画面只展示一个居中的完整 Logo，孤立在纯黑色背景上，呈现高端商业招牌摄影和超高分辨率效果。
原帖：https://x.com/doganuraldesign/status/2088750386605916429
很多人都看过迪士尼的 12 条动画原则，但 Raphael Salaja 把它们做成了一篇可以边读边操作的互动文章。页面从 Squash and Stretch、Anticipation、Staging 开始，一直到 Follow Through、Slow In & Slow Out、Arcs、Timing、Exaggeration、Solid Drawing 和 Appeal，每条原则都配了对应的界面案例。
它的价值在于让抽象的动画术语变得可以直接感受：长按删除任务时，会先用 anticipation 给出即将发生的提示；复杂面板会通过 staging 分层进入；列表卡片用错开时间体现 overlapping action；不同的 easing 曲线也可以直接对比。文章还会提醒动画不只是装饰，好的 motion 应该帮助用户理解状态、建立反馈，并让交互更自然。
适合在设计交互动效、整理产品 motion guideline，或者让 AI 学习“为什么这个过渡舒服”时作为参考。页面为了保证示例体验，建议在桌面端打开。
原文：https://www.raphaelsalaja.com/library/12-principles-of-animation
推荐这篇文章的原帖：https://x.com/tranmautritam/status/2088550597759000975
Checklist Design 是一个面向 UI、UX 和 Web 产品的实践清单库，按照网站页面、组件、用户流程、通用体验和品牌素材来整理。你可以针对正在做的页面或流程，选择对应的清单逐项检查，也可以直接复制给代理人，让它结合自己的界面截图和代码逐条审查。
它覆盖的范围很适合用来补齐 AI 生成页面容易遗漏的部分：按钮、表单、弹窗、导航、加载、空状态、错误反馈、响应式、深色模式、添加购物车、支付、重置密码和提交表单等。推荐的用法是把清单当作审查框架，而不是让 AI 自己发明一套标准：先选对页面或流程，再让代理人输出“已通过 / 有问题 / 缺少上下文”三类结果，最后人工确认真正需要修改的内容。
网站目前也提供 Figma 插件，方便直接在设计流程里使用。
Checklist Design：https://www.checklist.design/
浏览全部清单：https://www.checklist.design/browse
Site of Sites 是一个持续更新的网站灵感收藏站，除了常见的 Design、Portfolio、Agency 等分类，还会标注 Creative Coding、Interactive、Experimental、3D elements 等更具体的视觉特征。
它的筛选方式比较适合找方向：可以先按行业或页面类型缩小范围，再根据是否使用自定义代码、网格、3D 或交互效果来筛选。网站列表中会标出收录月份，适合定期回看近期出现的新案例。
官网：https://www.siteofsites.co/
Collected 是一个打开就能浏览的网站灵感收集站，页面信息很少，重点放在案例本身。它会持续加入新的网页作品，并提供提交网站的入口，适合在做 Landing Page、个人主页或创意工作室官网时快速扫一遍最近的视觉趋势。
Recent Design 是一个每天更新的设计灵感与资源精选站，收录优秀的设计作品、网站、OG 图片、App 截图和应用图标，也整理了实用工具、设计技能与相关职位。网站提供 Design、Websites、App Screenshots、App Icons 等分类，适合在寻找视觉参考、做竞品分析或探索新工具时快速浏览。
Moonvy 月维是一款专业的「设计资源管理工具」，让设计图的管理与交付在浏览器中就能轻松完成。提供更高效的切图、标注体验，并支持多种开发代码格式，让设计交付更省心、更顺畅。（Moonvy 月维官网：https://moonvy.com）
2026-08-02 00:00:00
Figma 推出了新版 Auto Layout，进一步缩小设计画布与前端 CSS 布局之间的差异。过去，一些布局在 Figma 和浏览器中的表现并不完全一致，开发者需要在交付后额外编写代码进行修正；新版布局逻辑能够让最终实现更贴近设计稿，减少还原时的变通处理。新建 Frame 会自动使用新版 Auto Layout，已有 Frame 则会继续保持旧版，用户可以自行选择升级，并可在 2027 年 1 月前切回旧版。
https://help.figma.com/hc/en-us/articles/42031586813719-Use-auto-layout-with-CSS-Flexbox-in-mind
现在，将代码生成的界面带回 Figma 画布时，其中的颜色、字体和间距会尽可能自动绑定到文件中已有的 Variables，而不再全部变成难以维护的固定值。这项能力适用于将 Figma Make 预览复制为设计图层、通过 Figma MCP Server 从代码生成设计，以及使用 Chrome 扩展将线上网页捕获为可编辑图层等场景。同时，更多导入的 Frame 会自动采用 Auto Layout，使后续编辑时能够正常缩放和重排，大幅减少从代码或旧页面还原设计后的手动整理工作。
https://www.figma.com/release-notes/
Brilliant 是一款面向 AI 时代的专业矢量设计工具，可以让设计师与 AI Agent 直接在同一块画布上协作。它既支持内置 AI 对话，也能通过 MCP 连接 Claude Code、Cursor、Codex 和 GitHub Copilot 等工具，让 Agent 创建或修改设计，而生成的结果仍是可以手动编辑的原生矢量图层。Brilliant 还提供设计系统、Figma 双向导入导出、并行 Agent、React 与 HTML/CSS 代码复制，以及图片、视频等多种格式的导出能力。
tone 是一款能将照片快速转换为复古孔版印刷效果的 iOS 应用。导入照片后，它会利用半色调网点、颗粒、油墨叠印与纸张纹理，生成类似双色海报或 ZINE 的印刷质感。应用支持 1～3 色叠印，可分别调整网点大小、角度与油墨浓度，还能自定义纸张、留白、画幅比例和圆角；喜欢的效果可以保存为预设，最终以 PNG 格式导出。应用可免费下载，部分油墨颜色、预设保存与高分辨率导出功能需要付费解锁。
Numeric Arch Warp 是一款可以在 Figma 中通过具体数值制作拱形弯曲效果的插件，支持图片、Frame、组件实例以及带有图片填充的设计元素。与手动拖动锚点不同，它可以保存并复用同一组弯曲参数，即使替换成另一张图片，也能保持完全一致的弯曲程度。插件不仅改变外框，还会让内部的图片内容一起向上或向下拱起，非常适合制作产品图、封面、海报、Mockup 和各种视觉实验。处理过程完全在本地完成，生成结果会以带透明背景的 PNG 放回 Figma；建议保留原始可编辑图层，以便替换内容后重新生成。
https://www.figma.com/community/plugin/1648931677024157590/numeric-arch-warp
Shadow 是一款专为 Tailwind CSS 打造的平滑阴影插件，通过多层 CSS 阴影让卡片、弹窗、下拉菜单等悬浮元素的边缘和层次更自然。它提供从 XS 到 2XL 的多种阴影尺寸，还有将细边框融入阴影的 smooth-shadow-ring 工具类，避免边框与阴影叠加时出现生硬的“双重边缘”。阴影和边缘颜色可以独立调整，并支持明暗主题；整套效果由纯 CSS 实现，方便直接用于各类前端项目。官方还免费提供 Claude Agent Skill 和 Cursor Bugbot 规则，帮助 AI 在生成界面时自动选用正确的阴影样式。
https://shadow.floriankiem.com/
GitHub：https://github.com/flornkm/shadow-plugin
Vessa 是一款将传统品牌规范 PDF 变成在线互动页面的工具。设计师可以用品牌真实的色彩和字体搭建规范页，并通过一个链接分享给团队或客户，也可以部署到自己的域名。与静态文档不同，页面中的颜色可以点击复制，情绪板能够展开查看，动效也可以直接播放；修改一次后，所有已分享的链接都会同步更新，避免多份 PDF 造成的版本混乱。Vessa 由 Annnimate 团队打造，目前处于私密测试阶段，可在官网加入等候名单。
Himekuri 是一款将传统撕页日历搬到 Mac 桌面的免费应用。它不会同步数字日历、发送提醒或在零点自动翻页，而是等待用户每天亲手撕掉昨日，让看日期变成一个有触感的小仪式。纸张的抓取、起皱、撕裂和飘落都由物理模拟驱动，页面可以撕到一半停下，放手后则会像真纸一样打着旋飘出屏幕。应用提供昭和印刷、极简瑞士、粗野主义、复古办公室、日本历书和中国黄历六种样式，仅约 5 MB，无广告、无账号且不需要网络，支持 macOS 15 及以上系统。
Pica 是一款由 Josh Puckett 打造的原生 macOS 字体管理应用，可以将字体整理进自定义收藏夹，监看指定文件夹的变化，并通过一次点击完成字体的启用与停用。它提供完整的 OpenType 支持，还能将不同字体直接应用到自定义 Logo 和配色主题中预览，帮助设计师更直观地比较字形在真实品牌场景中的效果。最新版本已加入完整的中文、日文和韩文字体支持，浏览超过 30,000 个字符时仍能保持流畅滚动；同时优化了大型字体库的性能，监看或启用数 GB 的字体文件夹也更顺畅。应用可免费下载使用。
发布介绍：https://x.com/joshpuckett/status/2083703054076133491
Thinking Orbs 是一套专为 AI 聊天和 Agent 界面设计的开源加载动画组件，用灵动的点阵球体呈现 working、searching、solving、listening、composing 和 shaping 六种工作状态，比普通的转圈 Loading 更能传达 AI 当前正在做什么。组件提供适合头像区域的 64px 与行内状态的 20px 两种尺寸，支持明暗主题自动适配、动画速度调节和减少动态效果等无障碍设置。它基于 React 与 2D Canvas 实现，零额外依赖，通过 npm 安装后即可快速引入项目。
https://orbs.jakubantalik.com/
GitHub：https://github.com/Jakubantalik/thinking-orbs
Koboyo Icons 是一个收录了 71,262 个高质量手绘图标的免费素材库，覆盖界面、人物、生活、商业、科技等丰富主题。所有图标都以 SVG 格式提供，支持按分类、关键词和同义词搜索，并使用 currentColor 方便在项目中调整颜色。图标可免费用于个人及商业项目，无需注册或署名，也可自由改色、缩放、裁剪和制作动画。
Pure 是一个专注于优质落地页的设计灵感网站，持续收集并筛选各行业值得参考的网页案例。网站按 Agency、Mobile App、Physical Product、Service、Single Page、Software 和 Web App 等类型分类，方便根据项目定位快速寻找参考；还可以单独浏览页面中的局部设计截图，很适合在制作官网、产品介绍页或营销页时寻找版式、配色和视觉表达灵感。
Humation 是一款已经有约 40 万用户使用的在线头像生成器，通过组合不同的头部、身体、配饰和眼镜等元素，就能快速创造一个充满手绘感的个性角色。最近，Humation 又加入了一批夏日主题素材，包括风铃、花火球、汽水、章鱼烧、向日葵、鲨鱼、西瓜和潜水镜等，让生成的头像更有轻松可爱的季节氛围。网站无需复杂操作，挑选喜欢的造型与物件自由组合即可，很适合制作社交头像、个人形象或趣味角色。
发布介绍：https://x.com/ysk_en/status/2067938941882536428
Moonvy 月维是一款专业的「设计资源管理工具」，让设计图的管理与交付在浏览器中就能轻松完成。提供更高效的切图、标注体验，并支持多种开发代码格式，让设计交付更省心、更顺畅。（moonvy.com）
2026-07-20 00:00:00
OpenAI 最新模型 GPT-5.6 现已在 Figma Make 中正式上线。现在，用户可以直接在 Figma Make 聊天框中打开模型选择器，并切换到 GPT-5.6 进行设计与内容生成。该模型已对所有套餐用户开放
https://www.figma.com/release-notes/
在世界表情包日（World Emoji Day）之际，谷歌官方分享了 Noto 3D 表情的幕后设计故事。设计团队重新设计了将近 4000 个表情符号，融入了更丰富的表情细节、更完善的无障碍设计，并采用了符合现代化沟通场景的全新 3D 视觉风格，让数字表达更加生动、有温度。更令人兴奋的是，因为语言的本质在于共享，所以谷歌所有的 Noto 产品组合都是完全开源的。官方已将原始的 .OBJ 3D 模型文件共享给开源社区，让任何人都可以利用它们去构建沉浸式 VR 世界、独立应用，甚至是创造各种充满创意的趣味表情包。
https://blog.google/products-and-platforms/platforms/android/world-emoji-day-noto-3d/
GitHub 仓库：https://github.com/googlefonts/noto-emoji
帮你提升 Vibe Coding 前端交互设计水平的网站，在跟 AI 编码交流时，因为不知道某个组件或微动效的专业英文名称而难以描述时，Name That UI 就像一个 UI 元素的视觉词典。你只需用自己的日常语言模糊描述想要的效果，它就能帮你精准识别出对应的专业术语、API 标识，甚至提供直接可用的 Prompt，大幅提升你与 AI 协同开发的效率。
OriginKit 是一款专为现代网页量身打造的精美动画组件库，它提供了大量开箱即用的前端交互组件与动效，完美适配 Framer 与 React 生态。更棒的是，它原生支持 Model Context Protocol (MCP)，这使得 Claude 等 AI 编码助手可以直接获取其组件库上下文，让你通过简单的对话就能自动编写和生成高质量的动效页面。
官网：https://toolfolio.com/tools/originkit
在 Vibe Coding 时代，使用 AI 辅助设计网页时，最怕的就是各个页面风格不统一。DesignMD 就是为了解决这一痛点而生的工具。它可以直接分析你指定的精美网站，将其色彩系统、字体层次、间距规范以及圆角阴影等核心设计特征提取出来，生成一份标准的 DESIGN.md 规范文件。将这份文件直接放入项目根目录，AI 编码助手（如 Claude、Cursor 等）就能读取并严格遵循这套设计系统，从而有效防止 AI 生成界面的“设计漂移”。
社区模板库：https://getdesign.md
在 Figma 中实现类似 Illustrator 的网格变形（Mesh Warp）或自由变换效果，Warp It 绝对是不容错过的利器。它允许你直接对 Figma 中的矢量图形甚至文字进行扭曲、弯曲和形变操作。你只需通过拖动网格上的控制点或调节滑块，就能轻松制作出波浪形文字、透视效果的插画以及各种极具张力的创意视觉。需要注意的是，对文本进行变形后，它会将其自动转化为矢量路径，因此建议在确认文案后再进行操作
https://www.figma.com/community/plugin/923820065156924054/warp-it
HLFTN 是一款由 Pavel Laptev 开发的优秀 Figma 插件，用于一键生成精美的矢量半色调（Halftone）渐变效果。它支持径向、线性和均匀分布的网点渐变，并且生成的所有图形都是完全可缩放、可编辑的矢量对象。无论是为了给网页背景增加复古印刷感、打造波普艺术（Pop Art）风格，还是为插画和 UI 组件添加独特的噪点质感，HLFTN 都能让你在 Figma 内快速完成
https://www.figma.com/community/plugin/1000012087652644703/hlftn
这是一个能帮你提升 Vibe Coding 前端交互设计水平的宝藏网站。网站精心整理并归纳了 Web 和 App 中常见的各种组件和动效名词，甚至还列出了诸如 Liquid Glass（液态玻璃）、Neumorphism（新拟物）等网页设计风格名称。当你不知道该用什么词汇去指示 AI 时，在这里翻一翻就能找到最地道的提示词
Dither Kit 是一款极具复古像素美学风格的图表及 UI 组件库。它基于超轻量的 Canvas 引擎构建，不需要依赖繁重的 Recharts。组件库包含了折线图、柱状图、饼图、雷达图以及生成式头像和渐变色块等，其特有的有序抖动（ordered-dither）填充在亮色和暗色模式下均有极佳的视觉表现，且自带细腻的入场动效和滑动 Tooltip，是打造个性化像素风页面的不二之选。
https://www.tripwire.sh/dither-kit
如果常规的静态图标已经无法满足你的交互要求，那不妨试试 AnimateIcons。这是一个专为现代网页微交互（Micro-interactions）打造的开源动效 SVG 图标库。它提供了一大批包含内置悬停（hover）和循环（loop）动画的精美 SVG 图标，非常适合与主流的 shadcn/ui 或 motion/react 等前端框架配合使用。直接复制代码即可嵌入项目，支持随意修改大小和颜色，能为你的网页细节带来立竿见影的灵动感。
https://github.com/Avijit07x/animateicons
Jitter 是一款网页动画编辑工具。今天为大家推荐的是它的官方模板库，这里提供了海量免费且高质感的动态图形模板（如 UI 交互动画、社交媒体动效、图标微动效等）。你可以直接将这些模板复制到你的 Jitter 工作区中，快速替换自己的文字与素材，并支持一键导出为 GIF 或高画质视频，非常适合需要快速产出精美动效的设计师和运营人员。
https://jitter.video/templates/all/
Moonvy 月维是一款专业的「设计资源管理工具」，让设计图的管理与交付在浏览器中就能轻松完成。提供更高效的切图、标注体验，并支持多种开发代码格式，让设计交付更省心、更顺畅。（moonvy.com）
2026-04-02 00:00:00
我们都知道，中国的 App 界面设计总是给人高信息密度、布局紧凑的印象，以至于很多人会感到这些 App 界面过于杂乱，尤其是不同国家地区文化的用户。
至于原因，业内众所周知的原因主要有 3 点：
中国的互联网公司很喜欢以 App 为中心扩张业务范围，背后的原因是在中国基于网页搜索引擎的流量来源在移动互联网时代被近乎完全的抛弃，作为垄断地位的搜索引擎百度已经被边缘化。App 是最重要的「流量入口」，公司 App 靠主营业务吸引用户，再在 App 中推出一系列其他的业务。
所以你可以在类似 Uber 的打车 App（滴滴打车） 中贷款、开信用卡、买保险、叫家政。在类似 Dropbox 的网络存储 App（百度网盘）中浏览网页、像 Netflix 一样看电影、像 TikTok 一样看短视频、甚至求职。
想象一下 Google 把它的所有业务融合成一个 App，中国的 App 就是这样的产品模式，这就是 App 的平台化。一个 App 的涉及的业务如此之广，意味着功能会非常多，用户界面不可避免的要变得根据复杂臃肿。
在中国 App 的 UI 设计师的权力范围大多只涉及到视觉呈现，而功能布局大多数时候设计师可做不了主，不同业务的负责人都想方设法让自己的业务尽可能争取界面中更多曝光，而这种情况下界面布局只能由上一级负责人来协调，设计师只能视觉上优化被指派的功能布局。
而这样绩效驱动的设计，自然要榨干屏幕上尽可能多的空间来产生最大的效益，留白就是在寸土寸金的屏幕上浪费金钱。
无论界面设计还是用户体验要为业务完全的让位，最极端的体现就是在中国很多 App 的启动时会有非常长时间的启动广告（开屏广告），并且会随机的强制跳转到广告商的 App 或者网页，你必须前往广告商的 App（例如一个购物 App 的促销产品） 后再回到原来想要打开的 App。
所以说，UI 设计其实由设计师决定的部分没有很多，更多的是由业务和商业模式决定的
最后就是语言文化的差异了，汉字的信息密度会比拉丁文字更高，这在界面设计上也有显著影响， 比如用中文设计里能轻松的设计紧凑的宫格，而拉丁文字的设计下，由于文本过长就很难设计的很紧密。
此外按人类学家（Edward T. Hall）的说法，中国是高语境文化（High-Context Culture），在高语境文化下，人们更倾向于从丰富的信息中提取有用的信息，而不是对此排斥。
另外一个语言差异是搜索，由于使用拼音输入中文进行搜索相比英文直接输入要更慢，搜索的优先级并没有那么的高。
商业元素是中国 App 设计中最重要的因素，那如果排除商业因素呢，这里我找到了一些很好的例子，就是「博物馆」的 App，各国的博物馆的 App 商业模式差异较小，由绩效主导的程度也较小，设计师的权力范围相对较大，这些 App 的界面设计就更能反映出不同国家地区文化的差异了。
这里我们选取了中国国家博物馆、首都博物馆的官方 App 与西方常用的博物馆 App Bloomberg Connects、British Museum 来对比一下。
我们可以看到，在中国的博物馆 App 的界面设计相比商业 App 简洁一些，但不多，但仍然保留了较高的信息密度和复杂性。
而和西方博物馆 App 最大的不一样是着陆页的导航，中国的 App 非常喜欢把尽可能多的功能入口以宫格的形式放在着陆页上，而西方的 App 则的着陆页缺少功能入口，倾向于让用户去导航栏或者搜索栏去寻找功能入口。
看来，商业因素虽然是中国 App 设计中重要的因素，但即使排除商业因素，中国的 App 设计仍然与西方差异很大，最大的差异就是着陆页的功能导航上，看来不管是因为真的文化差异还是用户的使用习惯已经被商业 App 塑造了，中国人确实更喜欢更高信息密度和平铺导航的界面设计。
最后我想说的是，某一个 App 的界面设计风格可能是设计师或者产品团队的设计决策，但如果要论群体的设计风格，它更多的是有商业模式和文化环境所决定的，再追根溯源，其实是由消费者所决定的，最终的消费者选择了什么样的产品，什么样的产品就存活下来， 而存活下来的产品的设计风格就会被模仿和延续，形成了一个文化环境，最终形成了一个国家地区的设计风格。
