一、全文速览图

兰亭妙微UI设计公司，资源分享。

二、设计资讯

1. 在 Figma 社区推出 Figma Weave 工作流模板

Figma 社区最新推出的资源类型——Figma Weave 工作流——现已上线。Figma Weave 让您能够在可视化画布上构建可重复、可扩展的生成式 AI 工作流。现在，您可以直接在 Figma 社区中探索和复制 Figma Weave 团队构建的工作流。无论您是想生成新图像、将图像转换为视频，还是将品牌指南扩展为插图集，Figma Weave 都能轻松实现。

网址： https://app.weavy.ai/

网址： https://www.figma.com/release-notes/

三、产品推荐

1. 在线矢量路径工具

在线的轻量级矢量编辑器，作者希望像 Figma 向量网络那种流畅的操作体验，同时又想拥有 Blender 修改器的“魔法”。最终的成果是一个基于 GPU 加速、使用 Go + WASM 构建的图标与字形设计工作室，并且完全运行在浏览器中。

它有一些很酷的功能，比如形状构建器、动态镜像、干净的 SVG 导入导出、等距绘图投影等等，还有很多其他特性。整体设计比较简洁克制，但用起来很顺手。

网址： https://iso.alasdairmonk.com/

网址： https://x.com/almonk/status/2042127913173057659

2. Liaison - AI 编程定位、网页样式编辑与批注

在任意网页上实现类似 Figma 的设计体验，调整元素样式、添加评论，并导出结构化 Prompt 给 AI 开发与协作。

Liaison 是一款面向设计师、产品经理、前端工程师和高频 AI 用户的浏览器插件。它让你可以直接在真实网页上完成样式调整、界面批注和实现反馈，不再依赖截图标注、文档补充和反复描述。你可以像在设计工具里一样选中页面元素，修改尺寸、间距、字体、颜色、圆角、描边、投影等属性，同时把评论和修改统一整理成结构化结果，方便交给开发或 AI 继续实现。

浏览器插件： https://chromewebstore.google.com/detail/liaison-ai-%E7%BC%96%E7%A8%8B%E5%AE%9A%E4%BD%8D%E3%80%81%E7%BD%91%E9%A1%B5%E6%A0%B7%E5%BC%8F%E7%BC%96%E8%BE%91%E4%B8%8E%E6%89%B9%E6%B3%A8/keeeahbnkkbengbjmmblmpgbccjeoebf

使用介绍： https://gwrdluzl9j9.feishu.cn/wiki/JWRjwF12ZiSQSrkjHbMcMwfbnPu

3. 免费开源的录屏工具

最贵的缩放录屏软件 Screen Studio，核心功能被 Recordly 复刻，完全免费开源！ 同时支持 Mac/Windows/Linux。 测试了下，比 Screen Studio 还轻便顺滑

网址： https://recordly.dev/

网址： https://github.com/webadderall/Recordly

4. 开源图标库

MingCute 是一套简约精致的开源图标库。无论您是设计师还是开发者，它都非常适合用于 Web 和移动端项目，同时提供了 Figma 插件能够更便捷的在设计过程中使用，以及动画图标库、UI 组件库、天气图标等不同场景的素材

网站： https://www.mingcute.com/

Figma 插件： https://www.figma.com/community/plugin/1306884809438005528/mingcute-icon

5. 图文混排的长文转小红书图片生成器

作者使用 vibe Coding 了一个支持 Markdown、图文混排的长文转小红书图片生成器，

1. 支持图文自由拖拽混排
2. 支持自动切分多图及一些主题风格化
3. 支持 Markdown 长文

网址： https://reflow.fehey.com/

6. 标尺小工具

一个微型工具，用于在 localhost 上测量间距并对齐您的 UI

网址： https://x.com/Ibelick/status/2042508446671499405

体验地址： https://mesurer.ibelick.com/

四、设计素材

1. 西文免费开源字体合集

面向 UI/UX 设计师与开发者，Freefaces Gallery 是一个精选的免费开源字体合集，这意味着您可以在个人和商业项目中使用它们，而无需担心许可问题。

网址： https://www.freefaces.gallery/

网址： https://fontshare.com/

2. 100+个开源免费的 SVG 加载动画

你可以使用这些基于 SVG 的加载图标来直观地指示内容。 这些动画来自多种来源，均采用 MIT 许可证。因此，它们可以无限制地用于商业用途，且无需署名。

网址： https://magecdn.com/tools/svg-loaders

3. UI/UX 设计师 Vibe Coding 指南

作者根据自身经验整理了一份「面向 UI/UX 设计师 的 Vibe Coding 完整工作流指南」从用 AI 辅助开发到 可交付、可上线。

网址： https://vibecodingfang.netlify.app/#

五、随便看看

1. 设计欣赏

作者在 Figma 中 1 小时绘制的小组件，好玩的是发帖后有人回复了在线的地址，将组件实现为了可以使用的音乐播放器，在 AI 时代还是需要审美创造力的，可以通过链接体验

网址： https://x.com/AdityaSur11/status/2038881480898756695

网址： https://audio.snvshal.workers.dev/

2. 沉浸式阅读探索

作者为自己的博客增加了多种阅读状态，让视觉外观不止是浅色、深色，增加了树影、月色、下雨、下雪等多种自然状态，网站右上角可以切换体验

网址： https://theme-switch.pages.dev/

转载：优设

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

在 UI 设计交付与团队协作中，统一规范是保证界面质量、提升效率、降低沟通成本的核心基础。兰亭妙微设计结合多年项目沉淀，把日常高频使用的设备尺寸、图标输出、字体、单位、命名、设计原则、交互准则完整整理，形成可直接落地的设计规范手册，方便团队随时查阅、复用。

弹窗是移动端界面交互的核心组件，贯穿用户操作全流程，直接影响产品体验与转化效率。兰亭妙微设计团队结合多年项目实战，从分类、样式、场景、规范四个维度，系统梳理 APP 弹窗设计逻辑，帮助设计师精准选型、高效落地。

很多刚接触版式的设计伙伴常会陷入迷茫：不知道版面怎么排、元素怎么放、视觉总显得乱、没有高级感。其实版式设计并非靠感觉，而是有完整的知识体系支撑。

大家好，这里是兰亭秒微设计。作为专注 UI/UX 视觉体系搭建的设计团队，我们在金融、科技、生活服务等多领域项目中发现：蓝色是 UI 设计里适配性最强、容错率最高的主色，但想做出高级、耐看、有品牌记忆点的界面，配色逻辑远比 “选个蓝” 更重要。

争夺用户注意力：为何它是未来设计的核心趋势

一、忽视注意力：糟糕设计引发的致命后果

1. 航空事故：1989 年波音 737 客机坠机，因界面未明确标识故障引擎，机组误关正常引擎，导致 47 人遇难、74 人受伤。

   

2. 工业爆炸：2005 年 BP 炼油厂爆炸，控制室 HMI 界面违反可用性原则，操作人员误读反馈，造成 15 人死亡、180 人受伤，经济损失惨重。
3. 公共预警失误：2018 年夏威夷误发导弹紧急警报，源于操作界面模板设计模糊，官员一键选错，引发全民恐慌。

二、滥用注意力：数字时代的 “分心陷阱”

• 早在 2012 年，谷歌风投合伙人乔・克劳斯就提出 “分心文化”：数字产品持续刺激大脑，让用户失去长期思考能力，闲置时便陷入焦虑。
• 前谷歌产品经理 Tristan Harris 发布内部倡议，呼吁科技公司停止利用人性弱点，尊重用户注意力，但这一问题至今未解决。

三、正向设计：守护注意力，创造高价值体验

1. 驾驶安全：HUDWAY 平视显示器，让驾驶员专注道路，无需低头查看信息，降低事故风险。

   

2. 行车预警：特斯拉前方碰撞警告系统，通过视觉 + 声音双重提醒，快速抓取驾驶员注意力，规避碰撞风险。

   

3. 工业生产：Solomon 科技的 3D 视觉 AR 系统，实时识别组装部件，帮操作员集中注意力，减轻精神压力。

移动端表格设计：5 个实用解法，彻底解决小屏数据展示难题

一、保守派：保留表格形态，轻量化适配

1. 横竖屏一键切换

• 优势：实现成本低，可全局复用，适配纯阅读场景
• 局限：仅支持查看，无法做数据编辑、批量操作

2. 固定表头 + 滚动指示灯

1. 数据对应混乱：冻结首列表头，横向滚动时始终可见关键字段
2. 屏效过低：适度缩小字体，提升信息密度
3. 滚动无预期：添加滚动指示灯，清晰提示当前查看进度

• 核心：像给表格加了可视化滚动条，降低阅读认知成本

二、激进派：重构展示形式，贴合移动端习惯

3. 关键字段收折展示

• 选字规则：通过「重要度 + 字段长度」十字分析，优先选短文本、高优先级字段
• 适用场景：字段数量适中，用户需快速识别数据的场景

4. 卡片式列表呈现

• 优势：符合移动端视觉习惯，操作路径更短，是 B 端移动端最常用方案
• 适配场景：外勤人员快速查看、一键操作的业务（如销售、配送）

5. 全信息详情卡片

• 优势：信息一站式展示，减少页面跳转，大幅提升操作效率
• 典型场景：配送员订单、外卖详情、销售客户速览等高频轻操作场景

最后：移动端表格的设计边界

Apple推出的突破性产品 Vision Pro 在科技界引起了轰动，新的设计趋势即将到来。苹果首席执行官蒂姆·库克在 WWDC 2023 上自豪地展示了这款全新设备，展示了增强现实 (AR) 和空间计算的新时代。

凭借 Vision Pro，Apple 再次展现了其突破创新界限的能力。本文将探讨 Vision Pro 如何彻底改变 UX 设计行业并改变我们与技术交互的方式。

一、摆脱传统显示器的束缚

Vision Pro 将用户从传统显示器的限制中解放出来，开创了空间计算交互的新时代。

通过无缝融合增强现实和空间计算，苹果推出了一种独特的输入方法（结合眼动和手势），类似于鼠标或触控板。这一创新让用户体验设计师有条件打造超越屏幕限制、身临其境和直观的用户体验，开辟了无限的可能性。

彩云注：当我们大多数人已经习惯了 2D UI 的设计模式，这种新的交互方式，给了我们很多创新的空间，比如结合眼睛和手势，我们可以给用户带来更自然直觉的新体验。

二、美学与功能的结合

Vision Pro 的设计将美学与功能无缝结合。这款设备采用铝制框架和曲面玻璃，外形类似滑雪护目镜，清楚地表明它的预期用途是在家庭和办公室等受控环境中。

包含用于图像捕获的物理按钮和用于调整的数字表冠确保了直观的控制，而灵活的表带和面罩使用户专注并屏蔽外部干扰。

彩云注：在考虑未来交互方式和视觉的时候，需要多结合硬件和软件的交互及视觉效果，怎样达到最直观的操作效果。

三、增强现实和空间计算

Vision Pro 主打增强现实，使其有别于以前的混合现实设备。通过将虚拟世界和物理世界无缝融合，用户体验设计师现在可以创造增强用户对现实感知的体验。

从将信息叠加到真实世界的物体上，到创建交互式 3D 环境，设计引人入胜、情境丰富的新体验。

四、设计新的输入方式

对于 Vision Pro，用户体验设计师将需要考虑传统鼠标和触控板之外的新输入方法。

用于图像捕获的物理按钮和用于调整的数字表冠为设计师提供了交互设计的新途径。设计直观和无缝的控件对于确保流畅和沉浸式的用户体验至关重要。

五、空间音频和沉浸式声音场景

Vision Pro 的突出特点之一是它的空间音频功能。通过集成内置的“音频 pods”，苹果通过创造丰富而身临其境的声音场景来增强用户体验。

这种革命性的音频本地化方法使设计师能够从不同的方向模拟音频源，从而与数字环境进行更吸引人、更逼真的交互。

六、顶尖的硬件和技术

在底层，Vision Pro 由苹果的标准 M2 芯片和专用于视频流的新 R1 芯片提供支持。

微型 OLED 显示屏，每空间提供令人印象深刻的 64 个像素，相当于标准 iPhone 像素，确保呈现清晰、充满活力的视觉效果。此外，与蔡司合作提供定制嵌入玻璃也体现了 Apple 的包容性和可访问性体验标准。

七、EyeSight：协作体验和社交能力

苹果推出了一项名为 EyeSight 的突破性功能，利用前置显示屏向房间内的其他人展示用户的眼睛。

通过捕获初始面部扫描，Vision Pro 在弯曲的前玻璃上创建用户的“真实眼睛”。这种对个人头像的创新使用促进了更真实和身临其境的社交互动，使用户能够在数字领域进行更深层次的联系。

八、聚焦工作场景

Apple 对电子邮件和桌面等与工作相关的应用的重视表明，Vision Pro 是想主打一种生产力工具。

通过与 Microsoft Office 等现有应用和流行的线上会议服务无缝集成，这款头戴设备使专业人员能够增强他们的工作流程并更有效地协作。

这种工作第一的方法使 Vision Pro 与其他优先考虑游戏和娱乐的设备区分开来。

九、打开内容的新维度

Vision Pro 开辟了内容消费和创作的新维度。不透明显示屏允许较暗的环境，非常适合展示从 iPhone 拍摄的 2D 照片以及捕捉空间照片和视频。

影院选项为用户提供了完整大屏幕的错觉，而游戏体验则投射到虚拟大屏幕上，提供身临其境的游戏体验。

十、与内容巨头合作

苹果与迪士尼联手，正在建立令人兴奋的内容合作伙伴关系，这预示着 Vision Pro 的光明未来。

随着 Disney+ 的推出，用户可以期待一系列身临其境的互动娱乐体验。苹果和迪士尼之间的合作证明了 Vision Pro 在重新定义我们消费媒体方式方面的潜力。

十一、新的设计工具和工作流程

为了适应 Vision Pro 的独特功能，Apple 推出了 VisionOS，这是一款专为空间计算设计的新操作系统。

这个新平台提供了丰富的教育功能，包括天文学、健康和音乐创作应用。此外，现有 iOS 和 iPadOS 框架的集成确保了开发人员的无缝过渡，并为专门针对 Vision Pro 定制的广泛应用生态系统铺平了道路。

总结

凭借 Vision Pro，Apple 向用户体验设计行业的革命迈出了大胆的一步。通过将增强现实、空间计算和尖端硬件相结合，苹果公司创造了一款开启交互和沉浸新维度的设备。

随着用户体验设计师拥抱 Vision Pro 的功能，我们可以期待超越传统界面的突破性体验，使用户能够以前所未有的方式与数字内容和环境互动。

用户体验设计的未来已经到来，在 Vision Pro 的引领下，它看起来前景无限光明。

转载：优设

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

很多 UI 设计师软件熟练、审美在线，但产出总不够精致、不够专业、开发落地差，核心原因就是：细节没抠到位。

很多刚入行的设计师朋友，软件操作很熟练、技法也学得快，但一接到真实需求就没思路、只会找参考、越抄越乱。本质问题是：缺底层理论、缺体系框架、缺落地逻辑。