再建网页 Liquid Glass

Aave 团队先在 iOS 和 Android 应用中推出自家玻璃效果,随后聚焦网页跨浏览器实现。他们构建了包含开关、滑块、切换组和视频播放器等在内的组件家族,使网页界面获得与移动端一致的立体感和触觉反馈。

Aave

Raycast 2.0 幕后

本文提到在 macOS Tahoe 系统上,Raycast 2.0 采用了 Apple 新的 Liquid Glass 材质。这一选择让应用界面能从第一天起就融入系统更新的视觉语言,与整体设计风格保持一致。采用该材质是实现“感觉原生”目标的具体措施之一,帮助 WebView 内容更好地与原生窗口背景融合。

Liquid Glass

Raycast 2.0 幕后

在处理窗口大小调整动画时,Raycast 通过重写 NSWindow.setFrame 方法,使用隐式的 Core Animation 替代 WebKit 默认的动画调用。这一调整解决了 WebKit 在窗口 resize 期间暂停绘制导致的卡顿问题,确保 WebView 在动画过程中持续渲染,从而让界面过渡更流畅自然。

Core Animation

手写英文笔画字体

本文中的Stroke Animation基于Hershey路径实现手写风格笔画动画,重现Apple式“hello”开箱效果。它利用字母数据中已拆分的自然笔画段落,通过stroke-dashoffset依次驱动各段动画,并添加平滑连接器实现流畅过渡。用户可调整文本、缓动函数、重叠度、时长和描边宽度等参数,实时预览变体效果。

Stroke Animation

网页鼠标悬停的速度门控

本文设置两个不对称速度阈值:捕获阈值 0.4 px/ms(需足够慢才触发新唱片),释放阈值 0.9 px/ms(需更快才丢弃当前唱片)。两者之间形成死区,允许在已选中唱片内缓慢移动而不丢失焦点。文章指出单一阈值必然在防误触与易保持间妥协,而分离阈值同时实现清晰捕获与舒适保留。

Asymmetric Thresholds

网页鼠标悬停的速度门控

本文中 Velocity Gating 是针对唱片架悬停效果的完整方案,包含速度平滑、方向滞后和分离阈值三层机制,用于防止鼠标快速划过时出现频闪,同时保持响应性。文章对比了无速度感知时的逐帧触发问题,指出该方案在 120Hz 刷新率下每帧仅做一次同步决策,避免 React 中间渲染。最终效果是快速扫过时不触发,缓慢接近时立即抬起,兼顾稳定与即时反馈。

Velocity Gating

网页鼠标悬停的速度门控

本文中方向滞后根据光标移动方向动态调整捕获条件:朝向目标时半径扩大至 85% 宽度、速度阈值放宽 40%;远离时则收紧至 60% 宽度和原阈值。该机制让接近动作更宽容,离开动作更谨慎,避免光标从目标后方“抓回”已离开的唱片。文章通过可视化展示,说明轨迹判断使交互更符合真实意图。

Directional Hysteresis

网页鼠标悬停的速度门控

本文讨论为何不直接使用 Pointer Events API 的 movementX 属性计算速度:高刷新率屏幕下该值常为子像素抖动,且单次事件无法维持跨帧的平滑速度状态。作者转而采用手动 EMA 平滑来获得更稳定的信号,支持 velocity gating 的精确判断。

Pointer Events API

Markdown 协议生成 Agentic UI

本文描述的 Agentic UI 指由 LLM 实时生成并驱动的响应式界面原型。核心通过 mount() 原语将 React 组件挂载到聊天界面,支持表单提交、服务器到客户端的数据代理更新、LLM 流式 JSON 注入以及回调函数四种数据流动模式。结合流式执行与插槽机制,可在 LLM 生成过程中逐步渲染骨架与复杂内容,实现无需新对话轮次的交互反馈。

AI Agent

49MB 的贵物网页

本文将交互成本定义为用户阅读新闻前必须付出的精神与操作总负担。典型案例包括双重Google登录模态、需滚动越过巨幅广告、寻找低对比度关闭按钮等操作。作者指出此类设计源于广告竞价对停留时长与CPM的追求,属于系统性敌对架构,导致读者在获取5KB正文前已耗尽认知资源。

Interaction Cost

49MB 的贵物网页

本文引用Nielsen Norman Group(NN/g)定义交互成本,即用户达成目标所需的精神与体力总和。它还被用于说明新闻网站为提升注册指标而牺牲用户信任的长期后果,并列出其可用性启发式第8条“美观与简约设计”。文章以此批判现代新闻页面通过多重模态和广告侵占内容空间,显著提高了读者的交互成本。

Nielsen Norman Group

49MB 的贵物网页

本文将 Dark Patterns 定义为新闻网站为最大化广告指标而设计的反用户界面模式,例如双重模态弹窗、粘性自动播放视频以及侵入式布局偏移。这些设计迫使用户在阅读前执行多次点击和滚动,显著提高交互成本。文章指出,此类模式源于程序化广告拍卖的激励机制,属于以牺牲认知负荷换取 CPM 的敌对架构。

Dark Patterns

49MB 的贵物网页

本文提到新闻网站在自动播放视频的 sticky 播放器中,使用极小的关闭按钮,命中区域过小,直接违反 Fitts's Law,导致用户难以快速关闭视频。该设计增加了交互成本,让读者在阅读时持续受到干扰。文章指出这种微小目标区域是广告优化下的故意选择,而非偶然失误。

Fitts's Law

CSS 制作手机 mockup

本文以 iPhone 17 Pro 为原型构建 CSS 模拟组件,使用 2622×1206 像素比例计算高度,边角半径按宽度 0.12 比例缩放,并复刻 Dynamic Island、侧边按键及多层玻璃反光。所有视觉层叠加后形成逼真的金属边框与屏幕深度,最终通过 JavaScript 实现跟随鼠标的 3D 物理倾斜。

iPhone

CSS 制作手机 mockup

本文中 Dynamic Island 通过三个同心圆形 div 模拟灵动岛相机镜头,使用 borderRadius: 999 生成 pill 形状,并以径向渐变与内阴影营造镜头深度。zIndex 控制其位于图像上方、反光图层下方,保持设备真实结构感。

Dynamic Island

慢工出细活的乐趣

Not Boring Weather 是 Not Boring Software 推出的首款应用,最初仅作为思想实验。它采用 3D 模型、动画、音效和触觉反馈,像游戏一样设计天气体验,而非传统工具式应用。该应用后来成为系列产品的基础,体现了用有趣方式重塑日常软件的尝试。

Not Boring Weather

细节提升界面

本文提到 Framer Motion 适合实现带弹簧效果的图标动画和退出动画,比纯 CSS 更易控制。作者在图标上下文切换、菜单进入退出等场景中使用 motion.div,强调其支持可中断动画和精确过渡。相比 CSS 过渡,它更适合需要物理感的交互细节。

Framer Motion

细节提升界面

本文作者 Jakub Krehel 分享了十余个让界面更自然的细节技巧,并将这些内容整理成开源技能发布在 GitHub 上。技能通过 npx 命令安装,支持 Claude Code、Cursor 等平台,用户可在项目中使用 /skill 指令快速应用这些优化。

Jakub Krehel

Cloudflare 重新整理人机验证模块

Challenge Pages是Cloudflare在检测可疑活动时展示的全页安全拦截界面。本文介绍了其与Turnstile的统一 redesign,包括清晰状态提示、可操作的排查步骤、去除饱和红色背景,以及支持40+语言的视觉一致性,显著降低用户放弃率。

Challenge Pages

Cloudflare 重新整理人机验证模块

文章中团队决定为Turnstile小部件和Challenge页面建立统一的Information Architecture,所有状态采用相同视觉层级、文字位置和操作按钮布局。这一架构源于减少用户认知负担的原则,让错误提示和帮助链接在不同场景下保持一致位置。统一结构使数十亿用户无需重新学习界面,显著降低了挫败感。

Information Architecture

Cloudflare 重新整理人机验证模块

文章将传统CAPTCHA提供商的“I am human”统一文案作为对比对象,测试显示用户更喜欢Turnstile区分状态的提示语。Turnstile作为Cloudflare的验证组件,日均服务超76亿次,redesign目标是降低干扰同时保持安全。研究确认其状态式交互优于传统CAPTCHA做法,成为 billions 用户最常接触的界面。

CAPTCHA

Jetpack Compose Glimmer 设计幕后

David Allin Reese是Google高级视觉设计师,负责为显示型AI眼镜开发下一代界面,并主导Jetpack Compose Glimmer这一Android XR新设计系统的推出。本文由他撰写,分享了透明显示屏在色彩、排版、阴影和动画等方面的反直觉行为,以及如何通过重新定义“黑色”为容器、采用暗表面亮内容等策略,打造与现实世界和谐共存的ambient界面。

David Allin Reese

Jetpack Compose Glimmer 设计幕后

本文中,加性对比度用于衡量显示内容在真实环境下的可见度,计算公式为(环境亮度+显示亮度)除以显示亮度。团队发现高饱和度颜色在现实背景下容易消失,因此Jetpack Compose Glimmer采用中性界面,默认深色表面搭配亮色内容,以在各种光照环境中维持稳定对比和可读性。

加性对比度

Jetpack Compose Glimmer 设计幕后

文章尝试将 Material Design 的卡片、阴影等组件直接移植到透明显示屏,但因其依赖明亮不透明表面和微妙阴影,导致眩光、电池消耗增加及严重光晕,使文字无法阅读。最终放弃该方案,转而采用深色表面加明亮内容的反向策略,以适配加法显示特性并建立新的深度系统。

Material Design

Jetpack Compose Glimmer 设计幕后

光晕效应指明亮区域的光线向相邻暗区溢出形成模糊光晕的现象,在加法显示的 AI 眼镜上尤为明显。文章指出,使用浅色表面会使内容文字被光晕侵蚀而不可读,因此 Glimmer 强制采用深色表面、明亮内容,并通过对比图说明此举可避免光晕、提升各种环境下的可读性。

光晕效应

以感受为中心的设计

文章将iPhone列为非数据驱动创作的典范,指出其诞生并非源于指标优化,而是源于创造者的感受、意见与个人体验。作者以此反衬当下软件只追求点击率或留存率的做法,强调真正有灵魂的产品源于主观判断而非数字验证。

iPhone

以感受为中心的设计

文章描述早期操作系统和应用曾采用拟物化设计,界面借助现实生活隐喻帮助用户理解并融入日常。这种方式被视为带有创作者手感和人性温度的设计,与后来被算法主导的统一风格形成对比。

Skeuomorphism

MX Master 拇指滑轮妙用

本文将其作为 Chrome 等 Chromium 浏览器的备选扩展方案,用于定义自定义键盘快捷键,从而支持统一使用 Ctrl+Shift+Arrow 进行标签页切换,避免 BetterMouse 例外配置。

Shortkeys

MX Master 拇指滑轮妙用

Google Chrome 在本文中被列为特殊浏览器,无法直接响应 Ctrl+Shift+Arrow 切换标签。需在 BetterMouse 的 Exceptions 标签中为其添加例外,将 thumbwheel 映射为 ⌥⌘ ← / ⌥⌘ →,利用 Chrome 原生标签切换快捷键。文中建议对所有 Chromium 浏览器重复此操作,也可通过 Shortkeys 或 Vimium 扩展实现统一映射。

Google Chrome

上下文菜单不应该有图标

文章指出菜单中随意添加图标会增加用户解析符号的认知负荷,尤其当图标用途不明确时。作者反对将图标设为默认选项的做法,认为这源于设计者“需要填充空间”的心态,而非考虑实际帮助。苹果旧版 HIG 也警告任意符号会造成混淆,与 Tahoe 的新菜单形成对比,说明无意义图标反而降低菜单可用性。

Cognitive Load

上下文菜单不应该有图标

本文将上下文菜单定义为 Google Sheets 的右键菜单以及 macOS Tahoe 的系统菜单。作者批评默认给每个菜单项添加图标的做法,认为这造成视觉干扰和不一致问题,如 Safari 菜单中部分选项有图标、部分没有,却缺乏明确理由。文中对比 Finder 中窗口布局菜单的有用图标,指出只有当图标能帮助快速理解对齐方式时才值得使用,否则只是模板化填充。

Context Menu

上下文菜单不应该有图标

Human Interface Guidelines 是苹果多年发布的设计规范,本文引用其中“在菜单中使用符号”章节,明确指出不应使用任意符号以免造成视觉杂乱和用户困惑。作者指出 macOS Tahoe 的菜单做法与该指南及 2005、1992、2020 版示例直接冲突。

Human Interface Guidelines

上下文菜单不应该有图标

Apple 在本文中因 macOS Tahoe 菜单设计转变而受到批评,此前其系统长期避免为菜单项默认添加图标,但新版本却全面采用。作者认为这与苹果自身以往的简洁理念背道而驰,使说服他人“非必要不加图标”变得更加困难。

Apple

Apple 的系统级 URL 过滤 API 怎么样

本文中Apple首次为iOS和macOS提供系统级URL过滤官方API,支持全URL拦截并集成Privacy Pass、PIR、Bloom过滤器及Oblivious HTTP等隐私技术。文章指出该API能处理超大拦截列表且支持45分钟自动更新,但仅限阻断操作、无法提供反馈或调试工具,且开发者可能通过实现方式削弱匿名性。整体被视为操作系统厂商在系统级过滤上的重要进步,尽管存在明显局限。

Apple

如何构建 v0 的 iOS 应用

本文中 Liquid Glass 用于实现 iMessage 风格的浮动输入栏,具备渐进式模糊和交互变形效果。团队通过 @callstack/liquid-glass 的 LiquidGlassContainerView 与 LiquidGlassView 包裹输入组件,同时 Zeego 菜单也自动呈现 Liquid Glass 样式。配合 KeyboardStickyView 与绝对定位,使输入栏始终悬浮于滚动内容之上,并随键盘状态平滑调整位置。

Liquid Glass

如何构建 v0 的 iOS 应用

本文中该库是 v0 iOS 聊天体验的核心依赖之一,与 LegendList、Reanimated 共同支撑消息列表。团队基于其提供的 useKeyboardHandler 等钩子,自行封装了约 1000 行代码的 useKeyboardAwareMessageList,用于处理键盘打开、收起、交互拖拽及 iOS 26 Beta 版本的兼容问题。借助该库,聊天界面实现了键盘弹出时内容自然上移、空白区域动态收缩等原生级手感,避免了多次渲染抖动。

React Native Keyboard Controller

如何构建 v0 的 iOS 应用

Reanimated 用于管理聊天动画的共享值与 worklet,包括首条消息淡入滑出、助手消息分步出现及键盘交互逻辑。团队通过 useAnimatedReaction 与 useAnimatedProps 在 UI 线程实时更新 contentInset 与高度,避免了重渲染导致的卡顿。

React Native Reanimated

通过 MobileGestalt 在 iPhone 上启用 iPadOS 特色功能

作为iPadOS核心功能之一,Stage Manager在文中通过修改MobileGestalt键qeaj75wk3HF4DwQ8qbIi7g在iPhone上被启用。结合其他Medusa相关键值,可实现应用窗口化、iPadOS Dock和多任务界面。Duy Tran的演示视频展示了该功能在iPhone 17 Pro Max上的实际效果。

Stage Manager

macOS 时钟应用的囤积癖

文章指出用户通过 Apple Support 多次尝试修复,但仅删除 plist 文件可恢复功能。Apple 曾在 Sequoia 中修复过该属性列表相关 bug,却可能引入新问题,导致 mobiletimerd 持续累积 MTTimers 数据。最终需由 Apple 修复此累积导致的内存限制崩溃缺陷。

Apple

游戏设计之道

在反馈部分,本文将Affordance列为玩家需获知的可用动作提示,例如知道存在油门踏板。它帮助玩家识别可执行的动词,是操作循环启动的前提。缺乏清晰Affordance会导致玩家无法有效参与互动循环。

Affordance

Linear 重构液态玻璃

Liquid Glass 是 Apple 新推出的流体玻璃设计系统,强调半透明、深度与实时光照。Linear 团队提取其美学特质,自行实现高斯模糊、SDF 法线贴图与动态光源效果,同时放弃折射以避免影响专业界面的可读性,并确保 Increase Contrast 模式下的可访问性。

Liquid Glass

Linear 重构液态玻璃

Apple 在 WWDC 发布 Liquid Glass 设计语言,延续了 Aqua 的半透明与光泽美学,同时需兼容各类消费应用。文中指出其 API 无法满足 Linear 所需的导航自定义灵活性,且 iOS 26 Beta 期间仍持续调整,促使 Linear 选择完全自建材料系统。

Apple

降低 Liquid Glass 效果

Smart Stack 是 watchOS 26 中的堆叠小组件示例。在默认 Liquid Glass 效果下,其背景会透出墙纸;开启 Reduce Transparency 或 Increase Contrast 后,背景变为不透明,图标对比度提升,便于阅读。

Smart Stack

降低 Liquid Glass 效果

Liquid Glass 是苹果在 macOS 26、iOS 26 等系统中推出的透明与模糊效果界面设计,许多用户觉得它分散注意力或降低可读性。本文围绕如何通过无障碍设置减少其影响展开,重点介绍 Reduce Transparency、Increase Contrast 等选项在各系统中的实际效果与区别。作者还提及 macOS 中可通过 Terminal 命令完全关闭该效果,但不推荐使用。

Liquid Glass

下班是为了休息

本文将Slack描述为日常工作中的主要干扰来源之一。同事通过Slack提问会频繁打断专注状态,与会议、午休等因素共同导致难以获得连续数小时的不间断工作时间。作者以此说明为什么大任务常需在工作日结束时才能进入深度推进。

Slack

Spotify 的专职排版师

Spotify 作为全球最大流媒体平台,专门设立排版专家岗位,负责其设计系统 Encore 的字体维护与创新。此前多数公司仅由产品设计师兼职处理字体问题,Spotify 则从 2022 年起将其列为核心工作,支持 192 个市场、74 种语言的本地化字体定制,目标是让文本在跨平台产品中更具表现力和文化相关性。

Spotify

Paper (Alpha) 体验

文章指出 Paper 的属性面板与 Sketch 保持一致,宽高与坐标相邻,无需额外点击即可连续 Tab 输入。作者回忆曾因 Figma 早期卡顿而回退使用 Sketch,暗示 Sketch 在传统桌面设计工具中的参考地位。Paper 选择沿用类似 Sketch 的交互逻辑,而非完全跟随 Figma 的 UI3 改版。

Sketch

设计案例:NotebookLM

本文中 Mental Model 是 NotebookLM 的核心设计基础,围绕「输入来源—聊天交互—生成输出」的创作旅程构建线性却灵活的流程。设计师通过这一模型帮助用户在单一界面完成从整理资料、提问合成到产出笔记、学习指南和 Audio Overviews 的全过程,避免了多标签切换的碎片化体验,让新 AI 交互保持清晰且易懂。

Mental Model

Apple 新系统 Webview 中的私有 CSS

本文中 Apple 在 2025 年 WWDC 推出 Liquid Glass 设计语言,并通过 WebKit 实现私有 CSS 属性 -apple-visual-effect,使其能在网页内容中应用玻璃材质效果。该功能需配合 WKWebView 的私有设置才能生效,目前无法公开用于网页或 App Store 审核的应用。文章推测 Apple 已在内部使用该特性实现无缝集成的 webview。

Apple

Apple 新系统 Webview 中的私有 CSS

Liquid Glass 是 2025 年 WWDC 推出的新软件设计,被视为自 iOS 7 以来 UI 的最大变革。本文发现其可通过 -apple-visual-effect 私有 CSS 属性在 WKWebView 中应用于网页内容,支持 -apple-system-glass-material 等材质值,并可配合 @supports 规则实现优雅降级。

Liquid Glass

Liquid Glass in the Browser

Liquid Glass 是本文核心主题,指 Apple 设计的弯曲玻璃 UI 效果,依赖光线折射与镜面高光。文章通过表面函数、位移向量场和 SVG 滤镜,从数学原理逐步构建浏览器端近似实现,并演示了搜索框、开关等真实组件效果。

Liquid Glass

Liquid Glass in the Browser

本文中 Apple 于 2025 年 6 月的 WWDC 上首次推出 Liquid Glass 效果,使界面元素呈现弯曲折射的玻璃质感。文章以此为原型,聚焦如何通过网页技术近似复现其核心折射与镜面高光,而非追求像素级一致。

Apple

太空侵略者生成器

交互动画部分采用 Anime.js 驱动入侵者肢体与眼睛的逐帧移动。代码先复制触手与角的中线、随机偏移端点,再重新计算粗线并像素化,生成第二帧;同时把眼睛平移一个像素,营造经典双帧动画效果。

Anime.js

Comet 的 Agent Prompt 注入风险

本文相关文章提及Opera Neon存在提示注入缺陷,攻击者可将恶意指令嵌入隐藏HTML元素或不可见标记中,这些内容对用户不可见却能被AI助手完整读取,类似Comet面临的风险。

Opera Neon

缩放图像带来 AI 的即时注入风险

Google Assistant(Android 手机版)被本文列为成功实施图像缩放攻击的目标之一。攻击图片在用户视角正常,但在模型输入端触发多模态提示注入,验证了该漏洞在消费级语音助手上的存在。

Google Assistant

macOS 上游戏分辨率渲染问题

本文中Apple指提供macOS显示与全屏API的公司。其CGDisplayCopyAllDisplayModes函数返回的模式列表混杂了含刘海区域的完整屏幕分辨率与菜单栏下可用区域的分辨率,导致多数AppKit全屏游戏默认选用错误尺寸,画面被压缩模糊。作者已提交反馈FB13375033并指出,Apple需更新游戏HIG、改进CGDisplayMode筛选能力、完善Game Porting Toolkit示例,或提供新的游戏专用API以解决刘海屏适配问题。

Apple

macOS 上游戏分辨率渲染问题

文章提到 Apple 的游戏 HIG 未说明刘海屏对全屏分辨率的影响。作者建议更新 HIG,增加如何获取可用分辨率列表的指导,以帮助开发者避免默认使用错误模式。

Human Interface Guidelines

1984 年至 2004 年 Mac 系统设置变化

1994年随Mac OS集成到控制面板的窗口遮挡功能,源自第三方应用,通过标题栏双击实现窗口最小化视觉效果。它成为用户喜爱的特色,与Windows形成差异,但2001年后被Dock最小化取代,仍有用户多年后怀念其操作手感。

WindowShade

1984 年至 2004 年 Mac 系统设置变化

本文用“拟物化”指1998年Appearance面板中被认真考虑的视觉主题,如Drawing Board将拟物化推向极端。文章描述这些主题包括Gizmo的浮夸、Hi-Tech的暗黑预言以及大量音效与字体实验,最终因品味缺失而放弃。作者将此视为Mac OS 8.5时期“坏的趣味”代表,与早期简洁的控制面板形成鲜明反差。

Skeuomorphism

1984 年至 2004 年 Mac 系统设置变化

2003年Mac OS X Panther中新增的窗口管理功能,紧邻Dock设置面板推出,最初作为品牌化特性,后演变为系统通用功能。与WindowShade类似,体现了从专有工具到标准操作的转变。

Exposé

平板端和移动端的 Blender 如何适配交互

Microsoft Surface 是文中列举的平板设备之一,与 iPad、华为 MatePad 等共同构成 Blender 计划支持的多点触控平台范畴。文章强调核心设计原则适用于所有此类设备,相关 UI 改进将惠及现有平板用户。

Microsoft Surface

缓动函数各有千秋

Kinematic easing 是 Apple 论文中的参数化 easing 方案,支持控制 anticipation 与多次振荡。文中指出其工作流存在摩擦:修改振荡次数会同时改变动画速度与超调幅度,阻尼为 0 时末端还会出现运动曲线突变。

Kinematic Easing

缓动函数各有千秋

本文中 easing function 用于将线性 progress 转换为非线性运动,从而让动画呈现 slow in slow out 的自然效果。作者指出常用 stock 函数如 easeInOutCubic、easeOutElastic 等虽能减少机械感,但选择有限,难以针对 procedural animation 创造独特运动。

Easing Function

缓动函数各有千秋

本文作者Dave Pagurek讨论了缓动函数在程序化动画中的重复性和灵活性不足问题,并分析了苹果运动学函数、卷积滤波及反馈控制等替代方案。他指出这些方法各有参数调节不便或缺乏预期动作等缺点,期待进一步改进以更好地服务运动图形创作。

Dave Pagurek

缓动函数各有千秋

Robert Penner 于 2001 年创建了被广泛使用的 easing 函数库。文中提到开发者常直接复制其 easeInOutCubic 等函数来实现非线性进度,作者认为这些经典实现虽实用,但重复使用限制了动画的独特性。

Robert Penner

缓动函数各有千秋

Apple 发表论文提出参数化 kinematic easing 函数,可调节 anticipation、overshoot 次数与阻尼等属性。作者实际使用时发现参数相互影响,调整振荡次数会改变频率与超调量,需反复微调多个参数才能达到预期效果。

Apple

在 OpenAI 工作是什么感受

文章指出 OpenAI 内部几乎所有沟通都依赖 Slack,没有使用邮件。作者提到若不主动管理频道和通知,信息流会非常干扰工作;但若做好筛选,仍可高效运作。这反映了公司高度依赖即时消息工具的沟通方式,也与快速扩张带来的信息过载问题相关。

Slack

为老年用户设计防骗的界面交互

文章将 UX 摩擦力定义为有意设计的验证步骤或警告,用于保护用户而非阻碍操作。在针对老年用户的场景中,这种摩擦力可通过交易确认提示或位置验证,帮助用户在转账等高风险操作前重新思考,降低被骗风险。作者强调,合理应用的摩擦力能让犹豫成为自然反应,成为防诈骗的第一道 UX 防线,尤其适用于银行 App。

UX 摩擦力

为老年用户设计防骗的界面交互

文中指出老年用户因处理速度减慢、工作记忆下降而面临更高认知负荷,多步骤操作与布局变化易引发焦虑,诈骗者常利用此弱点;良好UX通过简化设计可有效降低该负荷。

Cognitive Load

为老年用户设计防骗的界面交互

文章将UX定义为防御诈骗的关键工具,强调通过线性流程、明显安全提示、清晰措辞和高对比界面减少用户错误,尤其帮助老年用户识别风险并在银行类应用中嵌入验证摩擦。

UX

为老年用户设计防骗的界面交互

文章以 Gmail 为例展示良好警报 UX:平台用黄色横幅和警告图标突出显示伪造地址或冒充尝试。这种视觉提示能在用户打开可疑邮件时提供即时风险提醒,帮助非技术用户尤其是老年人识别钓鱼企图。作者将其归类为邮件平台层面的诈骗防御设计。

Gmail

苹果新的基座模型性能如何?

本文中 Apple 更新了 Apple Foundation Models 系列的设备端与云端视觉语言模型,旨在追赶竞争对手。它同时发布了 Foundation Models framework API,允许开发者在已启用 Apple Intelligence 的设备上调用设备端模型。文章指出 Apple 在生成式 AI 领域被视为落后,Siri 升级延期且面临集体诉讼,但其对 iOS 的控制权为模型推广提供了巨大优势。

Apple

Liquid Glass 之外 Apple 的改变

本文说明 iPadOS 26 的 Split View 放弃了此前花哨的分屏交互,转向 macOS 风格的窗口设计。用户可通过右下角手柄自由调整 App 宽高比例,并新增窗口控制标识与菜单栏。非适配 App 也能以窗口形式运行。

Split View

Liquid Glass 之外 Apple 的改变

文中描述 Scroll Edge Effects 为日历等 App 顶部和底部的渐变过渡效果。在 iOS 上多采用 Soft 模式,macOS 的 Finder 等应用则使用 Hard 模式以增强对比。滚动时阴影减轻,边缘效果更明显,但 macOS 适配仍存在间距与截断问题。

Scroll Edge Effects

Liquid Glass 之外 Apple 的改变

本文多次引用 HIG 中 Materials、Toolbars 和 Search fields 章节,说明 Liquid Glass 应仅用于功能与导航元素且不建议内容层叠加使用;开发者需遵循图标优先、避免文字与图标混用等新规则,但作者质疑这些指南在实际 App 中的执行导致了用户体验的妥协与混乱。

Human Interface Guidelines

Liquid Glass 之外 Apple 的改变

文章指出 iOS 26 相机 App 改进了 Action Sheets 机制,弹出位置不再固定底部,而是依据触发源动态调整。该变化被视为新设计语言下的一次交互妥协,部分功能仍保留底部弹窗形式。

Action Sheets

Liquid Glass 之外 Apple 的改变

本文中 Apple 作为设计系统的推动者,在 iOS 26、macOS 26 和 iPadOS 26 中引入 Liquid Glass 新视觉语言,试图通过着色器技术实现 Only Apple Can Do 的差异化,但因 beta 阶段工期紧张导致大量界面适配失误和交互倒退,作者批评其陷入形式主义并呼吁回归实事求是的设计路线。

Apple

Liquid Glass 之外 Apple 的改变

本文将 Liquid Glass 定义为用于控制和导航元素的浮动材质层,通过折射、边缘高亮和 HDR 效果让下方内容若隐若现以增加深度,同时保持可读性;它主要应用于 tab 栏、侧边栏和工具栏,却因背景干扰过强、眩光问题以及 macOS 适配不足而被指责为视觉优先的仓促产物。

Liquid Glass

Liquid Glass 之外 Apple 的改变

本文描述 iPadOS 26 发生重大转向,放弃此前分屏花哨交互,转而采用类似 macOS 的窗口化设计,支持右下角手柄自由调整尺寸并加入窗口控制和菜单栏;非适配 App 也能以窗口形式运行,视觉上与 macOS 更统一,但仍需重新组织结构以适应侧边栏。

iPadOS

前端构建无障碍的便利之处

文章引用 Jakob Nielsen 的观点,认为传统无障碍推广已失败,需尝试新策略。作者借此提出用自利理由而非道德劝说来推动开发者实践,呼应 Nielsen 关于生成式 UI 可能改变现状的看法。

Jakob Nielsen

2025 年汉堡图标辨识度如何

本文由Nielsen Norman Group发布,总结了该机构2015-2016年针对汉堡菜单的定性和定量研究结果,以及2025年针对图标可识别性的新研究。文章指出,尽管汉堡菜单如今更常见,但隐藏导航仍会增加交互成本,建议谨慎使用。

Nielsen Norman Group

2025 年汉堡图标辨识度如何

本文引用Nielsen Norman Group过去定性与定量可用性测试,证明汉堡菜单导致内容参与度下降、任务完成时间增加;近期针对数十个图标的识别测试显示,用户多能正确判断其为菜单功能,但未重新测量任务指标。测试强调位置和标准样式的重要性。

Usability Testing

2025 年汉堡图标辨识度如何

文章指出,即使汉堡菜单图标如今已被多数用户识别,隐藏导航仍会增加交互成本,因为用户需额外点击才能看到菜单项。结论强调这种代价并未因熟悉度提升而消失,重要内容仍处于视线之外。建议在空间受限时才使用,并配合其他导航方式降低成本。

Interaction Cost

2025 年汉堡图标辨识度如何

汉堡菜单是本文核心主题,指用三条横线表示的隐藏主导航图标。2015-2016年研究显示其降低任务成功率、增加用时;如今用户识别度显著提升,尤其在左上角标准位置,但仍可能被误认或增加交互成本,需遵循标签、动画和对比度等设计原则。

Hamburger Menu

iPad 加入多任务处理后依然是 iPad

Slide Over是iOS 9引入的iPad浮动窗口模式,与Split View共同构成早期多任务基础;文章中提到iPadOS 26允许用户选择保留该模式或Stage Manager,或完全关闭以维持传统全屏体验,体现对不同用户习惯的兼容。

Slide Over

iPad 加入多任务处理后依然是 iPad

Split View于iOS 9与Slide Over一同推出,是早期iPad多任务方案,针对当时硬件性能设计为两个应用并排运行;本文指出其受限于中低端旧机型,无法支持动态窗口或多显示器,直到iPadOS 26新系统才提供更广泛的窗口化替代方案。

Split View

iPad 加入多任务处理后依然是 iPad

Stage Manager 是 iPadOS 16 尝试的窗口化多任务模式,仅限新款高端 iPad 使用且兼容性差。本文指出其最大问题在于设置过高门槛,新 iPadOS 26 将其保留为可选模式,同时推出更广泛兼容的默认窗口系统。

Stage Manager

iPad 加入多任务处理后依然是 iPad

在本文中,Apple 是开发 iPadOS 多任务功能的公司,其高管接受采访解释为何 Mac 式窗口操作耗时多年才落地。文章指出早期 iPad 受硬件性能与触控优先设计限制,无法支持动态窗口与多任务,如今硬件升级后才实现更接近 Mac 的体验,同时保留 iPad 自身交互特性。

Apple

UI 的新时代:物理性质

文章将Dynamic Island视为Physicality时代的典型案例,其界面像粘性液体般具备表面张力、动量和方向性运动模糊,能随交互自然形变融合。这与早期静态拟物或扁平设计不同,体现了界面“活化”的新原则。

Dynamic Island

UI 的新时代:物理性质

文章描述Siri新动画呈现为物理化的光晕或火雾状物质,会被设备边缘吸引并随按键或语音触发而流动,具备真实气态物体的动态特性。它被用作Physicality设计语言在现有iOS中的例证。

Siri

UI 的新时代:物理性质

本文将 Apple 定位为即将推出大规模 UI redesign 的公司,其 iOS、macOS 等系统正酝酿自 iOS 7 以来的最大变革。文章想象 Apple 设计团队可能把 visionOS 的物理性原则扩展到 iPhone、Mac 和 iPad,让界面元素拥有维度、光影响应与真实材料感。作者认为这将使设备玻璃屏幕“活”起来,匹配硬件质感,成为品牌设计语言统一的核心。

Apple

UI 的新时代:物理性质

iOS 7 时代引入的视差效果,让图标与壁纸处于不同平面,从而产生浮动感,用动态方式区分层次,取代静态阴影。该效果后来被大幅弱化,但体现了从静态到自适应界面的转变。

Parallax Effect

Honk 已不在,原 Honkish 永存

文章中提到与 Ethan Mueller 合作,为 Honk 应用打造自定义声音效果。他先设计功能,再根据交互时机创作匹配的音频,覆盖添加好友、游戏、导航等多种场景,提升了整体的趣味性和实时反馈体验。

Ethan Mueller

Honk 已不在,原 Honkish 永存

Honk通过大量微交互提升趣味性,例如通知边框倒计时动画、删除操作背景变红、输入时垃圾桶填充摇晃效果、表情实时飞行碰撞、Magic Words触发局部表情爆发,以及自定义Honk按钮与声音设计。这些细节让日常操作变得意外且令人愉悦。

Micro-interactions

Demis Hassabis 谈 AGI

Gemini Live是本次大会重点推出的用户功能,由Project Astra技术驱动。本文中Demis Hassabis认为它对普通用户最具影响,能让用户直观感受到AI已超越此前预期,实现更自然的实时交互与多模态能力。

Gemini Live

致 2025 年 Arc 用户的信

Scott Forstall曾直接向团队反馈Arc像“萨克斯管”——功能强大却难以上手,并建议改成“钢琴”,即任何人都能立即使用的产品。这一比喻成为Dia设计的核心理念:通过熟悉界面隐藏复杂性,优先追求简单而非新奇功能。

Scott Forstall

Honk 已不在,原 Honkish 永存

Honk采用的实时消息模式与传统应用不同,没有发送按钮和历史记录,每个字符输入时即同步显示给对方,包括打字、修改与犹豫过程。用户可随时点击清空屏幕重新开始,这种方式让对话更接近实时白板,但也让部分用户感到压力或兴奋。

Real-time Messaging

Honk 已不在,原 Honkish 永存

Honk持续探索在场感的呈现方式,包括好友进入时头像边框填充动画与音效、离开时挥手表情、输入时气泡动态缩放、双方同时输入时屏幕对半分割,以及离开应用时头像虚线化。多人游戏也要求双方同时在线,否则暂停,强化了共享空间的真实感。

Presence Design

Motion+ 新增 cursor 属性

Matt Perry 是本文作者,文章发布于 2025 年 5 月 13 日。他详细介绍了 Motion+ Cursor 新增的磁吸光标和分区功能,并演示了 useMagneticPull 钩子的用法,用于实现元素与光标的相互吸引效果。

Matt Perry

Motion+ 新增 cursor 属性

本文中 useCursorState 是 Motion+ Cursor 提供的钩子,用于检测光标进入或离开由 data-cursor-zone 属性定义的区域。当光标悬停在不同区域时,该钩子可触发状态变化,实现光标内容渲染、颜色、混合模式或大小形状的动态调整,让开发者能根据页面分区自由定制光标行为。

useCursorState

Motion+ 新增 cursor 属性

Motion+ Cursor 是 Motion 的高级光标组件,支持 React 和 Vue 框架。它新增磁吸与分区功能,让光标能吸附到目标元素、根据 snap 强度决定贴合程度,并默认使用布局动画变形匹配目标形状,也可禁用变形。该组件通过简单 API 可快速实现浮动提示、图像预览或完整光标替换等效果,使光标能动态响应页面内容。

Motion+ Cursor

Motion+ 新增 cursor 属性

useMagneticPull 是 Motion+ Cursor 新增的钩子,当指定 ref 成为活动指针目标时,返回的 x/y motion values 会产生偏移,实现元素向光标拉动的相互吸引效果。该钩子既可与自定义光标结合使用,也可独立运行,适用于需要双向磁吸交互的场景。

useMagneticPull

GTA VI 网站动画使用 GSAP 驱动,Motion 不服

Matt Perry为本文作者,隶属Motion团队。他在文章中通过剖析GTA VI网站性能问题,展示Motion的批处理frameloop、延迟关键帧与原生API如何降低启动耗时,并制作对比测试验证效果,同时强调工具选择需结合具体项目需求。

Matt Perry

Zed 如何将界面优化到 120 fps

Core Animation 负责图层合成与事务协调。GPUI 通过 CAMetalLayer 的 presentsWithTransaction 属性,将 Metal 呈现绑定到当前事务,确保直接模式下窗口内容与系统合成时序一致,减少了因异步呈现导致的延迟和不稳定。

Core Animation

App Stacks,知名产品幕后访谈

Framer 是 appstacks.club 网站的生成工具,页面元数据中明确标注 generator: Framer f2f96df,表明该站点由 Framer 平台创建并发布。

Framer

HDR Emoji

Slack 是本文核心应用场景,用户可将 HDR 处理后的图片作为表情符号上传使用。在支持 HDR 的硬件上,这些图标会以更高亮度渲染,从而在聊天反应中更显眼。文章指出该功能在 Slack 桌面端基本可用,但移动端支持有限。

Slack

深入锚点链接

用户体验是本文所有方案的核心评价标准。简单方案可能导致标题堆叠或偏离理想触发线,而优化后的映射函数通过平滑调整和约束条件,使滚动距离与内容长度更匹配,减少用户感知误差,提升整体阅读舒适度。

User Experience

深入锚点链接

文章末尾提到Motion库被用于35®的动画实现,实习生可借此处理滚动与触发状态的平滑过渡。这与本文最终采用的smoothstep映射函数在视觉反馈层面的目标一致,共同提升锚点交互体验。

Motion

CSS、iOS 和 Android 的阴影参数转换

本文实验确认 Sketch 的投影效果与 CSS、Figma 匹配,模糊半径遵循相同规则,无需额外调整。文章通过并排对比图展示三者阴影视觉一致,仅与其他平台存在比例差异。Sketch 被列为可直接与 CSS 互换的设计工具之一。

Sketch

Figma 图片导入导出的注意事项

本文提到 Sketch 曾发布关于色彩配置文件的文章,并提供了 Display P3 与 sRGB 色彩范围对比图。该图显示 P3 色域更大,支持更鲜艳的色彩。本文引用此图帮助读者直观理解为何需在 Figma 中保留宽色域截图质量。

Sketch

Our interfaces have lost their senses

文章指出多模态交互是将语音、手势、视觉和空间元素等多种方式结合使用,让用户能同时进行不同感官操作,例如边点击边说话或边听边看。这能突破纯文本输入的限制,支持更自然的思考与协作方式。作者认为这是未来界面设计的核心,可让界面更好地匹配人类认知习惯,而非仅服务于机器逻辑。

多模态交互

Our interfaces have lost their senses

文章提到数据音化可通过声音传达警报、背景信息和数据模式,例如使用微妙音效或 sonification 突出趋势。作者质疑为何多数网页界面保持无声,并建议用音频编码信息来辅助视觉展示。这有助于界面利用听觉进行并行感知,提升用户体验的沉浸感。

数据音化

Duolingo x Rive x AI

Rive 是 Duolingo 用于构建交互式动画的体验引擎,支持实时响应用户输入和 AI 数据。在本文中,Duolingo 用它实现 Lily 的动态表情、动作和对话流程,最终文件大小控制在 1MB 以内。相比传统预烘焙动画,Rive 减少了工程开销并提升了性能,让 AI 对话感觉更生动。

Rive

用户界面古往今来

文章围绕 Wattenberger 的观点讨论触觉反馈缺失问题,指出触摸屏虽流行却缺乏实体摩擦感,主张保留实体按键、旋钮等硬件反馈。作者认为触觉体验更适合现实硬件,而非软件界面,并质疑“摩擦”能否成为主流卖点。

Tactile Feedback

Duolingo x Rive x AI

Rive State Machine 是 Duolingo 实现 Lily 实时反应的核心系统,能动态混合动画并处理情绪过渡。它组合 8 种头部与 8 种身体动画生成 64 种以上中性动作变体,避免重复循环。团队借此处理用户延迟或模糊输入,让 Lily 自然地“思考”或“困惑”,同时大幅降低文件大小。

Rive State Machine

Our interfaces have lost their senses

文中指GUI阶段大量采用拟物化设计,在屏幕上模仿现实世界的物理控件,如数字开关、平滑滑块和文件夹图标,以增强视觉和操作熟悉感。这种方式在当时被广泛使用,但后来逐渐被扁平化设计取代,导致触感进一步流失。

Skeuomorphism

Our interfaces have lost their senses

对话式界面主要指当前大量出现的AI聊天机器人,用户需通过纯文本输入完成图像编辑、设置调整和信息获取等任务。作者认为这导致质感、颜色、形状等感官维度进一步丧失,界面从交互式控件退化为单一文本框,缺乏多模态反馈。

对话式界面

用户界面古往今来

The Mother of All Demos指Engelbart 1968年的NLS演示事件,首次公开呈现协作工具、超文本和鼠标交互等技术。本文以此命名事件作为讨论用户界面演变的开端,强调其对后续产品的影响。

The Mother of All Demos

Our interfaces have lost their senses

文章将触觉反馈描述为通过振动或力反馈向用户传递被动信息,用于提醒或表达模式,尤其适合手机等设备。作者指出当前网页界面大多缺乏触觉,建议加入此通道以提供背景感知,减少对视觉的依赖。它被视为恢复界面感官丰富性的重要手段之一。

触觉反馈

Our interfaces have lost their senses

文章指出LLM让语音输入变得更实用,用户可通过说话表达松散想法或进行粗略导航,而无需精确打字。这降低了纯文本界面的摩擦,支持从口头思考快速过渡到结构化操作。作者将其视为推动多模态界面复兴的关键技术,能让界面更好地适应人类自然的表达方式。

LLM

Our interfaces have lost their senses

文章将直接操纵定义为点击、拖拽、轻触、滑动和捏合等直观操作,能让用户直接作用于屏幕对象,尤其适合空间任务和移动场景。作者肯定触摸屏带来的直接性,但批评其导致界面扁平化、失去实体触感。相比AI聊天框的文本命令,直接操纵被视为更符合人体工程学的交互形式。

Direct Manipulation

用户界面古往今来

oN-Line System是Engelbart在1968年展示的系统,包含视频会议、嵌入图形、复制粘贴和超文本等创新功能,所有操作通过鼠标键盘完成。本文指出它是众多现代计算概念的源头,用于引出桌面界面长期未变的话题。

oN-Line System

Duolingo x Rive x AI

Jasmine Vahidsafa 是 Duolingo 的高级动画师,负责本文中 Lily 的 Rive 动画实现。她提出用模块化组件和 State Machine 替代固定脚本动画,强调每周迭代交付与逻辑命名的重要性。她还建议新手先掌握 State Machine 基础、保持组织性并采用可复用组件思维。

Jasmine Vahidsafa

Our interfaces have lost their senses

触摸屏允许用户直接戳击屏幕元素,被描述为直观美妙的交互方式,但也把所有操作限制在单一玻璃平面后。它标志着界面彻底进入“平坦世界”,进一步剥离了物理纹理、声音和多角度操作的可能性。

触摸屏

AI 幻觉设计指南

本文指出,应对AI幻觉的界面设计模式借鉴HCI研究文献证据,包括不确定性语言表达、置信度评分、多响应一致性检查和来源展示等方法。这些模式帮助用户在高风险场景中评估输出可靠性。文章强调HCI方法可提升AI透明度,减少用户不信任,同时指出实际落地可能需要超出标准LLM集成的自定义开发。

Human-Computer Interaction

AI 幻觉设计指南

本文由Nielsen Norman Group发布,作者Page Laubheimer于2025年2月7日撰写,聚焦设计师应对AI幻觉的实操策略。该机构通过分析用户信任挑战,提出基于HCI研究的界面设计模式,包括情境化警告、置信度展示和来源引用等。文章总结了这些模式如何在不增加用户认知负荷的前提下,降低幻觉带来的负面影响。

Nielsen Norman Group

用户体验内容测试的几种方法

本文作者,在Smashing Magazine发表文章,介绍如何通过简单测试方法评估用户对页面内容的理解与感知。他强调内容测试不仅要发现困惑点,还要检验内容是否清晰传达设计意图。

Vitaly Friedman

用户体验内容测试的几种方法

本文指出 Miro 可作为内容热力图测试的远程工具,支持高亮标记功能。测试时参与者针对给定任务高亮清晰或困惑的文字,研究者据此绘制热力图识别趋势。该方式便于远程收集用户对内容感知的反馈数据。

Miro

用户体验内容测试的几种方法

本文将A/B测试列为内容测试方法之一,主要用于判断哪种措辞最合适。它与卡片分类、树状测试并列,针对“什么词最有效”这一问题,帮助设计师比较不同版本的文案对用户理解的影响,从而优化页面表达的清晰度。

A/B Testing

用户体验内容测试的几种方法

本文通过香蕉测试来检验设计是否匹配用户的心理模型。该方法能揭示用户对操作、图标和交互的真实感知,帮助确认设计是否与用户预期一致。

Mental Model

用户体验内容测试的几种方法

本文发布平台,刊登了Vitaly Friedman关于UX内容测试的文章。平台同时提供UX系列内容与设计模式资源,聚焦前端与用户体验实践。

Smashing Magazine

用户体验内容测试的几种方法

Card Sorting 在文中指让用户将主题分组到有意义的类别中。本文将其归为检验“哪个词最合适”这一问题的测试方法,与 A/B 测试、树状测试并列。该方法有助于优化信息架构与措辞选择,提升内容匹配用户心智模型的程度。

Card Sorting

SWOT 分析

本文由Nielsen Norman Group发布,该站点专注于用户体验与设计研究,本文是其战略工具系列中的一篇,主题为SWOT分析在产品与组织定位中的应用。文章链接与排版均来自该站点,内容强调将SWOT与UX研究方法结合以获得更可靠的市场洞察。

Nielsen Norman Group

SWOT 分析

本文建议在SWOT分析中使用SUS等可量化指标来支撑优势或劣势的判断,避免主观臆断。SUS被列为可用性衡量标准,与NPS、CSAT等一起,帮助团队将内部评估建立在客观证据基础上。

SUS

SWOT 分析

本文将竞争性可用性测试定位为获取竞争对手真实表现数据的主要研究方式之一。通过简短的可用性测试,团队可直接观察竞争产品在可用性方面的强项与弱点,从而为SWOT矩阵的威胁与机会象限提供客观依据。该做法能避免仅凭主观假设填充外部因素,帮助团队基于事实调整战略方向。

竞争性可用性测试

macOS 里的 System Data 存储了什么?

本文中Apple指提供macOS及Storage Settings功能的苹果公司。其分类说明将System Data定义为已用空间减去其他类别后的差值,并非严格的系统文件。文章指出该估算常包含缓存、APFS快照等内容,且Apple未提供针对性清理工具,同时macOS类别会单独显示Apple Intelligence占用空间。

Apple

macOS 小技巧

本文在窗口管理章节提及 Stage Manager 功能,作为 macOS Sonoma 的多窗口组织工具。重点技巧是按住 Shift 键点击窗口,可将该窗口添加到当前舞台而非替换现有布局。此操作帮助用户灵活管理多应用窗口布局,提升桌面空间利用效率。

Stage Manager

RSS 筛选更好的信息

文章结尾推荐列表中,Nicky Case 的博客被列为优质 RSS 来源,其内容以酷炫的交互式解释为主,适合首次接触 RSS 的读者订阅。

Nicky Case

attr() 新特性:可赋予变量类型

View Transitions API 在 Bramus 的文章中被用来演示增强版 attr() 的组合用法。通过属性驱动的视图过渡,可进一步减少 JavaScript 代码,实现更流畅的界面切换效果。

View Transitions API

Sketch Smart Animate

Magic Move 是 Keynote 中的动画功能,本文指出 Smart Animate 的工作原理与之类似,用户可快速上手。通过匹配同名元素在不同画板间的变化,自动生成平滑动画效果,适合熟悉 Keynote 的设计师迁移使用。

Magic Move

Sketch Smart Animate

Smart Animate 是 Sketch 原型功能的新增动画类型,能自动检测多个 Artboard 上同名图层的属性变化并生成平滑过渡动画。用户需在 Inspector 的 Prototype 面板选择该类型,还可调整时长和缓动曲线;文章展示了其在进度指示、渐进披露、导航和抛光细节等场景的应用,并提供四个演示文档供参考。

Smart Animate

Sketch Smart Animate

文中说明创建 Smart Animate 过渡时,可同时设置 duration 和 easing type 来控制元素移动节奏。不同的 easing function 能让大小、位置或透明度变化呈现更自然的加速或减速效果,避免生硬的线性动画,提升原型真实感。

Easing Function

Sketch Smart Animate

Sketch 是本文介绍的设计工具,最新版本新增 Smart Animate 功能,用于在原型中快速添加流畅动画。文章通过多个实际案例展示其用法,并提供可下载演示文档,方便用户查看同名图层如何实现过渡效果,同时强调保持原型操作简便快速的目标。

Sketch

设计 Atlassian 的新导航

新导航的技术设计涵盖交互设计与设计系统两个方面,重点解决了从顶部栏迁移到侧边栏后的复杂交互验证问题。团队使用 Vision Lab 原型工具测试拖放、折叠面板等动态行为,并通过五轮迭代优化设置项发现性与折叠模式。交互设计确保了从低保真到 EAP 阶段的可用性持续提升。

Interaction Design

为 iOS 18 图标优化

Apple 在 2024 年 6 月推出主屏幕与控制中心的个性化选项,并提供官方图标设计建议。文中对比了 Apple 自家应用图标在浅色、深色和着色模式下的差异,指出其使用渐变与不透明度增加层次。开发者若仅提供扁平色块,着色效果会与系统风格不符。

Apple

为 iOS 18 图标优化

本文作者来自 Sketch 团队,介绍了为自家 iOS 应用设计 iOS 18 着色图标的过程。原图标因包含彩色钻石等复杂元素,无法直接适配,需要额外调整。团队最终采用替代品牌标志(glyph 形状)和透明度渐变方案,使图标在着色模式下仍保持品牌辨识度与层次感。

Sketch

Sketch Smart Animate

Prototyping 是 Sketch 的原型设计模块,近期更新重点加入 Smart Animate 以支持动画。文章指出该模块追求操作简洁快速,同时通过动画选项帮助设计师快速迭代想法,避免功能过度复杂化。

Prototyping

设计 Atlassian 的新导航

Vision Lab 是 Atlassian 内部原型工具,本文用它构建高保真原型以验证拖放、手风琴面板等复杂交互。相比静态设计工具,它能在更真实环境中测试导航行为,加速迭代。

Vision Lab

以用户旅程设计为中心

Kim Flaherty为本文作者,她通过收集四个案例研究并与20家组织领导者交流,系统记录了体验设计的下一前沿——旅程中心设计。文章由她于2024年10月在Nielsen Norman Group平台发布,总结了从产品中心向旅程中心转变的必要性与实施路径。

Kim Flaherty

以用户旅程设计为中心

本文由Nielsen Norman Group发布,作者基于对20家组织领导者的访谈及四个深入案例研究,提出旅程中心设计概念。该组织还提供相关付费报告《Architecting a Journey-Management Practice》和咨询服务,帮助企业构建跨孤岛的旅程设计运营。文章内容即其最新研究成果的公开摘要。

Nielsen Norman Group

以用户旅程设计为中心

本文将 Design Operations 定义为围绕客户旅程重构业务与设计工作的运营框架。它不拆除组织孤岛,而是通过跨职能协作建立连接,实现端到端旅程设计与持续优化。该模式帮助企业从产品界面微观层面扩展到服务交付宏观层面,创造更大业务价值与创新机会。

DesignOps

Safari 18.0 中的 WebKit 功能

本文报道 Apple 随 iOS 18、macOS Sequoia 与 visionOS 2 发布的 Safari 18.0,WebKit 引擎新增数十项 Web 平台特性。文章多次提及 Apple Vision Pro 的空间网页、空间照片及沉浸式视频体验均依赖这些更新实现。

Apple

Google Material 设计语言的发展

Material 1 通过真实纸张掉落实验建立动效物理规则,提出“Motion carries meaning”口号。动效不再是装饰,而是帮助用户理解界面状态变化、元素出现与消失的意义载体,奠定了后续版本的运动设计基础。

动效设计

Safari 18.0 中的 WebKit 功能

本文介绍 macOS Sequoia 的 iPhone Mirroring 功能,可在 Mac 上直接操作 iPhone。结合 Safari 远程检查,无需取出手机即可用 Web Inspector 无线调试 iOS 网站。需先通过 USB 授权,再开启“通过网络连接”,实现 Mac 屏幕上完成 iOS 网页测试与排错。

iPhone Mirroring

Google Material 设计语言的发展

Wade Convay 现任 Google Design UX 主管,撰写了 Material 未来展望章节。他认为 Material 已重塑用户对界面的期待,正迈向超个性化时代,Material You 将设计权交还用户,支持通过 AI 实时感知情绪并调整界面。章节还提及手势、语音及 AR/VR 等新交互形态,强调未来系统将更细腻、贴心且按需渲染。

Wade Convay

Figma 品牌设计语言

Gilles Desmadrille是Figma Brand Motion Designer,负责将静态元素转化为动态表达。他聚焦选择、激活与转换等核心动作,目标是让画布“活起来”而非依赖光标。团队在其协作下定义了Craft、Interactivity与Freeform三种运动原则,强化品牌对协作过程的呈现。

Gilles Desmadrille

Designing Depth

本文讨论 Affordance 时聚焦 iPadOS Dock 的动画表现:侧边栏展开时 Dock 保持不透明并滑出,清晰传达其仍可交互的特性。这强化了界面由多层堆叠而成的认知,帮助用户理解哪些表面可操作,而非简单保留原位或随背景模糊。

Affordance

正确使用 Tabs

本文指出页内标签通过分块内容并在用户选择时逐步呈现,降低认知负荷,同时保持用户留在当前页面。文章对比了这种呈现方式与手风琴的差异,说明在桌面端标签更适合处理较长或复杂布局的内容。

Progressive Disclosure

正确使用 Tabs

文章指出选项卡通过将冗长内容分块为可扫描片段来最小化认知负荷,避免一次性展示全部信息。当用户需跨选项卡比较或引用信息时,设计会增加认知负荷并降低可用性,优于单页展示。合理分组和默认选项设置有助于进一步减轻用户负担。

Cognitive Load

Designing Depth

在本文中,iPadOS 通过精心设计的 Dock 动画来体现界面层次。当用户向右滑动主屏幕时,Dock 会滑出视野但保持不透明,表明其仍可交互并可通过手势召回,从而强化了堆叠层级的隐喻。与控制中心展开时 Dock 随背景一起模糊的处理形成对比,凸显了不同叠加表面的可操作性差异。

iPadOS

正确使用 Tabs

文章说明选项卡数量过多时,隐藏标签需通过轮播等二次控件访问,会提高交互成本。用户跨选项卡切换比较信息同样增加交互成本和短期记忆负担,不如单页设计高效。将高使用频率内容置于默认选项卡可有效降低交互成本。

Interaction Cost

正确使用 Tabs

Jakob Nielsen在2007年撰写了本文原始版本,奠定了标签页控件的设计基础。本文作为更新版延续其观点,强调标签页应根据内容分组重要性选择默认展示,并通过视觉指示和 proximity 连接选中标签与面板,提升整体可用性。

Jakob Nielsen

Designing Depth

本文将 Staggering 定义为受自然现象启发的交错运动技巧,如鱼群或鸟群的微小时机差异。应用于界面时,它让同类元素以轻微延迟依次动画,增强三维层次与自然感,例如 iPhone 解锁时应用图标的平移以及 iOS 控制中心的弹性反馈。

Staggering

Designing Depth

作者将Motion Choreography比作为叙事添加多层乐器,通过时间与延迟编排自然运动。iOS主屏幕下拉手势被拆解为四个离散状态,需先充分模糊再显示Siri建议,避免视觉冲突;轻点搜索按钮时则反向优先触发入口动画。

Motion Choreography

工具性界面与参与性界面

Slack与Notion一同被列为现代商业工具代表,文章强调其获胜原因包括美观、品味和趣味,而非仅靠效率提升。在消耗用户大量时间的工具中,这些参与元素同样关键,说明即使工具型界面也需兼顾用户体验的内在吸引力。

Slack

正确使用 Tabs

本文由Nielsen Norman Group发布,聚焦标签页在界面中的正确用法,涵盖类型区分、视觉清晰度和内容可用性等要点。该组织通过更新旧文,指出标签页能简化界面、降低认知负荷,但需避免过多标签或混合导航与页内类型,以防用户迷失。

Nielsen Norman Group

正确使用 Tabs

本文建议在可用性测试中重点监控复杂应用中标签管理功能(如新增、删除)的可发现性,因为这些功能对多数用户不熟悉,需通过右键或可见控件等方式提升易用性。

Usability Testing

工具性界面与参与性界面

文章把直接操纵定位为图形用户界面的标志性交互范式,强调用户可直接作用于可视元素而非通过抽象指令。作者指出,当前基于基础模型的界面尚未发现与之对应的革命性机制。这类操纵能同时服务工具性目标与深度参与需求,为未来AI UI指明了可能的演进方向。

Direct Manipulation

正确使用 Tabs

本文强调,未选中标签会隐藏内容,因此标签需具备强信息气味,帮助用户预测其下内容并决定是否点击。弱信息气味的标签(如品牌自创词)会降低用户参与度,需改用通俗描述性用语。

Information Scent

正确使用 Tabs

文章提到一致性是一条可用性启发式原则,要求同一标签控件内的页内标签与导航标签在视觉和行为上保持一致,以帮助用户建立对界面的掌控感。文中还建议在诊断标签问题时结合启发式评估与可用性测试,检查是否违反最佳实践。

可用性启发式评估

正确使用 Tabs

本文强调选项卡通过信息分块将内容组织成清晰分组,帮助用户降低认知负荷并提升可扫描性。分组应基于用户对内容的感知与使用方式,可借助卡片分类法进行研究;若无明显分组则不宜使用选项卡,宜改用带子标题的单页布局。

信息分块

正确使用 Tabs

本文推荐使用卡片分类法来研究tab面板内容的逻辑分组方式,以确保分组符合用户感知和使用习惯。若无法找到清晰分组,则表明不适合采用标签控件,应改用单页布局加子标题。

Card Sorting

锐评网站导航菜单设计

本文第9条和第10条说明,图片等视觉元素可增强长菜单或深层菜单的信息 scent,帮助用户区分选项并提升可扫描性,尤其在移动端顺序菜单中效果明显。但需以清晰文字标签为主,图像仅作为辅助。

Information Scent

锐评网站导航菜单设计

第16条引用Fitts定律解释,下拉菜单中应将常用选项放在靠近触发链接的位置,以缩短用户鼠标或手指移动距离,从而减少点击时间,提升频繁命令的物理可访问性。

Fitts's Law

如何构建 Family 应用

Family在删除代币或藏品时采用拟物化设计,让物品翻滚落入栩栩如生的垃圾桶并伴随音效,增强仪式感。该效果针对低频操作,符合Delight-Impact Curve的策略,通过真实物理隐喻提升情感连接,同时保持整体界面简洁。

Skeuomorphism

锐评网站导航菜单设计

第14条指南明确建议避免多层级级联菜单,因其在两层以上时物理操作困难,易导致用户误选或菜单意外关闭。RStudio案例显示多层下拉菜单常引发操作错误,推荐改用mega菜单或落地页替代。

Cascading Menu

Figma Config 设计采访

Chad Colby 是 Figma 的动态设计负责人,主导了今年 Config 开场影片的创作。他与丹麦工作室 Relay 合作,将已确立的形状移动与激活原则转化为一分钟的叙事动画。影片需在上午九点快速抓住观众注意力,并通过抽象故事呈现品牌理念。

Chad Colby

如何构建 Family 应用

脚注指出Rauno Freiberg在交互设计文章中探讨了使用频率与新奇感的关系,与Family的Delight-Impact Curve高度相似。作者引用此文支撑“低频功能更适合注入惊喜”的观点,强调选择性强调的策略。

Rauno Freiberg

如何构建 Family 应用

本文将渐进式呈现作为实现简洁性的核心手段,通过动态托盘系统逐步展开界面内容。托盘由用户操作触发,可叠加或从组件中弹出,每次仅聚焦单一信息或操作,并随上下文调整高度与主题,避免一次性展示全部功能。文章以房间门道逐步显露为例,说明这种方式让用户在当前语境中自然深入,降低认知负荷,尤其适用于 onboarding 等复杂流程,从而让加密钱包在保持强大功能的同时显得亲切易用。

Progressive Disclosure

如何构建 Family 应用

Delight-Impact Curve描述使用频率越低的功能,注入惊喜带来的愉悦影响越大;高频操作则只需细微优化即可。Family据此在扫码页、垃圾桶、备份成功等低频场景放置彩蛋与拟物动画,而日常转账仅保留逗号跳动等轻量细节。曲线帮助团队实现选择性强调,避免过度设计干扰核心流程。

Delight-Impact Curve

锐评网站导航菜单设计

文章指出导航菜单需帮助用户理解网站信息架构的范围与结构,特别是当用户直接进入内页时。Anthropic案例因未清晰显示当前位置,导致用户难以判断自身在整体架构中的位置。良好菜单设计能提供上下文线索,避免用户对站点内容组织产生困惑。

Information Architecture

如何构建 Family 应用

流体界面是Family流畅性原则的具体体现,要求所有元素间的过渡如水流般自然,避免静态跳转。文章展示标签切换、按钮文字变形、钱包卡片跨屏移动等数百个细节动画,帮助用户建立空间感与连续性。对比无动画版本,流体设计显著提升操作理解与信任感。

流体界面

如何构建 Family 应用

Honk是团队此前开发的一款实时消息应用,以充满愉悦的设计著称。文章提及该项目作为参考,说明如何将类似“delight”理念迁移到Family中,用于不常用功能或关键节点。Honk的经验直接影响了Family在选择性强调与惊喜时刻上的设计策略。

Honk

Mac 固件的更新时间

苹果公司通过macOS更新为Mac机型提供固件支持。本文基于2009年后40款型号数据发现,大多数无T2芯片的Intel Mac在推出后至少获得8年固件更新,部分2012年前型号支持期较短,可能与Sandy Bridge芯片组问题相关。

Apple

锐评网站导航菜单设计

本文由 Nielsen Norman Group 发布,整理出 17 条菜单设计 UX 指南。文章基于大量用户观察,指出菜单常见问题并给出可见性、当前位置指示、选项传达及操作便利等具体建议,帮助设计师让导航真正服务于内容查找与功能使用。

Nielsen Norman Group

锐评网站导航菜单设计

第15条指出,对于长页面,粘性菜单(或部分粘性)能让导航始终可见于视口顶部,避免用户滚动到底部后需费力返回顶部的繁琐操作,尤其在小屏设备上更受欢迎。

Sticky Menu

如何构建 Family 应用

Cash App在文中作为流畅性对比案例被提及,作者认为其价格图表虽美观但缺乏动态过渡,可能降低感知速度。文章用它反衬Family在图表 scrubbing 与状态切换时加入的箭头翻转、数字联动等细节,强调流畅动画对用户信任与操作清晰度的提升。

Cash App

如何构建 Family 应用

文章脚注提及Emil Kowalski开设的动画.dev课程,专门教授如何制作优质网页动画;正文开头还链接其个人站点,展示了对Family动态托盘系统的复刻实现。作者借此肯定其在流畅界面设计领域的专业贡献,并将其作为外部参考资源。

Emil Kowalski

锐评网站导航菜单设计

第14条提到两层以上级联菜单因Steering Law而变得令人沮丧,操作中容易“掉出”菜单或选错子类,建议用mega菜单或路由页代替多层下拉以降低物理操控难度。

Steering Law

iOS 深色模式 app 图标

文章中 Apple 宣布推出暗黑模式图标功能,并提供了包含 28 个图标的预览图。分析显示,仅 9 个图标在浅色模式下具有白色背景,而所有暗黑模式版本均采用黑色背景。部分 Apple 自家图标在两种模式下保持一致或仅微调颜色,文中还引用其 Human Interface Guidelines 作为设计参考。

Apple

闹钟与产品设计

UX Collective是本文发布的平台,文章由Chiara Santella撰写,主题为闹钟设计如何反映人性演变。该平台聚焦设计思考,文中通过历史案例与现代产品对比,探讨从机械闹钟到智能系统的转变如何体现人类对时间和休息的需求。

UX Collective

闹钟与产品设计

Snooze Mode即贪睡模式,于1956年随Snooz-Alarm诞生,每次提供9分钟额外睡眠。文中指出,这一功能源于1950-60年代人们工作更辛苦、睡眠不足的背景,如今已成为城市居民日常习惯,反映人类对休息与时间感知的宽容转变,并延续至智能手机时代。

Snooze Mode

闹钟与产品设计

YouUp被定位为社交闹钟应用,由Declan Gessel等人开发。它用亲友发送的个性化视频消息取代传统闹铃声,让用户在被关心的人陪伴中醒来。创作者强调这一功能源于“每个人都应在关心自己的人陪伴下开启一天”的洞见,体现了数字时代人类对情感连接与早晨积极开端的追求,呼应了现代人的社交焦虑与支持需求。

YouUp

iOS 深色模式 app 图标

Apple 的 Human Interface Guidelines 建议提供图标前景对象并使用透明背景,由系统在其后添加标准黑色渐变。但实际操作中可提交不透明图像以自定义背景色。该指南为 Dark Mode 图标设计提供官方规范,文中指出并非强制要求。

Human Interface Guidelines

MKBHD 参观苹果测试实验室

Spotify在本文中被提及,作为音乐服务提供商,其相关硬件产品也进入讨论范围,与主题形成关联。

Spotify

闹钟与产品设计

Chiara Santella是本文作者,她以《辛普森一家》片段引入,分析闹钟功能演变并提出三个问题:当前设计添加了哪些功能、历史语境如何体现、未来趋势如何。她结合YouUp、Arlo、Next Up和Eight Sleep等案例,指出闹钟反映了当代人类的连接焦虑、生产力需求与技术同化。

Chiara Santella

Checkbox 设计指南

本文由Nielsen Norman Group网站发布,2024年6月28日作者Maddie Brown撰写,聚焦复选框的三种应用类型、与其它输入控件的区别及可用性设计指南。

Nielsen Norman Group

Design Taste vs. Technical Skills in the Era of AI

本文由 Nielsen Norman Group 发布,探讨生成式 AI 时代设计品味与技术技能的关系。文章指出 AI 降低创作门槛后,设计师需依靠判断力与策略决策来产出优质作品,而非单纯依赖技术能力。

Nielsen Norman Group

Design Taste vs. Technical Skills in the Era of AI

本文在体验设计语境中指出,品味体现为设计师有意识地做出选择,让所有细节服务于统一的愿景。品味帮助协调从微观视觉细节到宏观上下文的决策,以同时满足用户需求和业务目标。即使AI能生成元素,体验设计仍需策略性整合才能达到高质量。

体验设计

Apple 宣布将推出全新辅助功能

车辆运动提示是 iPhone 和 iPad 的新功能,专门帮助乘车时减少晕车。它通过设备内置传感器检测车辆运动,在屏幕边缘显示动画点来代表运动变化,从而缓解视觉与实际感受间的感官冲突。该功能可自动开启或在控制中心手动切换,不会干扰主要内容显示。

车辆运动提示

Keep it together: 5 essential design patterns for dev tool UIs

本文将 Hover Row States 描述为表格中的视觉提示,当鼠标悬停于数据行时改变该行外观,使其从其余数据中突出。该特性让开发者能快速聚焦特定信息,同时不丢失整体位置,常被 Linear 等工具采用。它与表格的视觉层级和可读性直接相关,是提升表格交互体验的重要细节。

Hover Row States

Apple 宣布将推出全新辅助功能

Apple 公司宣布将于今年晚些时候在 iPhone、iPad 等设备上推出多项新辅助功能,涵盖眼动追踪、音乐触觉和人声快捷键等。这些更新依托 Apple 芯片、人工智能与设备端机器学习实现,延续了其近四十年来将无障碍融入硬件软件设计的承诺。CEO Tim Cook 表示,这体现了通过创新让生活更丰富、为所有用户提供最佳体验的长期目标。

Apple

如何为初代 iPhone 设计键盘

Apple 是 iPhone 项目的开发公司,在 Steve Jobs 领导下推动触摸屏键盘创新以取代物理键盘。2005 年 7 月起,团队在 Project Purple 下快速迭代软件 demo,键盘问题曾迫使 15 人团队暂停其他工作全力解决。管理层通过多次 demo 评估进度,最终键盘方案获认可。文章强调这是苹果“bet-the-company”的关键决策。

Apple

Design Taste vs. Technical Skills in the Era of AI

本文两位作者之一,与 Kate Moran 共同撰写。文中以烹饪比喻,她代表擅长烹饪的人,使用微波炉时因缺乏精细控制而感到受限,产出质量不如传统方式。

Sarah Gibbons

交互设计的隐形细节

文中以 Apple Maps 为例说明隐式输入:仅通过注视屏幕即可在未解锁状态下直接显示当前导航路线,无需额外操作,体现上下文感知的交互设计。

Apple Maps

用户界面密度

本文将时间密度定义为用户在单位时间内可完成的操作数量,主要受加载速度影响。作者区分 100ms、1s、10s 等时间阈值,提出用动画、进度条或通知等方式改变时间感知,以提升整体 UI 密度,并强调这比单纯压缩屏幕内容更具实际价值。

Temporal Density

Design Taste vs. Technical Skills in the Era of AI

本文提到生成式AI使任何人无需内容设计专业背景即可生成内容,内容设计不再是专业人士的专属领域。文章说明,技术能力普及后,内容质量仍取决于创作者的辨别力和策略判断。设计师的价值转向通过品味确保内容符合整体目标与受众需求。

Content Design

交互设计的隐形细节

Rauno Freiberg 是本文作者,一位专注界面细节的设计工程师。他曾任职于 The Browser Company,现为 Vercel 员工。本文记录了他对 iOS 手势触发时机、动量保持、空间一致性等隐形设计的个人观察,强调这些细节如何让交互更符合人类直觉与真实物理感受。

Rauno Freiberg

交互设计的隐形细节

本文将iOS App Switcher作为高频交互案例,指出其只有在手势结束后才真正关闭应用,以避免误删重要进度。作者对比了macOS版本的无动画直接切换,说明高频操作需降低视觉干扰以提升速度感。文章用此例强调破坏性操作与日常操作在触发阈值上的设计差异。

App Switcher

如何为初代 iPhone 设计键盘

Springboard 是 2005 年 7 月 Purple 项目初期仅有的用户界面演示之一,采用行列布局作为主屏幕原型,用于验证触摸屏基础交互。

Springboard

Apple 宣布将推出全新辅助功能

眼动追踪是 Apple 即将推出的内置辅助功能,用户仅通过双眼即可浏览和激活 iPad、iPhone 上的应用元素及手势操作。该功能由人工智能支持,使用前置摄像头几秒内完成设置和校准,所有数据仅保存在设备端。它无需额外配件,专为残障用户设计,可在各类应用中运行。

Eye Tracking

Design Taste vs. Technical Skills in the Era of AI

本文指出,生成式AI让非专业人士也能创建网站界面,交互设计不再是必须由交互设计师完成的专属技能。传统技术门槛被降低后,单纯具备创建能力并不等于输出高质量结果。文章强调,未来设计师需依靠品味而非技术技能来实现差异化。

Interaction Design

如何为初代 iPhone 设计键盘

QWERTY布局是团队坚持采用的标准键盘排列。Kocienda 先尝试多字母合并按键以增大面积,后改为每键单字母并配合纠错算法,最终让 Forstall 成功输入完整句子,解决了早期输入不可用的危机。

QWERTY布局

如何为初代 iPhone 设计键盘

iPhone 是苹果 2007 年发布的首款智能手机,其触摸屏软件键盘的成败直接决定产品能否推出。文章指出,若键盘输入无法解决,项目可能被取消。该键盘采用自适应应用界面的设计,取代了当时主流的物理键盘,成为演示亮点。最终通过自动纠错等技术实现可用性,支撑了 iPhone 的成功发布。

iPhone

如何为初代 iPhone 设计键盘

惯性滚动是早期 Purple 软件中的流体列表滚动机制,当滚动到达列表末尾时会产生反弹效果,用于测试触摸屏的自然交互感受。

惯性滚动

交互设计的隐形细节

文章专节讨论 Fitts's Law,解释点击时间取决于目标大小与距离。操作系统利用屏幕边缘“魔法角落”让目标无限大,降低精度要求;径向菜单则让所有选项距离和大小一致,便于建立肌肉记忆。作者指出这些设计让常用操作更快、更轻松。

Fitts's Law

交互设计的隐形细节

文中以 Spotify 为例说明 Dynamic Island 的空间一致性交互。当 Island 展开时,Spotify 从图标位置启动而非从 Island 滑出,通过运动轨迹明确音频来源与播放器的空间关系,尤其在同一行存在多个音乐 App 时能帮助用户建立清晰对应。

Spotify

交互设计的隐形细节

本文以iOS系统为主要案例,详细拆解了从锁屏上滑、App切换、手势触发到Dynamic Island等交互细节。作者指出iOS通过堆叠层级、物理惯性与空间一致性等隐形机制,让用户无需学习即可自然操作。文章反复对比iOS手势的即时响应与破坏性操作的延迟触发,说明这些设计如何基于真实世界隐喻建立直觉。

iOS

Design Taste vs. Technical Skills in the Era of AI

本文两位作者之一,与 Sarah Gibbons 共同撰写。文中以烹饪比喻,她代表不擅烹饪的人,微波炉虽能完成任务,但成品远不如专业厨师水平,体现 AI 工具的局限。

Kate Moran

Design Taste vs. Technical Skills in the Era of AI

本文将UX愿景描述为品味的战略组成部分,优秀设计师能围绕以用户需求和业务目标为中心的愿景,协调数百个微小决策。这些决策涵盖视觉细节与整体布局,确保设计既符合品牌调性又服务于特定受众。文章认为,AI时代下围绕愿景的判断力是设计质量的关键保障。

UX愿景

如何为初代 iPhone 设计键盘

自动纠错是iPhone键盘的核心机制,通过字典匹配和邻近按键判断,自动修正用户误触产生的错误输入。Kocienda在一年内持续改进该功能,使其能从如“Tge quixk brpwm foz...”的模糊序列中还原正确句子。它解决了无实体按键时的打字难题,避免了早期多字母按键方案的局限,成为键盘可用性的决定性因素。

自动纠错

交互设计的隐形细节

本文中MercuryOS是作者用SwiftUI制作的原型系统,用于展示滑动解锁与叠加层触发的交互。作者指出,在该原型中元素到达逻辑位置即可立即触发操作,无需等待手势结束,从而提供更强的操作反馈。文章用此例说明“动作触发时机”对流畅体验的关键影响。

MercuryOS

Keep it together: 5 essential design patterns for dev tool UIs

本文将 Framer(文中写作 Frame)列为工具栏范例之一,说明其将高频操作按钮置于显眼位置、支持开发者快速执行任务的设计方式。文章强调此类工具栏需避免按钮过多造成界面拥挤,并通过一致视觉样式帮助用户快速定位命令。

Framer

如何为初代 iPhone 设计键盘

虚拟键盘是 iPhone 用触摸屏取代物理键盘的核心方案,能随应用动态调整按键。早期多款原型因按键过小、无触觉反馈、输入混乱而失败,后通过单字母按键加自动纠错才达到可用水平,成为项目成败关键。

虚拟键盘

交互设计的隐形细节

本文以iPhone的Dynamic Island为例,分析其在展开与收起状态下的不同启动动画:收起时从岛形区域滑出,展开后则从应用图标或右侧进入。作者认为这种空间一致性设计能清晰传达音频来源与App Switcher堆栈顺序。文章指出该细节强化了用户对界面空间关系的理解,属于典型的隐形交互优化。

Dynamic Island

一些网站主页设计原则

文中提到,首页上的动画或移动元素容易被用户视为广告而忽略,引用横幅盲区研究结果,建议避免用运动效果吸引注意力。

Banner Blindness

一些网站主页设计原则

文章引用雅各布定律,说明用户在其他网站花费的时间最多,因此主页应采用用户已熟悉的标准设计模式,避免强迫学习新交互。

雅各布定律

如何创建 Google

本文把苹果作为从个人项目成长为公司的典型案例;沃兹尼亚克最初只想自制电脑,乔布斯提议出售电脑计划后才转为公司;Macintosh 的推出让苹果真正壮大,因其在图形设计上的优势击败其他厂商。

Apple

一些网站主页设计原则

文章提到设计者应参考用户研究与用户画像,针对不同受众(如求职者与企业)定制行动按钮与导航标签。用户画像帮助确定哪些任务优先级最高,从而在首页突出对应入口。文中示例显示按用户画像分组的按钮能更好满足多元需求。

用户画像

一些网站主页设计原则

原则5.3指出,滚动触发的文字动画会增加不必要的交互成本,使用户无法立即看到关键信息如标语,从而阻碍理解和增加流失可能。

Interaction Cost

ChainForge: A visual programming environment for prompt engineering

Ian Arawjo 隶属于 Harvard HCI 组的 Glassman Lab,ChainForge 的开发工作在此背景下进行,并获得 NSF 相关资助支持。

Harvard HCI

一些网站主页设计原则

本文将假底现象描述为用户因首页采用全屏图片等设计而误判页面已结束、不再向下滚动的情况。文中指出这种现象会让访客错过折叠线下方的真实内容,降低探索意愿。建议通过内容延续性提示或视觉引导避免用户产生“页面已完”的错觉。

假底现象

Arc 浏览器下载图标的运动轨迹设计

本文作者,在推文中分享了使用SwiftUI进行交互设计原型制作的实践经验,重点讨论了其在苹果平台上的应用方式。

Jai Trivedi

BrandNew 品牌更新

Mat Voyce是利兹动画师,为Brand New新logo与字母组合制作多套动态版本,包括彩色轨迹与风格切换效果。他从2023年起参与动画工作,使社交内容更适合算法推荐。

Mat Voyce

一些网站主页设计原则

文章将屏幕滚屏控制(scrolljacking)列为可能导致定向障碍的动画形式,提醒设计者需尊重用户对滚动的自然控制权。

屏幕滚屏控制

Breakpoints in Responsive Design

本文出自 Nielsen Norman Group 网站,聚焦响应式设计中的断点应用,解释其如何帮助设计师在多设备屏幕下保持布局一致性。

Nielsen Norman Group

一些网站主页设计原则

文章批评视差滚动效果会造成用户迷失方向,并可能引发前庭障碍,属于应尽量避免的过度动画设计。

视差滚动

Arc 浏览器下载图标的运动轨迹设计

本文核心主题之一,作者通过SwiftUI示例展示了如何快速迭代交互设计细节,包括手势响应与状态过渡的原型验证流程。

Interaction Design

Arc 浏览器下载图标的运动轨迹设计

本文重点介绍SwiftUI作为原型工具的优势,作者分享了用其快速搭建可交互演示版本、验证设计想法的实际方法与心得。

Prototyping

一些网站主页设计原则

本文指出,采用符合用户熟悉的常规设计能降低新用户的认知负荷,让他们专注于了解品牌而非学习网站操作方式。

Cognitive Load

一些网站主页设计原则

Jakob Nielsen在2001年提出113条主页可用性指南,本文指出这些指南至今仍有效,是五大原则的具体应用,体现可用性原则的长期稳定性。

Jakob Nielsen

一些网站主页设计原则

本文强调首页链接标签需具备高信息气味,才能清晰传达点击后的预期内容。泛化用语如“点击此处”或“了解更多”会降低信息气味,导致用户难以区分不同选项。文中建议参考用户目标,使用具体、与任务相关的描述性标签。

Information Scent

一些网站主页设计原则

本文由Nielsen Norman Group发布,系统总结了主页设计的五大基本原则,涵盖易访问性、身份传达、内容展示、行动引导和简洁性,并通过大量网站正反例提供实用指导。

Nielsen Norman Group

你能在个人博客上做的 100 件事

本文第78条把添加hovercards作为个人网站可实现的功能之一,链接indieweb.org说明。它属于交互细节设计,能提升访客体验,呼应文章中“尝试新功能、丰富网站”的核心建议。

Hovercards

如何设计出完美的图标

关键形状与图标网格共同构成 Streamline 的构建指南,帮助不同风格的图标保持统一的几何特征与视觉平衡,确保集合整体协调。

Keyshapes

Loadership

Loading Spinner 是 Loadership 主要生成的对象,即网页加载时的动画元素。该工具允许用户自定义其样式,并以 HTML/CSS 或 SVG 格式导出,服务于提升网页项目视觉体验的需求。

Loading Spinner

如何设计出完美的图标

团队选择在 Slack 而非 Figma 文件中进行日常反馈,以便所有成员轻松参与讨论。设计师每日提交作品,Art Director 与同事提出建议后,设计师次日修改并再次验证。

Slack

Designing Zenly

文章强调位置共享无需严肃或单调,Zenly通过趣味设计如彩色图标和动画,让这一功能成为吸引用户反复打开的核心价值,而非单纯工具。

位置共享

Designing Zenly

Gatherings指地图上的群组好友标记,团队历经数十次迭代,最终采用火焰着色器动画突出聚会状态,成为用户喜爱的标志性功能之一。

Gatherings

《我在芝加哥修 Mac》

文中Apple是提供Mac保修支持和零配件的品牌方,通过AppleCare向授权服务商派发维修任务。文章提到Apple提供内部PDF维修指南、诊断工具和ASX后台系统,但对AASP的监督较为宽松,仅关注客户满意度指标。

Apple

a global design system

与Figma并列,文章指出全球设计系统应在Sketch等主流设计工具中建立对应资源库,确保设计与开发的一致性与可复用性。

Sketch

Designing Zenly

Zenmojis是Zenly专属表情符号系统,用于快速互动、破冰和新用户引导,也曾作为营销和游戏化手段,但后期因过度依赖导致留存问题而减少宣传。

Zenmojis

今年 Spotify Wrapped:没有网格,没有规则,混乱与流畅

本文中Spotify的设计团队负责年度Wrapped活动的视觉呈现,其全球品牌设计负责人领导该项目已八年。团队需将创意转化为可全球落地的工具包,确保在不同国家、语言和格式下保持一致性,同时保留创意完整性。

Spotify

设计工具手柄对比

交互命中区指边界框边缘和角落用于触发不同操作的区域。文中对比了 Sketch、Figma、Illustrator 等工具的命中区形状与大小,指出 L 形、C 形或狭长区域难以精准点击。Photoshop 的旋转区向外延伸 200pt,是所有工具中最大的。

Hit Zone

设计工具手柄对比

Skala 是 Bjango 正在开发中的设计工具,文章末尾提及该产品以引出画布控件话题。文中未提供 Skala 的具体功能细节,仅作为作者背景信息出现。

Skala

设计工具手柄对比

文章指出 Figma 与 Sketch 一样让水平垂直缩放占据整个侧边;小对象时会隐藏控点,仅保留移动功能;其交互热区相对简洁,但同样未处理鼠标在控点内的点击偏移问题。

Figma

设计工具手柄对比

文中说明 Sketch 可通过 Command 键配合边角实现旋转;其水平垂直缩放支持整个侧边区域,方便操作;小对象时会自动放大包围盒以保证控点可点;但不支持鼠标点击偏移补偿。

Sketch

各个地区语言是怎么在网上「笑」的

本文末尾推荐文章提及,苹果公司高管与特斯拉、英伟达负责人一同被视为将中国企业视为同行的硅谷代表,而非对手。

Apple

Chrome 团队 2023 年的 CSS 总结

本文中,linear() 函数用于创建复杂的缓动效果,可近似实现弹跳或弹簧动画。Chrome 113 起支持该函数,通过将曲线简化为关键点并线性插值实现。相比传统 easing,它简化了非线性动画的编写,同时保持了性能优势。

CSS linear() function

设计工具手柄对比

本文指出设计工具常在选中对象的边界框周围集中大量功能,包括控件和隐藏交互。边界框的边缘和角落区域用于触发缩放、旋转等操作,但这些功能多需悬停才能发现。

Bounding Box

Chrome 团队 2023 年的 CSS 总结

本文指出 View Transitions API 于 Chrome 111 发布,支持单页应用中页面状态间的视觉过渡动画。通过 document.startViewTransition 可自动捕获前后快照并处理过渡,开发者仅需少量 CSS 即可实现平滑切换。该 API 显著提升了 Web 应用的交互质感。

View Transitions API

Chrome 团队 2023 年的 CSS 总结

本文介绍 scrollend 事件可在滚动真正结束时触发,能正确判断用户是否仍处于手势中。Chrome 114 起支持,解决了以往使用 setTimeout 的不准确问题。JavaScript 无法直接获知滚动期间手指是否仍在屏幕上,该事件由浏览器精确提供。

Scrollend Event

设计工具手柄对比

文章提到 Flinto 是 2018 年最早实现小对象自动放大包围盒的设计工具,使控点在狭小空间仍可被点击,这一做法后来被 Sketch 采用。

Flinto

设计工具手柄对比

本文单独展示了 Photoshop 的交互热区,其旋转区域向外延伸 200pt;水平垂直缩放区域紧邻角落,布局略显异常;它支持鼠标点击位置偏移补偿,且小对象时控点会堆叠。

Adobe Photoshop

Chrome 团队 2023 年的 CSS 总结

本文中滚动驱动动画可将 CSS 或 Web Animations API 动画与滚动位置绑定。Chrome 115 起支持,支持 scroll-timeline 和 view-timeline。动画可在主线程外运行,实现丝滑的滚动联动效果。

Scroll-driven Animations

设计工具手柄对比

画布控件指边界框周围的句柄和图标,用于执行调整大小、旋转等操作。文章分析了多款工具的控件布局,指出控件区域过小或形状不规则会导致操作困难。Photoshop 等软件在控件内点击位置偏移未被正确处理时会出现拖拽首帧跳动问题。

Canvas Handles

The Pudding Cup

Dithering 项目利用交互式叙事与流畅动画,将原本复杂的抖动算法拆解为逐步演示过程,使读者通过操作直观感受像素处理原理,优于静态说明。

交互式叙事

Vision Pro 空间视频前瞻

本文记录Apple邀请作者前往纽约体验iPhone 15 Pro空间视频拍摄及Vision Pro回放的全过程,并提供含处方镜片的设备和预加载 demo 内容。Apple未允许用Vision Pro拍摄空间视频,但展示了其自拍样本。作者从此次活动中得出空间计算平台未来充满潜力的结论,并对比了iPhone与Vision Pro在捕捉和显示上的优劣。

Apple

一些漫画结构和技巧分享

Tracking指读者视线跟随人物或物体在面板或页面中的移动轨迹,常用于制造动感唤起效果。它通过眼动追踪强化叙事中的动作连贯性。Movement Tracking是Long Drop和Long Path的基础概念。

Movement Tracking

Table of Content 设计指南

文中说明,Sticky 目录通过高亮当前章节,充当 Progress Indicator,让用户在滚动时实时了解自己在页面中的位置。这不仅提供视觉反馈,还提升内容可发现性,特别适合左侧或右侧边栏的目录设计。

Progress Indicator

Table of Content 设计指南

本文讨论的 Sticky 表格目录指固定在页面顶部的目录设计。当目录位于左右边栏时,推荐采用此方式,以避免用户滚动后丢失导航。文章指出,Sticky 目录可通过高亮当前章节提供滚动进度反馈,并借助微动画提升可见性。但若置于正文主体,则易与全局导航混淆,故建议采用非 Sticky 实现。

Sticky Menu

过渡动画指南

本文第六条原则强调建立空间感,通过设计屏幕外不可见空间与多层功能层,帮助用户构建产品心智模型,提升体验。文中以音乐播放器最小化与评论浮层打开为例,展示层级深度与方向性运动如何强化空间结构。

空间感

过渡动画指南

对应WWDC 2018演讲主题,本文引用该概念强调界面需具备自然、连贯的运动特性,作为实现空间感与方向性一致性的高层指导。

Fluid Interfaces

Table of Content 设计指南

本文提到当目录链接标签与章节标题措辞不一致时,用户需反复对比分析,从而增加不必要的认知负荷。保持两者完全匹配可降低这种负担,让用户快速确认已到达目标位置。

Cognitive Load

过渡动画指南

参考资料部分收录苹果WWDC 2018与2023两场演讲,分别探讨流畅界面设计与弹簧动画,作者将其视为高级过渡动画的技术灵感来源,与本文实用原则形成互补。

WWDC

过渡动画指南

文章提到设计师常用原型设计向团队展示过渡动画效果。原型能帮助测试动画速度、层次顺序与空间关系是否合理,避免上线后出现反馈不及时或用户困惑的问题,是验证六项原则的重要环节。

Prototyping

Rewind 创始人讲述他的 SwiftUI 开发生涯

本文中 Sketch 用于为网站图片序列创建 alpha 遮罩,以优化透明 webp 和 jpg 文件,减少带宽消耗。该工具辅助实现了滚动驱动的 3D 手机动画效果。

Sketch

Table of Content 设计指南

本文由Nielsen Norman Group发布,该组织专注于用户体验研究与设计指南。文章基于其长期可用性测试结果,系统梳理了目录的益处、放置决策树及样式注意事项。通过大量网站截图案例,NN/G为设计师提供最大化目录可用性的实践建议。

Nielsen Norman Group

Tokyo Dome City 品牌重设计

本文中,&Form与Toshi Omagari合作开发的变量无衬线字体,沿宽度、高度三个轴实现大幅运动变化,使每个视觉资产获得独特个性。这种动效设计用于社交媒体、周边商品及120米巨型屏幕,增强东京巨蛋城作为统一娱乐综合体的吸引力,与2022年DEMO Festival身份形成参照。

动效设计

过渡动画指南

文章核心主题为过渡动画。它能平滑连接不同界面状态,帮助用户理解操作反馈与流程。作者给出六条实用原则,包括淡入淡出、缩放、保持方向一致、平衡速度、优先分组以及建立空间感,并通过原型示例演示如何避免生硬跳转。

过渡动画

过渡动画指南

文章指出动效设计在产品中不可或缺。它不仅能吸引注意力、提升愉悦感,还能提供清晰反馈,使界面更直观现代。过渡动画是动效设计的重要组成部分,需在原型阶段反复测试以找到恰当的微妙与强调平衡。

动效设计

过渡动画指南

本文在参考资料部分引用了Adrian Zumbrunnen撰写的《Smart Transitions In User Experience Design》一文,作为过渡动画设计的延伸阅读资源。该文章探讨了如何在用户体验中实现智能过渡效果,与本文强调的方向性、一致性和空间感原则形成呼应。作者将其列为进一步学习过渡动画的推荐材料,供设计师在实践中参考。

Adrian Zumbrunnen

Table of Content 设计指南

文章讨论了点击目录链接后的页面过渡方式,推荐 Smooth Scrolling 替代瞬间跳转。它能营造连续过渡体验,避免用户误以为进入新页面,同时增强导航流畅感。作者认为此效果在保持上下文连续性方面优于传统跳转,尤其适合内容较长的页面。

Smooth Scrolling

Table of Content 设计指南

文章在 Sticky 目录部分指出,当前章节高亮时的细微动画可形成愉悦的 Micro-interactions,既吸引用户注意目录,又提供滚动位置反馈。这种设计增强了导航的可用性,尤其在长页面中帮助用户了解阅读进度。

Micro-interactions

iOS 17 SwiftUI 使用占比逐步增加

本文统计了 iOS 17 内置应用中 Swift 和 SwiftUI 的使用情况,指出 Apple 自身应用对 SwiftUI 的采用显著增加,Preferences、Health、Home 等多个核心应用均已引入 SwiftUI。

Apple

过渡动画指南

本文在参考资料部分列出了Rauno Freiberg的《Invisible details of interaction design》,作为交互设计中不可见细节的补充阅读。该内容聚焦于微妙动画与过渡的隐藏技巧,与本文提出的淡入淡出、缩放和速度平衡等原则相辅相成。作者推荐此资源帮助读者深入理解产品中过渡动画的细腻实现方式。

Rauno Freiberg

Rewind 创始人讲述他的 SwiftUI 开发生涯

Stocketa 必须集成 Face ID 以保护用户金融资产信息。作者额外实现了可自定义的宽限期设置,方便用户在切换应用手动记录交易时避免频繁解锁。该功能通过自定义手势沿弧线滑动来调整时间,属于应用安全体验的细节优化。

Face ID

过渡动画指南

本文多次引用该机构研究,说明动画可吸引注意、提升愉悦感与可用性,并推荐过渡动画时长控制在100-500毫秒。作者将其作为速度与目的性原则的实操依据,指导设计师平衡反馈与流畅度。

Nielsen Norman Group

过渡动画指南

文章强调交互设计需关注动画细节以增强可用性。通过保持方向一致、合理排序元素、建立空间模型等原则,设计师可让用户形成清晰的心理模型,避免界面显得断裂或过于忙碌,从而提升整体产品品质。

Interaction Design

过渡动画指南

本文发表于 UX Collective 平台。该平台强调设计师既是思考者也是创造者,文章以实用原则形式分享过渡动画设计方法,旨在帮助产品团队在原型阶段测试并优化用户体验。

UX Collective

过渡动画指南

对应WWDC 2023演讲,本文在参考资料中提及弹簧动画,用于实现更自然的过渡回弹效果,与文中缩放、淡入淡出原则结合,可增强界面活力与真实感。

弹簧动画

过渡动画指南

本文作者为 Dongkyu Lee。他在文章中提出六项可立即应用的过渡动画设计原则,结合大量 App 示例说明如何通过不透明度、缩放、方向性、速度、优先级和空间感提升界面流畅度与用户感知。

Dongkyu Lee

User Interviews 101

本文将访谈提纲定义为引导对话并回答研究目标的工具,包含少量开放式问题及嵌套的跟进问题,用于收集用户具体经历而非泛泛描述。提纲可灵活使用,允许跳过或调整顺序,但需先通过试点测试检查问题是否易懂或产生混淆。作者强调提纲服务于发现阶段的同理心构建,而非销售或随意聊天。

访谈提纲

User Interviews 101

本文指出用户访谈常用于发现阶段,以生成关于用户及其体验的新知识。它对应设计思维模型中的共情阶段,用于帮助团队在早期识别用户需求与痛点,而非评估现有设计。

探索阶段

User Interviews 101

文章指出访谈可与实地研究结合:在观察前进行访谈能提供背景信息,在观察后进行访谈则可针对发现的问题深入追问。两者结合能让研究者更好地理解用户在真实场景中的行为与感受,弥补单一方法的不足。

实地研究

User Interviews 101

文中说明访谈数据可用于构建用户需求陈述,作为从用户经历中提炼洞察的UX产物之一。它帮助团队将访谈发现转化为可操作的设计依据。

用户需求陈述

User Interviews 101

文章指出访谈数据可用于绘制用户旅程图,展示用户在体验中的高低点与痛点。这有助于识别改进机会,并与观察法结合获得更完整视图。

用户旅程图

User Interviews 101

本文提到访谈结果可用于创建用户画像,代表典型用户特征与需求。它将定性访谈发现转化为可共享的设计参考,促进团队决策。

用户画像

User Interviews 101

文章列出访谈数据可用于制作共情地图,以可视化用户想法、感受与行为。这能增强团队对用户的共情,支持发现阶段的洞察整理。

共情地图

User Interviews 101

本文作者之一,与Maria Rosala合作完成此篇用户访谈入门文章。内容涵盖访谈与可用性测试的对比,以及在设计思维同理心阶段的具体应用建议。

Kara Pernice

User Interviews 101

本文核心主题,将其定义为通过提问与倾听了解用户经历、需求与痛点的定性研究方法。文章指出访谈属于态度型研究,适用于发现阶段,可生成用户需求陈述、人物角色等工件,但需注意回忆偏差等局限。

用户访谈

User Interviews 101

文章对比用户访谈,指出其目的是评估设计表现,属于行为型研究,用于设计思维的测试阶段。访谈则聚焦生成新知识,两者在参与者互动方式和研究时机上存在明显差异。

Usability Testing

User Interviews 101

本文由该机构发布,聚焦用户访谈方法在UX研究中的应用。文章详细说明了访谈的目的、实施步骤及其与可用性测试的区别,强调它适合在发现阶段收集用户体验洞察。

Nielsen Norman Group

A Cheatsheet for User Interview and Follow Ups Questions

本文指出访谈问题同样适用于可用性测试协议,可在测试过程中穿插少量问题。作者将这些问题整理成 cheatsheet,便于快速构建测试脚本。强调测试时仍需注意追问用户行为背后的原因,而非仅观察操作。

Usability Testing

设计工具的内存使用概况

测试中Sketch在空文档、2048圆形、2048点路径、老虎SVG等场景下内存占用最低,增长也最平缓;但面对1.3MB的Moby Dick文本时会直接冻结,无法完成测试。

Sketch

交互设计中的细节

文章在隐喻一节提出,优秀交互应模仿现实世界的可中断性,例如翻书动作可随时停止而非强制等待动画结束。iOS 的滑动返回与 App 切换手势都支持中途改变方向或释放手指,体现了这一特性。

可中断性

深色模式 101

本文指出 Spotify 选择永久深色模式作为审美决策,将非关键界面元素融入黑色背景,以突出彩色专辑封面和图像,类似电影院效果。

Spotify

交互设计中的细节

文章以 iOS 为主要案例平台,详细拆解了其滑动解锁、App 切换器、Dynamic Island 变形、捏合缩放等手势的触发时机、动量保留与空间一致性。这些细节让系统级交互既符合物理直觉,又能在高频使用中保持响应性与可中断性。

iOS

深色模式 101

Nielsen Norman Group 在本文中通过对 115 名移动用户的问卷和暗黑模式下的移动可用性测试,得出暗黑模式受欢迎但非必需的结论。他们发现用户将模式视为系统级设置,且很少因应用不支持暗黑而流失。文章基于这些发现提出最佳实践,建议仅在长时使用或低光场景优先投入支持。

Nielsen Norman Group

Tree Testing 介绍

文章将 tree testing 与可用性测试并列,均为基于任务的研究方法。不同之处在于 tree testing 仅聚焦信息层级可发现性,无需视觉设计或内容即可执行。定性 tree testing 可借鉴可用性测试的 moderated 形式获取洞见。

Usability Testing

Scrolljacking 最佳实践

本文由Nielsen Norman Group发布,总结了该机构针对Scrolljacking的可用性研究。研究覆盖多个行业网站,核心结论是该模式更多带来用户控制感丧失与挫败,而非益处。文章以其研究结果为基础,提出最佳实践以帮助企业在功能价值与可用性风险间权衡。

Nielsen Norman Group

进度指示器指南

本文将渐进式加载定义为优先展示核心内容而非等待整页加载完毕。该方式能提升感知性能,让用户更快开始交互,尤其适合网络条件不佳的场景。

Progressive Loading

进度指示器指南

文章直接引用其对“系统状态可见性”的解释,指出该原则要求系统及时反馈当前状态,帮助用户规划下一步并增强信任。

Nielsen Norman Group

进度指示器指南

文章引用其提出的十项可用性启发式原则,强调其中“系统状态可见性”是最核心的原则,指出当系统无法更快响应时,需通过指示器保持用户对状态的感知。

Jakob Nielsen

Tree Testing 介绍

本文由NN/g的Page Laubheimer撰写,强调“if you’re not checking, you’re guessing”,并系统介绍tree testing流程以帮助团队在设计早期迭代导航结构。

Nielsen Norman Group

Tree Testing 介绍

本文指站点的全局导航层级与类别标签体系。作者指出即使遵循最佳实践也需通过 tree testing 验证用户是否能找到目标资源,避免仅凭猜测设计。tree testing 专门用于评估该体系的实际表现,而非生成阶段。

Information Architecture

Tree Testing 介绍

本文指出,可通过sleight-of-hand任务测试父类别的information scent,例如让参与者寻找公司慈善捐赠匹配计划,以评估HR部门的不同类别名称是否清晰。

Information Scent

交互设计中的细节

文章在滚动一节指出,Magic Trackpad 与 Magic Mouse 等设备通过滚动即可直接操纵桌面元素,如直接调节滑块,无需切换到窗口激活状态即可完成操作。这种方式让单次手势同时完成定位与调整,减少了传统鼠标的层级切换摩擦。

Direct Manipulation

交互设计中的细节

文章在 Fitts 定律一节指出,径向菜单围绕指针展开,使所有选项的距离与尺寸完全一致,便于形成肌肉记忆。用户无需精确瞄准,只需朝特定方向滑动即可触发,显著降低了选择成本。

径向菜单

交互设计中的细节

文章在隐式输入一节指出,键盘、触摸等均为显式输入,而真正自然的交互是利用上下文自动推断意图,无需用户主动操作。iOS 中的 Apple Maps 在锁屏状态下直接显示导航、Wallet 在扫码时自动提高亮度,都是通过环境信息完成的隐式输入示例。

隐式输入

Scrolljacking 最佳实践

本文将Scrolljacking定义为改变网页正常滚动速度或方向的设计模式。作者通过多站点可用性测试发现,该模式常导致用户迷失方向、效率下降,尤其在全页使用、移动端或需阅读文字时问题最严重。文章强调仅当它能逐步呈现有价值信息时才可考虑使用,并给出速率控制、保留正常滚动段落等缓解措施。

Scrolljacking

Scrolljacking 最佳实践

文章描述BBC案例中,部分用户因Scrolljacking结束后的静止状态,误判页面已结束而停止探索。该现象源于滚动动画制造的视觉假象,干扰用户对页面长度的正确感知。研究建议通过保留正常滚动段落来减少此类误判。

Illusion of Completeness

Threads 一些迭代变化

文章探讨 UX Design 在 Threads A/B 测试中的核心作用,解释设计决策如何影响用户留存与传播。作者结合具体测试案例,说明 UX 理论如何指导界面优化。内容强调这些设计直接服务于增长目标。

UX

进度指示器指南

本文提及Jakob Nielsen的十项可用性启发式原则,并重点讨论第一条“系统状态可见性”,将其作为设计加载指示器的理论依据。

Usability Heuristics

深色模式 101

文中说明深色模式下二维码若反色显示(白底变黑底),部分扫描设备无法识别,建议使用 PNG 等固定格式呈现以确保在两种模式下均可正常扫描。

QR Code

Scrolljacking 最佳实践

Sara Paul为本文作者,于2023年8月6日在Nielsen Norman Group网站发表此文。她结合可用性测试观察,系统梳理了Scrolljacking的定义、使用动机、用户痛点及缓解建议。

Sara Paul

Scrolljacking 最佳实践

文章强调固定导航可作为滚动劫持的逃生通道,用户迷失时可点击退出恢复控制。无固定导航的页面中,用户更难从劫持状态恢复。移动端折叠菜单进一步降低该功能可用性。

Sticky Navigation

Tree Testing 介绍

本文核心讨论tree testing方法,用于快速评估网站导航层级的可发现性,无需原型或视觉设计,仅需准备层级树和任务即可验证用户能否找到关键资源。

导航层级

进度指示器指南

本文以Hearthstone为例,说明游戏在加载等待时通过趣味文案和近似等待时间提示来降低用户焦虑。当等待时间较长时,游戏会显示预计等待时长,同时提供匹配相关的轻松文案,既保持用户参与感,又传递额外信息,符合长等待场景下的最佳实践。

Hearthstone

交互设计中的细节

本文作者 Rauno Freiberg 通过复现界面和慢动作分析,试图拆解优秀交互设计中那些“不可见”的细节,文章即是他对常用交互隐性机制的观察与反思,而非教程或指南。

Rauno Freiberg

进度指示器指南

Airbnb在加载页面时采用骨架屏(stencil loader),能清晰展示内容布局,减少用户认知负荷,并避免不必要的等待感知。

Airbnb

Tree Testing 介绍

文中提到polyhierarchical选项测试,例如将socks同时放在footwear和accessories下,可通过tree testing观察用户是否在多个类别中寻找,以决定是否需要多重层级。

多重层级

Threads 一些迭代变化

本文揭示 Threads 如何利用 A/B Testing 验证并迭代增长功能。文章分析测试背后的 UX 理论依据,以及不同变体对用户行为的影响。重点指出测试结果如何支撑其整体上线策略。

A/B Testing

Scrolljacking 最佳实践

文中将水平滚动劫持与走马灯模式对比,指出两者交互相似但可能导致用户不知如何返回顶部。水平方向改变会加剧迷失,尤其在移动端更易混淆。研究建议避免方向变化,以减少导航困惑。

Carousel

Tree Testing 介绍

生成式方法,用于发现用户心智模型和类别分组;tree testing 则是评估式方法,用于检验已有层级是否有效。文章提醒不要混用,卡片分类结果常含模糊“其他”类别,需用 tree testing 进一步验证实际表现。

Card Sorting

交互设计中的细节

本文中 macOS 被多次用作桌面交互设计的例子,包括右键菜单无动画弹出以减少高频操作的认知负担、App Switcher 对键盘用户不使用动画以保持流畅、以及通过摇动鼠标找回指针位置等细节。文章还指出 macOS 利用屏幕边缘“魔法角”实现无限目标尺寸,符合 Fitts 定律,让常用功能触达更快。

macOS

Scrolljacking 最佳实践

本文以BBC网站为例说明Scrolljacking可用于逐步展示信息,支持故事讲述并降低认知负荷。测试显示此用法帮助用户理解灾难前后对比,但仍有个别用户因滚动反馈异常而轻微迷失。文章认为只有具备真实功能价值时才值得采用。

Progressive Disclosure

Sitemaps 与信息架构(IA)区别

本文由Nielsen Norman Group发布,作者为Samhita Tankala,发表于2023年9月3日。该机构通过本文澄清信息架构与站点地图的区别,指出前者是更广泛的持续过程,后者仅是其可视化成果之一。

Nielsen Norman Group

Sitemaps 与信息架构(IA)区别

本文将Card Sorting列为IA UX研究活动之一,主要目的是了解网站内容的易查找性和可发现性。该活动对应的潜在交付物是研究报告,形式包括文档、视频和演示。

Card Sorting

PLG 增长飞轮

本文强调产品主导的用户体验是Flywheel框架的投入重点,直接推动业务增长。优质体验被描述为激活用户并形成持续循环的关键要素。内容指出公司需围绕此体验优化各环节以获得指数级效果。

User Experience

watchOS 10 中的细节

本文中Smart Stack是watchOS 10的核心交互模型,通过向上滑动屏幕或转动Digital Crown访问。它根据时间、地点、活动等上下文显示小组件,解决简洁表盘与复杂数据展示的矛盾。小组件在三维空间堆叠,始终贴合屏幕圆角,并与表盘颜色和时间位置保持一致。

Smart Stack

watchOS 10 中的细节

本文中Apple指推出Apple Watch及watchOS的科技公司。其watchOS人体界面团队成员Gary Butcher接受采访,分享设计理念。文章强调Apple内部跨领域协作紧密,数字与物理设计结合紧密。

Apple

进度指示器指南

文章引述Nielsen Norman Group观点,称其为十项启发式原则之首,核心在于通过加载指示器让用户了解当前状态、保持控制感并建立对品牌的信任。

Visibility of System Status

Scrolljacking 最佳实践

文章基于对多行业网站的可用性测试,观察到滚动劫持常引发用户迷失、效率下降和任务失败。测试发现短时滚动劫持较易被接受,而全页或过长劫持易被误判为故障。任务导向用户尤其反感该模式,易导致离开页面。

Usability Testing

深色模式 101

本文提到的可用性测试为尼尔森诺曼集团在暗黑模式下进行的移动端会话测试。测试显示参与者几乎不会注意到不支持暗黑的应用,也难以回忆起相关经历,表明用户不会因缺少暗黑支持而放弃使用。文章以此说明暗黑模式支持不应优先于解决基础可用性问题。

Usability Testing

进度指示器指南

本文在讨论TurboTax通过逐步导入数据并给予明确反馈的案例后,引用Appcues博客作为补充资源链接,指向更多加载页面设计的实例与图片,供读者进一步了解如何通过有意义的反馈提升用户对后台任务的理解和信任。

Appcues

交互设计中的细节

文章专设一节讨论 Fidgetability,认为优秀交互不必完全实用,可允许用户在思考时重复摆弄界面元素以释放压力或提升专注。举例包括 AirPods 盒盖的开合手感、Apple Pencil 笔尖的旋转摩擦,以及某些未被证实的原型交互。

Fidgetability

用户体验设计「秋后算账」

文章中被提及为过去15年UX Research黄金时代的重要驱动因素,指以人为中心、多方法结合的人机交互研究范式。作者认为这一范式曾帮助研究团队在Meta和Airbnb等公司快速扩张,但如今因未能充分转化为商业价值而遭遇挑战。

HCI

用户体验设计「秋后算账」

文中指出数据科学使团队常通过A/B测试直接挑选赢家,而无需依赖传统用户研究。作者认为这削弱了middle-range research的必要性,强调UXR需转向更具技术深度或战略性的工作才能证明自身价值。

A/B Testing

Skeleton Screens 101

文章建议当加载超过10秒时使用进度条,因其能明确显示剩余时间,而骨架屏或spinner不适合。进度条针对下载、上传等非全页流程,避免骨架屏可能造成的混淆。结论强调超过10秒的等待必须提供时长估算,进度条是首选。

Progress Bar

Skeleton Screens 101

文章将骨架屏归类为一种专用于全页面加载的进度指示器,与spinner和进度条并列但用途不同。它通过提供页面结构线索,而非单纯等待动画,来缓解用户对加载时间的焦虑。关键结论是进度指示器需根据等待时长选择,骨架屏适合中短时全页场景。

Progress Indicator

Skeleton Screens 101

本文由 Nielsen Norman Group 发布,系统梳理了骨架屏的三种类型及其优缺点,并给出使用时长建议:适合 1-10 秒的全页加载场景,以替代 spinner 或进度条。文章强调骨架屏能减少用户对加载时间的感知,但不能替代性能优化。

Nielsen Norman Group

Skeleton Screens 101

文中将spinner定位为单模块加载(如卡片或视频)的等待动画,适合2-10秒场景,但无法像骨架屏那样展示全页结构。动画型骨架屏与spinner有相似之处,但后者缺乏布局提示,易增加用户不确定感。文章指出若加载不足1秒则无需使用spinner,否则可能造成闪烁干扰。

Spinner

Google 正式推出 passkey

苹果去年与 FIDO Alliance、谷歌、微软联合宣布支持 Passkeys,在各自平台推进这一更安全便捷的登录方式落地,助力实现跨平台无密码体验。

Apple

一些应用的界面共情细节

本文中指日本连锁药妆店AINZ & TULPE的会员App。其启动画面底部始终显示会员条形码,即使因网络问题无法正常打开App,也能完成积分累积,体现了贴近用户实际使用场景的细致设计。

AINZ TULPE

Lyft 团队分享了灵动岛带来的改变

Dynamic Island 是 Live Activities 在 iOS 上的主要承载位置,文章描述了 Minimal 与 Compact 两种形态如何在岛上并存或单独展示,以及 Expanded 展开后的更大视图。Lyft 利用其品牌粉色保持在多 App 共存时的可识别性。

Dynamic Island

Visual Studio 界面更新

Cognitive Load 在文中指开发者在使用 IDE 时因视觉 clutter 产生的认知负担。本次 UI 更新通过增加控件间距、采用轻量控件样式以及减少非必要视觉元素来降低该负担。文章强调此举能让用户更快聚焦于编码区域,同时平衡了界面密度与操作准确性。

Cognitive Load

一些应用的界面共情细节

本文仅提及Mailbox是Spark中滑动分类邮件交互的发明者,未提供其他细节,强调该交互方式最早在此App中出现。

Mailbox

一些应用的界面共情细节

文章结尾提及Apple每年WWDC开发者大会曾谈到Humanity主题,建议对该话题感兴趣的读者观看相关视频。文中将Apple作为参考,指出其对人性化设计的关注与Goodpatch推崇的理念一致,呼应AI浪潮下回归人类情感的需求。

Apple

一些应用的界面共情细节

Google Maps在用户截屏后立即弹出「要分享当前位置吗?」的提示条,预判分享需求。文章指出这一功能让用户感觉App读懂了意图,体现了制作人对实际使用场景的细致洞察与人性化关怀。

Google Maps

一些应用的界面共情细节

本文介绍Pinterest应用中,长按图片即可弹出三个操作图标并支持拖拽执行,主要用于快速保存图片到画板,省去点击按钮的步骤,传达出贴心且高效的“帮你完成”的感觉。

Pinterest

一些应用的界面共情细节

本文提到note平台,用户对文章点赞后,有时会收到作者亲自撰写并显示的感谢消息,而非系统自动反馈,这种个性化回应让用户感受到温暖与人情味,增强了互动的惊喜感。

note

一些应用的界面共情细节

文章指出Slack通过表情符号反应功能,让商务沟通更轻松活泼;其Slackbot消息措辞友好,像同事聊天一样,使工作体验带有游戏般的感觉,体现了浓厚的人性化设计。

Slack

一些应用的界面共情细节

文章提及Timepage日历应用在滚动查看日期时,会浮现一键返回今日的按钮,既不破坏整体美观,又像伸出手帮助用户,体现了开发者对使用情境的体贴与人性关怀。

Timepage

一些应用的界面共情细节

文章列举多项交互设计案例,如Google Map截图后弹出分享提示、Spark的滑动手势分类邮件、Pinterest长按快速收藏,强调这些自然且贴心的操作能延伸人体行为,让软件交互更具人性温度。

Interaction Design

为注意力设计

文章指出扫描是用户处理网页内容的主要方式,能同时理解内容本身及其与其它段落、标题的元内容关系。标题结构需清晰定义层级,帮助扫描者迅速判断页面主题与意图。

Scanning

一些应用的界面共情细节

Filmarks的「Mark!」功能在用户标记作品已观看后,自动移除「想看」列表中的Clip标记。文章用此说明App像贴心助手般清理用户列表,传达「你已经看过了」的体贴信息,增强了使用中的人性感受。

Filmarks

一些应用的界面共情细节

Netflix的字幕功能在用户将音量调至0时自动显示字幕,体现对可能需要静音场景的提前体贴。文章以此为例,说明该设计传递出制作人的细腻关怀,让用户感受到超越功能的人性温暖。

Netflix

Apple 辅助功能更新

本文中 Apple 宣布将于今年晚些时候推出 Assistive Access、Live Speech 等多项辅助功能,覆盖认知、视力、听力及肢体活动障碍用户。这些功能基于设备端机器学习,保护隐私,并与残疾社群反馈深度结合,延续其让所有人都能顺畅使用产品的承诺。

Apple

非预测概念模型的短板

本文作者,斯坦福大学计算机科学教授。他尝试用 DALL-E 2 生成个人主页照片,并通过多次迭代提示词试图生成斯坦福主四合院在《银翼杀手》风格下的图像,但最终未能获得满意结果。文章以此为例,讨论生成式 AI 缺乏可预测概念模型的问题。

Maneesh Agrawala

非预测概念模型的短板

系统模型指系统真实的内部运作机制,文中以冰箱为例说明其与用户概念模型不符时,用户无法预测控制结果,生成式AI同样缺乏可预测的系统模型。

System Model

ChatGPT 能否提高业务文档编写效率

文章结尾引用Doug Engelbart的理念,强调AI应作为增强人类智力的工具而非取代人类。研究结论认为,ChatGPT与专业人士协同工作符合这一愿景,能产生超越单独使用任一方的效果。

Doug Engelbart

BeReal 正在陨落

文章提到 BeReal 过去九个月仅新增两项面向用户的功能,其中一项为在帖子里添加正在播放的歌曲,即可附上 Spotify 链接。该功能被描述为对用户吸引力有限,无法成为留存用户的核心理由。

Spotify

非预测概念模型的短板

文中提到的对话式文本生成工具。支持多轮会话,可将先前上下文作为后续生成的条件,试图建立一定共同基础。但作者指出其常识与语义 grounding 仍较浅,用户仍需多次交互才能建立基本共享事实,且无法通过对话更新模型本身。

ChatGPT

每个 macOS 中都有一个比特币白皮书文件

Apple 自 macOS Mojave(10.14)起在系统中内置了 Bitcoin 白皮书 PDF 文件,直至 Ventura 13.4 beta 3 版本才移除。该文件位于 VirtualScanner.app 资源目录中,文件大小 184KB,用于 Image Capture 的测试场景。

Apple

非预测概念模型的短板

Don Norman在其书中通过自家双温区冰箱的控温案例,说明当界面无法提供可预测的概念模型时,用户只能依赖试错操作,这与生成式AI的使用困境相似。

Don Norman

畅想 iOS 融入 AI 后的未来

文中指出,Apple面临适应AI时代或逐渐衰落的抉择,其2.6万亿美元帝国主要依赖iPhone,后者贡献近4000亿美元年收入的一半。文章强调,iPhone的成功直接带动App Store、AirPods等业务,因此必须在未来几年内对iOS进行实质性更新以应对AI驱动的用户习惯变化。

Apple

畅想 iOS 融入 AI 后的未来

本文将 Siri 定位为 iOS 未来 AI 功能的主要入口,作者建议在锁屏底部新增专用启动按钮,以支持语音和文字两种交互方式。目前通过长按侧边按钮唤醒的方式不够直观且易被忽略,无法适应 Siri 重要性提升后的使用场景。

Siri

采访 Jenny Wen, FigJam 设计师

Slack 是 Figma 设计团队日常沟通与反馈的主要渠道。团队成员常在 Slack 分享 Figma 文件链接,邀请他人进行 riffing,并在消息中附带“Riff Zone”入口。文章展示 Slack 帖文示例,说明其如何促进团队视觉迭代与文化建设。

Slack

ChatGPT 能否提高业务文档编写效率

本文由Nielsen Norman Group发布,作者Jakob Nielsen基于MIT研究撰写,总结ChatGPT对商务写作的生产力影响。该机构文章聚焦用户体验与工具实证效果,强调评估输出质量的重要性,并指出当前研究仍需更多定性洞察与长期数据。

Nielsen Norman Group

非预测概念模型的短板

《日常物品的设计》是Don Norman的经典著作,书中冰箱控温的例子被用来阐释良好界面应帮助用户建立能预测输入输出关系的概念模型。

The Design of Everyday Things

畅想 iOS 融入 AI 后的未来

iPhone 是苹果 2.6 万亿美元帝国核心,硬件销售占年收入近半,其他业务如 App Store 均依赖其成功;文章讨论其在 AI 时代需通过增量演进适应变化,否则面临淘汰。

iPhone

非预测概念模型的短板

概念模型指用户对系统运作方式的理解,文章强调良好界面需让用户建立可预测的概念模型,否则将迫使用户进行反复试错。

Conceptual Model

ChatGPT 能否提高业务文档编写效率

Jakob Nielsen为本文作者,他在文中分析MIT的实证研究,指出ChatGPT可使商务人士产出增加59%且质量提升0.7分。他强调工具需正确使用、人工校验输出,并提出AI与人类协同而非替代的观点。

Jakob Nielsen

每个 macOS 中都有一个比特币白皮书文件

文中提到,Virtual Scanner II 可能用于支持 macOS 的“从 iPhone 导入”功能。该功能与 Image Capture 工具中的扫描预览相关,Bitcoin 白皮书 PDF 正是通过此虚拟设备展示。

iPhone

Creativerly 工具栈

本文中 Mailbox 被作者视为 Proton Mail 的备选隐私邮件服务,因 Proton Mail 近期多次宕机,作者计划评估 Mailbox 等替代方案。

Mailbox

Modern iOS Navigation Patterns

本文将自身定位为 Apple《Human Interface Guidelines》的非官方补充章节,多次引用 Apple 的导航栏、披露指示器、页面控件、侧边栏等设计规范,并讨论 iOS Home 屏幕作为 hub-and-spoke 模式的示例。

Apple

老 Dark Sky 应用分析

文章引用其《Magic Ink》一文,将信息设计定义为“情境敏感的信息图表设计”。作者以此理论框架分析Dark Sky如何通过环境上下文动态调整展示内容,使天气数据真正服务于日常决策。

Bret Victor

Modern iOS Navigation Patterns

本文未提及 Mailbox,该实体与 iOS 导航模式讨论无关。

Mailbox

老 Dark Sky 应用分析

2020年初收购Dark Sky公司,后逐步关闭其独立应用并将预报技术并入自家产品。文章以此为背景,探讨优秀数据可视化设计因商业决策而消失的遗憾。

Apple

老 Dark Sky 应用分析

本文以 UX 为标签,突出 Dark Sky 应用在用户体验上的优势,其上下文敏感的图表和细节设计让用户能快速把握天气形态并采取行动,远超静态展示方式。

UX

Modern iOS Navigation Patterns

本文未提及 Slack 这一实体,未提供任何相关描述或用法。

Slack

Modern iOS Navigation Patterns

本文详细说明 drill-down 中的边缘滑动手势、pyramid 模式下的水平滑动切换,以及 step-by-step 流程的模态呈现方式,展示如何通过手势与控件实现流畅的导航交互。

Interaction Design

T9 键盘史

本文结尾提到,SloppyType 发明演变为多模态输入套件,后被营销为 XT9 Advanced Input,用于支持触摸屏 QWERTY、笔迹和手势输入,延续了 T9 的词语消歧与纠错能力,服务于汽车等移动场景。

XT9

设计思维批判

文中提到“用户体验”一词最初由Apple提出,当时设计仍以个人工作为主。设计思维兴起后,它将用户体验扩展到系统重构层面,强调通过共情发现痛点并生成解决方案。

User Experience

First 1000 - Waze

Waze为吸引9%偶尔贡献用户,构建积分与虚拟商品系统,鼓励他们参与地图修正与报告;此机制帮助从1%核心用户扩展到更广群体,是社区驱动地图更新的关键手段。

游戏化

T9 键盘史

本文中SloppyType是Tegic团队针对触摸屏QWERTY键盘设计的发明,后成为手写、滑动手势等多模态输入的基础技术。经Swype等收购整合后演变为XT9 Advanced Input,扩展了T9/XT9的产品线。

SloppyType

Musk 要求 Twitter 员工为他的推文增加曝光

本文指出Spotify删除了一项条款,该条款曾允许Apple使用Findaway Voices平台的人声数据训练机器学习系统。Spotify此举被视为保护其近期收购的有声书资产的相关权益。

Spotify

Musk 要求 Twitter 员工为他的推文增加曝光

James Musk在周一凌晨2:36通过Slack向Twitter工程师群发紧急消息,称需调试全平台互动率问题,要求有能力做仪表盘和写代码的人立即响应,成为算法紧急修改的起点。

Slack

T9 键盘史

T9是Tegic公司开发的手机九键文本输入技术,通过按键消歧实现整词输入,显著提升SMS发送效率。文章指出其最初面向残疾辅助,后转向商用,兼容标准ABC布局以满足手机厂商需求,最终在全球超40亿设备上使用。

T9

T9 键盘史

文章指出 SloppyType 技术成为 Swype 等手势输入的基础,在 Swype 被收购后进一步发展为 XT9 套件,实现了从按键消歧向触摸屏多模态输入的扩展。

Swype

T9 键盘史

Touch-Tone即DTMF按键电话技术,文章追溯其60年代起源及80年代用于文本输入的研究,为T9的键位消歧提供了早期基础。Tegic最初尝试优化布局,后因厂商标准采用该ABC键位。

Touch-Tone

Musk 要求 Twitter 员工为他的推文增加曝光

文章在多处提及Apple:其App Tracking Transparency被Google Privacy Sandbox作为参照;同时指出Apple在印度扩大制造业务受物流、关税和基建限制而进展缓慢;此外Spotify移除条款以防Apple用人类声音训练机器学习系统。

Apple

T9 键盘史

MacKenzie 等人提出 keystrokes per character (KSPC) 等指标,用于更准确地比较不同文本输入方法在移动设备上的效率,文章指出许多研究因训练不足而低估实际表现。

KSPC

First 1000 - Waze

文章中提到,2012年苹果推出存在严重缺陷的Apple Maps应用,导致Tim Cook公开推荐用户下载Waze等替代应用。这直接推动Waze用户数激增40%,达到5000万。文中还指出苹果并不对外销售地图数据,是地图服务领域的参与者之一。

Apple

First 1000 - Waze

Apple Maps于2012年发布并取代谷歌成为iPhone默认导航应用,但因产品不成熟引发大量批评。蒂姆·库克公开道歉并推荐用户下载Waze等替代应用,导致Waze用户量激增40%至5000万,Waze内部至今仍庆祝“蒂姆·库克日”。

Apple Maps

T9 键盘史

Multi-tap是手机按键多次点击输入法,文章中T9作为其替代方案,通过整词消歧减少击键次数。研究显示经验用户用T9速度可达20.4 WPM,而多击法提升有限,年轻用户常因习惯抵触切换。

Multi-tap

T9 键盘史

Silfverberg 等人的论文基于 Fitts's Law 建立理论模型,预测 T9 单键输入的专家速率可达 40.6 WPM,并与多击和双键输入进行对比,分析视觉确认对性能的影响。

Fitts's Law

First 1000 - Waze

Waze观察到典型1%核心创建者、9%偶尔贡献者、90%仅消费者模式,据此设计不同激励:1%自发铺路,9%靠游戏化驱动,90%享受最终实时导航服务。

参与不平等效应

Google Slides 技巧

Slido 是 Google Slides 的互动投票插件,支持在幻灯片中直接插入选择题或开放式问题,并实时显示结果,无需切换屏幕。文章推荐其用于线上演示的现场互动,并附有 3 分钟视频演示及作者个人使用体验。

Slido

又一篇介绍 Dark Patterns 的文章

Harry Brignull于2010年首次定义Dark Patterns,并创建darkpatterns.org网站,用于命名各种模式并曝光使用该设计的公司。该定义指出这类界面是精心设计以诱导用户做出特定行为,而非偶然错误。文章提到Brignull的工作至今仍被广泛引用。

Harry Brignull

减少用研中的霍桑效应

文中说明在可用性测试中,霍桑效应可能使参与者更谨慎操作,导致结果无法反映真实使用场景。作者建议通过定性方法如口头协议和前后访谈,聚焦因果关系以缓解影响,并指出霍桑工厂原始实验与典型可用性测试存在显著差异。

Usability Testing

使用 Figma 简单制作流体效果

本文主题是利用 Figma 原生功能制作液态(gooey)动画。通过对黑圆应用模糊并叠加混合模式,可生成可自定义颜色、形状与速度的融合图形。该动画能直接录制于原型中,为界面设计增添生动“哇”效果,并提供社区文件供快速复用。

Liquid Animation

Google Slides 技巧

Poll Everywhere 是另一款 Google Slides 投票插件,支持通过短信收集答案,并提供地图标注等多种题型。文章将其作为 Slido 的替代选项,强调其在演示中实现多样化互动的功能。

Poll Everywhere

使用 Figma 简单制作流体效果

文中列为支持该Dodge & Burn液体动画技术的工具之一。与Figma、Sketch并列,说明该方法不依赖单一平台,可在支持混合模式的设计环境中实现。

Rive

又一篇介绍 Dark Patterns 的文章

本文中 Sneaky opt-outs 指公司将取消订阅或服务的选项藏在小字或多层点击后,使用户难以退出。这种设计利用用户注意力不足维持订阅关系,属于暗黑模式中限制用户选择的类型,损害用户自主权并可能引发信任问题。

Sneaky opt-outs

又一篇介绍 Dark Patterns 的文章

文章描述 Bait-and-switch 为公司先以低价或免费试用吸引用户,试用结束后自动转为高价收费。此策略诱导用户做出非本意决策,属于修改决策空间的暗黑模式,常用于订阅服务以增加营收。

Bait-and-switch

GitHub 裁员 10%,并决定完全远程办公

Slack 将继续作为 GitHub 的日常协作工具,仅视频会议功能迁移至 Microsoft Teams。公司此举旨在节省开支,同时保留现有协作流程,计划在 2023 年 9 月前完成视频会议迁移。

Slack

iPhone 14 Pro GPU 设计失误

本文中Apple为iPhone 14 Pro规划了大幅升级的GPU功能,因开发后期发现功耗远超预期而被迫放弃,导致图形性能提升幅度远小于以往世代。该事件被描述为公司芯片设计史上前所未有的挫折,并引发图形团队重组及部分管理人员调整。

Apple

使用 Figma 简单制作流体效果

文章提及该技术基本适用于任何支持模糊的设计工具,包括Sketch。可通过相同混合模式方式适配,作者选择Figma演示但明确指出Sketch同样可行。

Sketch

又一篇介绍 Dark Patterns 的文章

Sneak into basket指在用户不知情或未同意的情况下自动将额外商品或服务加入购物车,借此利用认知偏差增加收入。文章以Sports Direct为例,展示杂志和马克杯被自动添加至篮中的情况。此模式属于常见的Dark Patterns类型之一。

Sneak into basket

又一篇介绍 Dark Patterns 的文章

本文提到作者与两位UX朋友共同制作的播客《UX Guide to the Galaxy》,其中一期专门讨论暗黑模式,用户可在Spotify等平台收听。该播客内容直接促成本文撰写,成为介绍暗黑模式主题的引子。

Spotify

AR 现状探讨

本文由Nielsen Norman Group发布,聚焦移动AR应用的用户体验研究。该机构通过实际测试总结了AR的可用性问题与设计原则,为设计师提供指导。文章是其三篇系列中的第三篇,延续前两篇关于引导和校准的讨论。

Nielsen Norman Group

试试一周不开会

Slack 在 GSD 周被用于发布项目章程、时间线、下一步行动及 1:1 问题等异步信息。领导层通过 Slack 频道统一传达无会议周规则与提示,员工则在其中共享更新与评论。Slack 成为公司内部异步沟通的主要渠道,帮助团队在取消会议后仍保持信息同步。

Slack

Safari Cookie 政策改变

本文描述,Apple 通过 WebKit 的 Intelligent Tracking Prevention 机制,先对 JavaScript Cookie 设置 7 天到期上限,后改为统一清理所有脚本可写存储。Safari 及 iOS WebKit 浏览器均受此更新影响。

Apple

AR 现状探讨

研究发现电商类 AR 功能 discoverability 差,用户即使频繁使用 Amazon 等 App 也常不知道 AR 功能存在。文章建议在产品列表页添加视觉标识或筛选选项,以提升 AR 功能的可见性。

Discoverability

AR 现状探讨

本文中Mission to Mars应用被作为正面案例,展示了清晰的分步文字指引与简单校准流程的结合。用户能快速理解放置物体所需的表面、光线和相机稳定要求,从而顺利启动AR体验。该案例说明良好指令设计可降低新手用户的操作门槛,提升AR可用性。

Mission to Mars

多邻国使用 Rive 的案例

Rive是Duolingo选用的实时交互动画工具,文件体积小巧,能与Android、iOS和Web端无缝集成。它的核心优势在于支持从有限资产生成近乎无限的动画组合,同时保持Duolingo的视觉风格。

Rive

Safari 16.1 新功能

iPadOS 16 通过 Stage Manager 带来全新多任务体验,使 Safari 浏览器窗口可调整为多种视口尺寸与宽高比。响应式设计中的 CSS 媒体查询和容器查询因此变得更加重要。

Stage Manager

在 Rest Of World 丢人系列

本文提到新冠疫情期间,中国民众需用微信扫描政府分配的二维码才能进入公共场所。这一功能让微信账号成为日常生活必需,账号被封后不仅影响社交和支付,还导致无法完成基本出行或购物等活动。文章通过此例强调微信在中国社会中的深度渗透,以及用户为恢复账号而被迫提交手写致歉信的无奈。

QR Code

关于产品质量的思考

文中多次引用 Apple WWDC 演讲,讨论优秀设计的品质与有意设计理念;同时提到 Rewind 充分利用 Apple Silicon 与 macOS Ventura 能力打造本地优先的产品体验。

Apple

关于产品质量的思考

Framer.js 是作者转向交互式移动原型设计时使用的 JavaScript 动画库,能快速创建接近真实产品的网页与移动端原型,显著提升了设计迭代与沟通效率。

Framer

Safari 16.1 新功能

新款 iPad Pro 支持 Apple Pencil 悬停,Safari 等浏览器可据此显示链接悬停态与动画效果。文章建议使用特性检测而非设备或 UA 检测,以保证网站对未来输入方式的兼容性。

Apple Pencil

No Mackeeper

Apple被描述为高度重视macOS平台安全的公司,这被视为macOS恶意软件占比仅6.2%的原因之一。文章指出其安全优先策略与较小的桌面份额共同降低了感染风险,但仍无法完全阻止MacKeeper类工具带来的威胁。

Apple

Meta 苟延残喘

本文中Apple通过实施App Tracking Transparency政策,切断了Meta广告与转化数据的确定性关联,导致Meta每年损失约100亿美元收入。该政策使广告效果测量转为概率模型,降低了广告价值和确定性。文章指出,尽管ATT带来结构性冲击,但Meta正通过AI投资应对,且Apple在SKAdNetwork 4中有所退让。

Apple

多邻国使用 Rive 的案例

Rive State Machine以可视化方式管理动画状态之间的逻辑、过渡与混合,使Duolingo能通过程序控制口型与角色姿势的同步播放。它把20多种口型动画与角色闲置动作结合,导出后供工程师直接集成到App中。

Rive State Machine

Safari 16.1 新功能

iPadOS 16 上的 Safari 16.1 支持 Stage Manager 带来的任意视口尺寸与宽高比变化,并新增 Apple Pencil 悬停状态检测。文章强调需改用特性检测而非设备检测,以适配这些新交互方式。

iPadOS 16

审美全球化

文章指出网站设计中的A/B测试经过数十年积累,已形成基于用户数据的狭窄设计惯例,导致SaaS等页面布局高度一致。这些测试结果被视为网页趋同的科学诱因之一,与Canva等模板工具共同削弱了创意空间。文章将其与主题“一切看起来都一样”直接关联。

A/B Testing

App Store 广告与 NFT 政策

本文中Apple于2022年10月发布iOS 16.1、iPadOS 16.1和macOS Ventura,同时更新App Store规则,限制NFT解锁应用功能,要求通过其支付系统购买NFT或社交帖子推广服务。

Apple

奥利奥与 Clippy 联动

Clippy(原名Clippit)是Microsoft Office套件中的虚拟回形针助手,1997年推出后因不受欢迎被移除。本文中它与Oreo Thins合作推出包装,主题为“值得的零食休息”,体现其从被批评到回归的叙事。文章提及Microsoft曾提议用表情符号形式让其回归。

Clippy

iPhone 激光雷达扫描试玩

本文核心围绕iPhone进行3D扫描,12 Pro及后续机型支持LiDAR,全部机型可进行摄影测量。强调其体积小、成本低、单机完成扫描的优势,适合初学者快速获取空间或物体模型。

iPhone

Figma 重塑 Find and Replace

文章中提到团队为内部测试专门创建了Slack频道,用于收集队友对查找替换功能设计的反馈截图。这些反馈帮助设计师了解用户习惯,如从FigJam切换到Figma时按Enter键的期望,从而迭代快捷键设计。Slack成为跨团队沟通和原型验证的重要工具。

Slack

Netflix 隔空投送营销

iPhone用户在时代广场和日落大道附近收到来自Sleepy Hollow Cemetery的AirDrop请求,内容为电影广告牌图片。该功能被用来模拟电影中墓中发短信的恐怖感,活动不强制接受,仅通过推送行为引导路人关注手机屏幕。

iPhone

Figma 重塑 Find and Replace

本文核心主题是从插件演进为Figma与FigJam原生功能的查找替换特性,涉及空间排序、缩放平移启发式规则、快捷键设计及“保持原大小写”设置的智能简化等工程与交互挑战。

Find and Replace

网页检测 iOS 锁定模式的方法

Apple 开发了 Lockdown Mode 作为针对高度复杂网络攻击的极端保护措施,适用于可能成为国家支持间谍软件目标的用户。文章强调,这一功能并非漏洞,而是安全与隐私之间的权衡结果,Apple 无法阻止网站通过字体加载等特征检测其启用状态。

Apple

YouTube 的「不感兴趣」没什么用

本文中“Not Interested”是YouTube用户反馈工具之一。Mozilla研究发现,点击该按钮仅能阻止11%的“坏推荐”视频再次出现,效果微弱。研究指出,用户通过该选项表达不感兴趣后,相似内容仍会反复推送,说明其对算法的影响有限。

Not Interested

Snapchat 复杂界面的好处

本文标题提及Snapchat作为案例,指出其与Netflix一样故意打破UX设计原则。文章认为这种打破并非随意,而是为了特定积极目的。文中强调偶尔违反指南可能带来好处。

Snapchat

Snapchat 复杂界面的好处

本文标题提及Netflix作为案例,指出其与Snapchat一样故意打破UX设计原则。文章认为这种打破并非随意,而是为了特定积极目的。文中强调偶尔违反指南可能带来好处。

Netflix

Zenly 如何解决地图社交应用的挑战

文章将 Apple Maps 与 Google Maps 并列为地图数据的主要掌控者,Zenly 选择在其基础上开发而非重建地图引擎。Zenly 的策略是跳过基础地图竞争,直接打造社交化的 Place Graph 层。

Apple Maps

YouTube 的「不感兴趣」没什么用

本文中“Remove from watch history”是YouTube提供的反馈机制之一。研究量化结果显示,该选项可阻止29%的坏推荐。Mozilla指出,即使用户清除观看记录,算法仍会在数周至数月后持续推送相似内容,控制效果不持久。

Remove from watch history

Platformer 第二年总结

文章指出,App Association自称代表小型开发者,但其大部分资金来自Apple,显示Apple在该组织中的实际影响力。

Apple

YouTube 的「不感兴趣」没什么用

Dislike是YouTube提供的一种反馈按钮,在本次随机对照实验中被单独测试。结果显示点击Dislike仅能阻止12%的相似不良推荐,效果低于“不要推荐该频道”(43%)和“从观看历史移除”(29%),属于四种方法中效率较低的一种。

Dislike

Snapchat 复杂界面的好处

Kumar Shubham是本文作者,文章于2022年8月在UX Magazine发表。文中通过Snapchat和Netflix案例,探讨打破UX设计原则的合理性。

Kumar Shubham

Snapchat 复杂界面的好处

文章探讨Snapchat和Netflix如何有意识地打破UX设计原则。描述指出这种做法是为达成良好结果,而非盲目违反。标题直接点明两者以此为主题展开讨论。

UX设计原则

公众科学中的排队设计

本文提到英国政府借鉴迪士尼等主题公园的队列管理经验,包括蛇形折返设计以节省空间、定时返场机制以及大屏幕播放历史影像来分散注意力。这些做法帮助维持长达数英里的队列秩序,同时通过预计等待时间提示降低挫败感。文中指出,此类娱乐与信息手段是保持人群耐心的重要手段。

迪士尼

YouTube 用户变速播放习惯分析

智能电视等客厅设备上,用户观看YouTube视频时正常速度使用时长最长,其次是1.25x倍速。这与手机或网页端形成对比,反映客厅场景下用户更倾向以接近正常的速度观看内容,较少使用高倍速加速。

智能电视

Snapchat 复杂界面的好处

本文发布于UX Magazine,标题为《How Snapchat and Netflix Break UX Design Principles》。作者Kumar Shubham在该平台发表此文,讨论UX原则的例外应用。

UX Magazine

Microsoft 与 Figma 的合作关系揭秘

Sketch是早期设计工具,仅支持MacOS,文件分享常因字体或版本问题受阻。Xamarin团队在转向Figma前曾用Sketch+Dropbox协作,遇到同步困难。微软2018年设计宣言同时提及Figma与Sketch,显示两者均为过渡中的备选方案。

Sketch

探讨 iOS 应用首页与导航栏设计

文章引用该书 2006 年内容,说明网页端全局导航常驻的理由,并讨论其思想在移动端的适用性变化。

Don't Make Me Think

公众科学中的排队设计

本文描述的排队追踪系统包括政府提供的直播页面,可实时显示队列物理长度与预计等待时间,最高达14小时。该系统配合社交媒体通知,告知民众何时开始排队或避免加入,以防止队列过度增长。文中指出,尽管存在小故障,该透明机制仍帮助参与者做好心理准备。

排队追踪系统

ISO 8601 日期格式标准

文章提及Alan Cooper的著作About Face,其中提出的交互设计原则被用于指导日期输入字段的国际化处理方式。

About Face

CSS :has() 伪类:期待已久的父选择器功能

Apple 旗下 WebKit 团队主导了 :has() 的完整实现,未采用受限版本而是直接支持全功能。他们结合现有 CSS 引擎优化策略,解决了长期困扰的性能难题,使该特性最终得以发布。

Apple

交互式语音应答系统(IVR)设计指南

文中将GUI的直接操纵优势与电话树对比:用户可通过视觉直接引用相关信息,而无需记忆。电话树因缺乏此特性,用户必须按顺序聆听并记住选项,操作难度显著上升。

Direct Manipulation

交互式语音应答系统(IVR)设计指南

本文指出,拨打电话的交互成本远高于在网页上搜索答案,因此多数用户仅在网站或App无法解决问题时才会选择致电。许多电话树系统却反复引导用户返回网站,形成恶性循环,进一步增加用户挫败感。

Interaction Cost

交互式语音应答系统(IVR)设计指南

本文指出,在电话树菜单中,使用独特且区分度高的表述能增强信息 scent,帮助来电者快速判断哪个选项与其问题最相关。文章强调限制每级菜单选项为4-5个,并避免重复词汇,以免降低 scent,导致用户难以选择。

Information Scent

交互式语音应答系统(IVR)设计指南

本文将16条phone tree指南直接对应Nielsen的10条usability heuristics,如灵活性、一致性、错误预防和系统状态可见性等。文章指出不良phone tree常违反这些启发式,导致用户记忆负担和挫败感,并建议以此为checklist进行改进。

Usability Heuristics

交互式语音应答系统(IVR)设计指南

本文核心讨论phone tree(电话树)的用户体验问题,它通过多层菜单分流来电者,常因目标冲突和缺乏视觉辅助而令人沮丧。文章基于22家组织的expert review,提出16条指南,涵盖一致性、撤销选择、简洁反馈等要点。phone tree被视为omnichannel体验的重要环节,但需避免迫使用户返回网站。

Phone Tree

ISO 8601 日期格式标准

文中引用Alan Cooper的设计原则“Design for the probable, provide for the possible”,强调应优先提供用户最常用信息,再支持可能需要的细节。

Alan Cooper

百味来Spotify歌单:与意面烹饪时间同步的创意营销

本文展示的是Spotify平台上的一个用户主页页面,标题为“BARILLA on Spotify”,对应URL为open.spotify.com下的用户路径。该页面被归类为User类型,表明Spotify在此作为内容分发平台,承载了BARILLA这一用户账号的公开展示。

Spotify

音频标识记忆模式

本文正文未讨论希克定律,仅在相关文章列表中出现链接,因此无针对性内容可归纳。

希克定律

交互式语音应答系统(IVR)设计指南

本文由Nielsen Norman Group发布,作者通过分析22家组织的phone tree系统,总结出16条基于usability heuristics的改进建议。该组织专注于UX研究,文章强调phone tree设计应符合用户控制和错误预防等原则,以提升来电体验。

Nielsen Norman Group

数字键盘简史与布局差异

文中将James White 1822年概念机视为现代直接操纵界面的最早例证,用户可直接按键输入,无需操作裸露杠杆或鼓轮等机械部件。对比Pascaline等早期设备,该方式提升了输入专注度与易用性。

Direct Manipulation

iPad 圆形光标解析

本文通过相关文章链接提及Stage Manager,关联iPadOS上的多任务与指针交互场景,作为触控优先光标设计的系统背景之一。

Stage Manager

iPad 圆形光标解析

文章核心讨论 Apple 在 iPadOS 上推出的触控优先圆形指针,取代传统箭头鼠标。它通过 Pointer Magnetism 自动吸附到按钮等元素,并随背景自适应颜色以提升可见性。相比传统指针,这种设计更接近手指交互,支持动态变形和轨迹预测,适用于触屏与触控板场景。

Touch-First Cursor

数字键盘简史与布局差异

文中提到AT&T于1960年发表的《按键电话设计与使用的人机工程学研究》,系统测试了不同排列对操作速度和出错率的影响。研究显示计算器式布局表现一般,而紧凑的3×3+1格式因易用性胜出,成为电话键盘的最终选择。

人机工程学

数字键盘简史与布局差异

本文中双音多频指AT&T在1950年代末计划推出的按键电话新频率系统,用于替代旋转拨号盘。该系统要求工程师通过人体因素研究确定最优按键布局,以提升拨号速度与准确性。最终选定的3×3+1排列成为现代电话键盘标准。

双音多频

数字键盘简史与布局差异

文章聚焦数字键盘的历史演变,指出其源于19世纪机械计算设备。1844年首台单排按键原型出现,后经Comptometer九到一列布局、Dalton十键机发展,至1914年Sundstrand确立789在上、0在底的3x3+1标准布局。该布局直接影响现代计算器键盘设计,与电话键盘形成反向差异。

数字键盘

Google Map 与 Apple Map 对比分析

本文由 Built for Mars 网站发布,是一篇针对 Apple Maps 和 Google Maps 的 UX 案例研究。文章于 2022 年 7 月 7 日更新,标题明确标注为 UX 分析,旨在提供地图产品的设计洞见。

Built for Mars

Google Map 与 Apple Map 对比分析

本文将 Google Maps 作为与 Apple Maps 进行 UX 对比的核心对象之一,分析其在近十年地图服务竞争中的用户体验表现。文章从实用角度提取了两款产品在导航、界面和功能上的差异化设计要点。

Google Maps

Raycast Hacking Friday

Slack 在 Rayday 流程中用于早晨发起线程,团队成员在此分享当天计划的项目。文章说明当天无会议要求,成果则在周一会议展示,Slack 成为协调与记录 Rayday 进度的主要工具。

Slack

数字键盘简史与布局差异

1892年Almon Brown Strowger发明旋转拨号盘,1919年Western Electric商业化。该装置在按键电话普及前广泛使用,早期按键尝试多为快捷方式而非直接数字输入,直到1950年代后才逐步被Touch Tone按键取代。

旋转拨号盘

iPad 圆形光标解析

Pointer Magnetism 是 iPadOS 指针的一项特性,当接近按钮等元素时,圆形光标会自动变形为胶囊状并吸附到元素中心。系统会分析指针轨迹,判断最可能的目标并施加磁吸效果。开启无障碍边框后,这一吸附过程会更明显,类似网页的焦点高亮。

Pointer Magnetism

iPad 圆形光标解析

本文指出传统鼠标箭头自 1981 年起未有重大演进,其最初形态由 Xerox 工程师 Douglas Engelbart 设计。iPadOS 的圆形触控指针打破了这一长期不变的箭头样式,带来更具动态和交互性的新形态。

Douglas Engelbart

iPad 圆形光标解析

Apple 在 iPadOS 中重新设计鼠标指针,使其成为触控优先的圆形光标,并引入 Pointer Magnetism 与无障碍功能。文章指出这一改动打破了自 1981 年以来几乎未变的箭头形态,让指针能随背景颜色变化并吸附到可点击区域。开发者可依据 Apple 的指引进一步定制指针外观与注释信息。

Apple

iPad 圆形光标解析

本文以ProtoPie为例展示近期圆形光标在原型中的应用,链接了其圆形光标演示,说明该工具支持更动态的触摸式指针交互。

ProtoPie

数字键盘简史与布局差异

1902年推出的Dalton加法机是流行10键机型,采用两排五键布局(上24579、下13068),首次将0纳入序列。它将打印与计算功能小型化结合,取代多列计算器,成为簿记员常用工具。

Dalton 加法机

Google Map 与 Apple Map 对比分析

本文以 UX 为核心主题,对 Apple Maps 与 Google Maps 展开案例分析,提炼出可直接应用于设计的用户体验要点。文章聚焦两款产品在实际使用场景中的界面与交互差异。

UX

Google Map 与 Apple Map 对比分析

本文将 Apple Maps 作为与 Google Maps 进行 UX 对比的核心对象之一,分析其在近十年地图服务竞争中的用户体验表现。文章从实用角度提取了两款产品在导航、界面和功能上的差异化设计要点。

Apple Maps

iPad 圆形光标解析

本文提到Principle是早期用于展示触摸指针的原型工具,常作为手指替代物出现在应用演示和原型中,属于最早采用圆形触摸式光标设计的工具之一。

Principle

数字键盘简史与布局差异

1884年Dorr Felt发明Comptometer,采用八列按键、上9下1的排列,每列代表一个十进制位,用于处理大数运算。该设计源于Pascaline机制与通心粉盒灵感,强调操作效率,操作员优先使用下方低值键通过补码完成输入。

Comptometer

iPad 圆形光标解析

本文中 iPadOS 将传统鼠标箭头重构为触控优先的半透明圆形指针,可随背景自适应颜色以提升可读性。该指针能根据用户手指式轨迹动态变形,并通过 Pointer Magnetism 吸附到界面元素中心。文章强调此设计让光标交互更接近触摸屏体验,同时支持多种无障碍定制选项。

iPadOS

iPad 圆形光标解析

文章提及传统斜向鼠标箭头最早由 Xerox 工程师设计,iPadOS 之前的指针形态长期沿用这一形式。直至 Apple 在 iPadOS 上推出触控优先的圆形指针,才对这一近 40 年的设计进行根本性改变。

Xerox

Andy Works:打造极致愉悦体验的 Checkbox 设计

Not Boring Habits 凭借其富有游戏感的复选框交互,获得 2022 年 Apple Design Award 的 Delight & Fun 类别奖项。本文以此为切入点,说明“感觉”虽难以量化,却能成为产品脱颖而出的关键。获奖证明将游戏设计技巧系统应用于生产力 App 是被官方认可的有效路径。

Apple Design Awards

Figma 采访 Grilli Type 创始人 Thierry Blancpain

Grilli Type 的合作团队,制作了 GT Flexa 的首个真实网站应用,通过轻微呼吸动画营造节奏感与品牌 calming 体验。

XXIX

Andy Works:打造极致愉悦体验的 Checkbox 设计

本文中 Jason Yuan 提出的概念,指数字界面中的操作可被设计得像钥匙扣或打火机一样带来反复抚玩的满足感。它强调通过细微的触感和反馈,让日常交互本身就值得反复触发,而非仅完成任务。文章将其作为将游戏手感引入产品设计的核心思路之一。

Fidgetability

Andy Works:打造极致愉悦体验的 Checkbox 设计

文中举例苹果最初用列表滚动时的 momentum 与 rubberbanding 效果说服内部团队采用触摸屏,证明 Feel 在产品决策中的决定性作用。作者以此对比当下 App 普遍缺乏类似细腻反馈,指出日常交互同样需要精心设计的物理质感。Rubberbanding 成为“感觉设计”早期成功的经典案例。

Rubberbanding

Andy Works:打造极致愉悦体验的 Checkbox 设计

本文中 Lofelt 是一款用于将声音文件转换为自定义触觉反馈模式的工具。作者通过它为 checkbox 的点击动作生成匹配的震动模式,再稍作清理后导出 AHAP 文件,实现更具满足感的触觉体验。

Lofelt

Sketch 采访 GitHub 设计师 Gavin Nelson

本文介绍Gavin Nelson使用Sketch进行图标设计,强调其矢量编辑、Inspector界面、多重描边和快捷键等功能如何提升工作效率。他特别提到Sketch能快速切换矢量点类型、查看HEX与HSLA值,帮助处理复杂图层样式。

Sketch

Andy Works:打造极致愉悦体验的 Checkbox 设计

本文引用其在 Muse App 播客中的观点,提出“fidgetability”概念,主张数字动作应像实体小物一样带来抚玩快感。他与 Rahul Vohra、Steve Swink 的理念共同构成文章将游戏手感引入产品设计的理论基础。

Jason Yuan

中国互联网产品的无障碍改造困境

上海视障人士、AI辅具交互设计师,文中多次举例其使用随申码、手机银行、美团应急帮手时遇到的刷脸、拖拽、图片按钮等操作障碍。他指出互联网产品需满足可读性、可操作性和操作效率三点,代表视障用户在使用核心场景中的实际痛点。

蔡东岳

Sketch 采访 GitHub 设计师 Gavin Nelson

本文中Gavin Nelson讨论拟物化设计趋势,认为其并未消亡,而是以更精炼的方式回归,用于传达界面层级与操作暗示。他将超写实皮革效果与简化风格结合,创作出既怀旧又不突兀的GitHub Mobile图标。

Skeuomorphism

Andy Works:打造极致愉悦体验的 Checkbox 设计

Jonathan Cooper 是《Game Anim》一书的作者。本文在介绍 checkbox 动画设计时推荐阅读此书,以了解更多游戏动画的具体技巧和实现方法。

Jonathan Cooper

Sketch 采访 GitHub 设计师 Gavin Nelson

文中人机交互是Gavin Nelson大学主修方向,毕业后以此为基础进入产品设计师岗位,同时继续进行应用图标创作,连接了其教育背景与职业实践。

Human-Computer Interaction

Andy Works:打造极致愉悦体验的 Checkbox 设计

Juice 是 Game Feel 的别称,指游戏开发者为增强交互质感而叠加的视觉、听觉与触觉反馈。本文指出产品设计常忽略这一技巧,仅在里程碑时刻添加少量 delight,而 Juice 应聚焦于每天重复的微交互。作者用 Not Boring Habits 的复选框实践证明,合理运用 Juice 可将简单动作转化为富有象征意义的奖励。

Juice

Andy Works:打造极致愉悦体验的 Checkbox 设计

文中指 iOS 设备提供的物理振动反馈,被视为产品设计中最易被忽视的感官维度。团队通过 Lofelt 工具将声音文件转为自定义 AHAP 触感模式,与音效同步强化勾选瞬间的满足感。即使静音环境下也能传递“ka-thunk”式的实体触感。

音乐触觉

Apple 发布多项创新辅助功能

Apple 公司展示了多项融合软硬件与机器学习的创新辅助功能,旨在帮助残障用户实现导航、控制与交流。这些功能将于今年晚些时候通过软件更新登陆各平台,持续兑现其无障碍承诺。

Apple

COLRv1 彩色字体标准介绍

本文在讨论 COLR 字体兼容性时,以截图形式展示 Sketch 工具中查看 COLR 字体的效果,指出该设计软件目前尚未支持 COLRv0 字体,限制了设计师在界面中直接预览彩色字体的可能性。

Sketch

低技术界面回顾

作者早期职业专注于医疗设备的人因工程,强调物理控件与简单显示的界面设计。本文通过实际案例说明人因工程需兼顾成本、可靠性和老年用户体验,而非默认采用高技术方案。

人因工程

低技术界面回顾

文中强调物理控件通过按钮凹陷或点击声提供触觉反馈,帮助用户确认操作成功,尤其适合夜间或注意力分散的场景。相比之下,当前电容触摸屏缺乏此类即时物理提示,虽未来可能加入触觉反馈,但目前仍是低技术界面的明显优势。

触觉反馈

Apple 发布多项创新辅助功能

iPhone 支持门检测导航、Apple Watch 镜像控制及实时字幕功能,帮助不同残障用户完成导航、远程操作手表和理解音频内容。部分高级特性要求 iPhone 11 及后续机型或搭载 A12 及以上芯片的型号。

iPhone

Apple 发布多项创新辅助功能

本文中 Apple 地图为使用旁白功能的用户提供声音与触感反馈,帮助识别步行导航的起始点。同时新增 National Park Foundation 提供的“Park Access for All”指南,方便用户查找国家公园的无障碍设施与服务。

Apple Maps

Spotify 假艺人依然活跃

本文中Spotify是假艺人故事的核心平台,被指出通过自有播放列表和算法大力推动心情音乐消费,同时推出Discovery Mode计划允许厂牌以折扣换取更多推广。文章强调其因规模最大且最透明而备受关注,并分析其控制内容策展以降低版税成本的动机。

Spotify

macOS 菜单栏图标设计规范总结

文章开篇说明苹果 Human Interface Guidelines 对 macOS 菜单栏额外图标的描述较少,因此本文补充了高度演变、模板图像用法、文件格式等实用细节。文中引用了 HIG 中菜单栏额外的官方链接,并围绕这些缺失内容展开具体设计指导。

Human Interface Guidelines

在线阅读的最佳字体特性调查

文章指出,如果系统频繁更换字体以优化阅读速度,会违反可用性启发式第4条(一致性原则)。作者因此不推荐该自动化方案,尽管理论上可行。

Usability Heuristics

苹果《健听女孩》DVD 开箱与用户体验评测

文章中Apple作为内容出品方,将CODA以DVD形式寄送给奥斯卡评委,用于拉票;这与其长期推动流媒体、淘汰光驱并抵制实体媒介的历史形成鲜明对比。文中详细拆解了Apple寄送的DVD包装、标签刻蚀方式及播放菜单,指出其在形式与功能间的权衡。

Apple

Wikipedia 分享 A/B 测试优化编辑体验

Variant A 中的 onboarding 向新手解释建议编辑的价值与操作方式,最终带来更高编辑成功率。后续 C/D 变体保留可选 onboarding,同时突出建议编辑模块,平衡了引导与直接访问。

Onboarding

Wikipedia 分享 A/B 测试优化编辑体验

文章展示了建议编辑功能的初始用户流程:新手先 opt-in,再经历 onboarding 屏幕,最后看到个性化文章推荐。Variant B 则移除 opt-in 步骤,直接进入建议编辑以测试不同路径效果。

用户流程

Wikipedia 分享 A/B 测试优化编辑体验

本文指出,可用性测试是设计迭代的主要定性来源之一,与社区反馈及量化数据共同使用。团队在开发建议编辑模块时,通过可用性测试收集用户对onboarding流程的意见,以平衡教育引导与操作便捷性。相比单纯数据分析,它能揭示用户为何需要提示才能成功完成编辑。

Usability Testing

在线阅读的最佳字体特性调查

本文作者,Nielsen Norman Group创始人。他分析了352人参与的字体阅读速度实验,得出年龄每增长20岁阅读速度下降约11%的结论,并指出字体选择需考虑个体差异而非统一标准。

Jakob Nielsen

Arun.is 网站改版:回归现代主义平面设计

本文中Reddit被用作“HOT”排序系统的参考模型,该机制借鉴了基于重力算法的热度计算,与Hacker News类似。由于网站内容更新频率较低,这种排序方式与“New”选项效果接近,作者在2.0版本中移除了该功能以简化博客归档页面的排序选项。

Reddit

在线阅读的最佳字体特性调查

本文由Nielsen Norman Group发布,作者Jakob Nielsen基于Adobe研究团队的实验撰写总结。文章指出即使在高易读字体中,不同字体间阅读速度差异可达35%,强调没有单一最佳字体适用于所有用户。

Nielsen Norman Group

Dropbox 简史:从个人服务到企业服务的演变

Dropbox 2013年以1亿美元收购iOS邮件应用Mailbox,保留其独立产品形态,后于2016年2月关闭。文章指出此次收购是Dropbox首次尝试偏离核心文件同步功能,转向真实UI界面产品的重要转折。

Mailbox

Dropbox 简史:从个人服务到企业服务的演变

文中指出Dropbox新增对多个Slack工作区的支持,用户可在Dropbox内直接与Slack协作。Dropbox将Slack视为典型的工作场所应用,通过扩展插件实现无缝切换,减少上下文切换成本。这有助于Dropbox从单纯存储转向主动协作平台。

Slack

电商网站语言切换的 6 个技巧

本文围绕电商网站语言切换功能的UX问题展开研究,基于中国用户测试提出6条具体改进建议,强调自动检测浏览器设置、位置优化与灵活性,以减少国际购物者的操作障碍并提升满意度。

UX

电商网站语言切换的 6 个技巧

本文作者所属机构,通过对中国用户的电子商务研究,发现国际用户优先寻找中文版本或本地化站点。该机构总结了语言切换器的6条设计建议,强调自动检测浏览器设置与手动切换的结合,以提升全球购物体验。

Nielsen Norman Group

Dropbox 简史:从个人服务到企业服务的演变

Dropbox收购并于2014年4月重新推出照片分享应用Carousel,2016年3月与Mailbox一同关闭。文章认为Carousel是Dropbox过度追求prosumer市场的典型例子,并非企业级产品。

Carousel

电商网站语言切换的 6 个技巧

针对移动端空间限制,本文建议将语言切换选项放入汉堡菜单内,作为顶部角落位置的替代方案。研究中用户能通过此方式顺利找到并切换至中文版本,提升了功能可发现性与一致性。

Hamburger Menu

苹果《健听女孩》DVD 开箱与用户体验评测

文章以“definitive unboxing and UX review”为主题,称赞DVD菜单加载迅速、无多余动画,但批评信封取盘不便、标签朝向误导及字幕排版低劣,整体给出混合评价。

UX

Apple Music 桌面端用户体验问题探讨

本文提到 Apple 的 Human Interface Guidelines 定义了三种 iOS 导航方式,并被直接沿用到 macOS Music App,导致 Flat Navigation 在桌面产生可用性问题。

Human Interface Guidelines

Apple Music 桌面端用户体验问题探讨

本文将Apple描述为作者加入的生态系统,其设计理念曾让产品“开箱即用”。作者认为苹果在Apple Music桌面端未能延续这一原则,导致用户需与产品对抗而非享受音乐。

Apple

Substack App 与其网络效应探讨

本文指出Spotify收购了Gimlet Media这家播客网络公司。这一收购发生在作者离职之后,反映了播客行业从独立网络向大型平台整合的趋势。

Spotify

Apple Music 桌面端用户体验问题探讨

文章指出 Flat Navigation 迫使用户记住各栏目的独立历史,显著增加 Cognitive Load,而 Spotify 的全局返回机制则降低了这种负担。

Cognitive Load

Apple Music 桌面端用户体验问题探讨

本文提到作者在iTunes之外长期使用Spotify,发现其桌面端导航结合侧边栏与浏览器式返回按钮,能显著降低认知负荷。作者将Spotify的导航体验与Apple Music的Flat Navigation进行对比,指出前者更符合用户习惯。

Spotify

NN/g 考察国内刷脸支付体验:老问题依旧

本文由Nielsen Norman Group发布,报告了2022年在北京针对刷脸支付的用户研究。研究对比2019年发现,界面反馈不完整、支付金额与上限未显示等问题仍未解决,用户仍对安全性存疑。文章总结了便利性与信任之间的权衡,并提出改善心理模型的建议。

Nielsen Norman Group

Apple Music 桌面端用户体验问题探讨

本文说明 Music App 在 macOS 使用 Flat Navigation,每个侧边栏项目拥有独立导航栈,没有全局返回按钮,导致用户难以回溯操作路径。

Flat Navigation

Apple Music 桌面端用户体验问题探讨

文章核心围绕 Apple Music 桌面端的 User Experience 展开,列举搜索、导航、反馈和响应速度等多处缺陷,指出这些问题让用户难以自由探索音乐。

User Experience

即时设计、MasterGo、Pixso 对比测试

本文在导出功能对比中提及 Sketch 格式。即时设计与 Pixso 均支持将文件导出为 Sketch 格式,MasterGo 暂不支持此导出。

Sketch

Product Hunt 产品存活状态分析

Slack 在 2013 年以 17432 票位列 Product Hunt 历史投票第二高的产品,目前仍返回成功 HTTP 响应,属于文中统计的存活产品之一。

Slack

上下文菜单设计指南

文章引用 Apple Human Interface Guidelines,强调菜单命名、组织与解剖结构的最佳实践,作为设计上下文菜单内容时的参考依据。

Human Interface Guidelines

上下文菜单设计指南

文章专节介绍键盘导航,推荐监听按键实现 type-to-select,并支持 Enter、上下箭头、左右箭头及 Esc 等快捷键循环操作菜单。Height 采用更宽容的匹配算法,指出此功能虽显而易见却常被新应用忽略。键盘导航被视为提升生产力上下文菜单必不可少的组成部分。

Keyboard Navigation

为阿尔兹海默病患者优化书籍排版设计

文中认知负荷指阅读对记忆系统的需求,阿尔茨海默病患者因海马体问题更易受其影响。研究建议通过添加标题、情节摘要和冗余信息来降低负荷,从而帮助读者维持理解和回忆。用户反馈显示此类设计能减轻记忆压力,但需避免显得幼稚或干扰叙事流畅性。

Cognitive Load

上下文菜单设计指南

文中详细讨论子菜单的打开与交互难题,包括光标斜向移动时易消失的问题。Height 选择为主菜单保留简短动画,而完全禁用子菜单动画以保证响应速度。

Submenu

上下文菜单设计指南

本文介绍 Type-to-select 功能,通过监听键盘输入自动选中匹配前缀的菜单项,提升键盘导航效率。Height 团队采用该方式实现快速选择,并支持快速打字时的容错。

Type-to-select

NFT在游戏和音乐领域的接受度差异

本文用Spotify月活听众数据(2100万)来描述歌手John Legend的流行程度,突出其在音乐圈的影响力,并以此对比音乐NFT项目相对温和的粉丝反应。

Spotify

上下文菜单设计指南

本文核心讨论桌面端右键或按钮触发的上下文菜单,强调其跨平台一致性与直观交互。文章指出菜单需根据光标或按钮位置自动对齐,并通过反转轴向在屏幕边缘重定位以避免遮挡。Height 应用通过高亮选中对象、提供点击反馈和安全三角形处理子菜单,提升了操作可预测性与流畅度。

Context Menu

上下文菜单设计指南

Safe Triangle 是解决子菜单交互的方案:当光标处于父菜单项与子菜单之间形成的三角区域内时保持子菜单打开。macOS 与 Amazon 均采用此机制并辅以超时逻辑。

Safe Triangle

NFT在游戏和音乐领域的接受度差异

文章在治理板块提及,美国参议院司法委员会通过《开放市场法案》,要求Apple和Google允许替代应用商店及支付系统。Apple则认为此举会给iOS带来不可接受的安全风险。

Apple

设计师在设计工具自动化时代的角色定位

本文将 Origami Studio 归为原型设计应用,列举其与 Framer 等工具共同支持用户便捷地创建交互原型。文章指出这些工具降低了设计壁垒,让更多人无需复杂操作即可输出原型文件。Origami Studio 的使用加速了设计民主化,促使设计师将精力转向策略、 empathy 和伦理决策而非单纯视觉执行。

Origami Studio

设计师在设计工具自动化时代的角色定位

本文提及 Principle 作为原型设计工具之一,帮助用户快速实现交互原型。它被置于让设计大众化的工具列表中,与 Sketch、Figma 并列,体现软件如何简化设计流程。Principle 等工具的广泛应用促使设计师角色转变,更多承担用户代言、流程透明和系统一致性维护工作。

Principle

iBeer 应用的幕后故事

iBeer 通过 iPhone 的加速度计测量手机与地平线的角度,将液体和泡沫画面与之绑定,实现任意方向倾斜时液体真实流动的效果。Sheraton 用一系列 if 语句切换循环视频片段,模拟啤酒倒空过程。这成为展示 iPhone 屏幕和传感器能力的最直观方式,帮助应用迅速登顶。

加速度计

The New Yorker 2021年度插画回顾

文中提及一本完全以Slack为背景的小说,Somnath Bhatt为其创作插图,描绘人物在热闹屏幕前挣扎,突出数字连接与身体孤立的矛盾。插图采用像素化风格,呼应Slack界面与永转加载提示。

Slack

Google 抱怨 iMessage 对 Android 用户的区别对待

文中Apple的iMessage通过蓝色气泡与额外功能形成 walled garden,文章引用Epic诉讼文件显示其视锁定效应为竞争优势,导致美国18-24岁用户中iPhone占比超70%。苹果拒绝支持RCS以维持此优势。

Apple

Clubhouse 在南亚地区的活跃景象

在页面推荐的观点文章中,Apple被描述为硅谷企业之一,其高管将中国公司视为同行而非对手,与多数硅谷创始人的看法不同。

Apple

《英雄联盟手游》界面概念设计

动效设计围绕“传送”概念展开,采用第一人称视角的穿梭动效增强代入感。主线流程中圆形传送结构配合穿梭动画带领玩家进入战斗,结算与组队等界面也通过交互动效形成完整闭环,强化游戏沉浸感。

动效设计

传闻:苹果或挖角 Xbox 工程师开发游戏主机

本文页面仅显示安全验证提示,未提供任何关于 Apple 的内容或相关传闻细节。

Apple

纽约时报如何A/B测试标题

本文中A/B Testing指《纽约时报》在首页对同一篇文章同时展示不同标题,约半小时后保留点击率更高的版本。数据显示29%的文章存在多标题,最多达8个;测试后的标题往往更具戏剧性,且A/B测试文章登上“最受欢迎”榜单的概率高80%。

A/B Testing

Thoughts on Music

本文中Apple指推出iPod与iTunes Store的公司。2007年2月,Apple已售出9000万台iPod和20亿首iTunes Store歌曲,平均每台iPod仅含22首受DRM保护的曲目(占比不足3%)。Apple与四大唱片公司谈判获得宽松使用权,但受制于DRM泄露后需快速修复的合同义务。文章探讨继续封闭系统、授权FairPlay或彻底取消DRM三种未来路径。

Apple

Spotify 更新其应用图标系统

本文中 Spotify 指数字音乐服务平台,其网页版提供音乐访问入口。描述显示该服务可让用户接触数百万首歌曲,网址为 open.spotify.com,定位为面向大众的音乐平台。

Spotify

Google 抱怨 iMessage 对 Android 用户的区别对待

文章提到,Salesforce 2020 年以 270 亿美元收购 Slack,显示科技巨头对消息平台的重视,与 Google 在该领域反复失败形成对比。

Slack

《英雄联盟手游》界面概念设计

文章指出UX设计前期将游戏各大模块按不同概念分类包装,帮助玩家建立位置感知。主线流程围绕“传送至狂野峡谷”定调,解决玩家从端游熟悉界面到手游新界面的过渡问题,确保操作体验一致且易于识别。

UX

iBeer 应用的幕后故事

iPhone凭借彩色高清屏幕与加速度计成为iBeer的理想载体,Sheraton利用这些硬件特性实现啤酒液体随角度倾斜的真实效果。文章提到早期第三方应用受限,iBeer通过视频与传感器结合的方式展示了这款手机的创新能力。

iPhone

设计师在设计工具自动化时代的角色定位

文章把 Framer 作为原型工具示例,说明用户可借此轻松完成高保真原型,避开繁琐的导出流程。它与 Principle 等软件共同构成当前易用的设计生态,降低专业门槛。Framer 的普及让设计任务自动化,驱动设计师转型为产品经理和系统架构师,专注于跨职能协作与用户需求平衡。

Framer

设计师在设计工具自动化时代的角色定位

本文将 Sketch 列为原型设计工具之一,与 Figma 等软件并列,指出用户可通过它快速完成原型制作,从而降低设计门槛。文章强调这类工具让非专业人士也能轻松创建网站、Logo 和交互原型,减少对传统 Creative Cloud 的依赖。Sketch 的出现推动设计任务自动化,促使设计师角色从执行者转向系统架构师和用户倡导者。

Sketch

Not Boring:创作者的“十万跬步”与言论收窄现象

Spotify 是本文提供的播客平台,用于收听 Not Boring 文章的音频版本。文章开头直接给出 Spotify 链接,方便读者以听觉方式获取内容。

Spotify

Badge 设计基础指南

在本文的Tooltip相关文章描述中,Popover被提及作为与Tooltip对比的UI组件选项,用于说明何时选用不同浮层提示。

Popover

2022年 Google 搜索结果页(SERP)质量评估

文中指出长期A/B测试虽可通过用户留存等指标评估搜索质量,但迭代速度慢且难以快速验证改进效果。因此作者转而采用人工评测作为更灵活的替代方案,用于快速比较Google与Bing等引擎在同一查询上的表现差异。

A/B Testing

主流界面设计工具性能特征评测

Sketch 在本文的多对象旋转测试中主要依赖 CPU,并尽可能占用全部 CPU 核心,GPU 使用率很低。无论测试投影、描边还是渐变,其性能瓶颈都在 CPU 多核处理上。文章结论是 Sketch 适合配备高性能多核 CPU 的 Mac。

Sketch

Notion 起家故事

本文中Notion的onboarding流程被描述为帮助用户从了解产品可能性转向实际操作的关键环节。它通过交互式教程和功能演示GIF,高效引导用户掌握块结构和多场景应用,从而快速提升使用价值。该流程被早期用户评价为“Fantastic onboarding flow”,直接支持了产品从个人到团队层级的价值曲线攀升,并强化了口碑传播效果。

Onboarding

东海集团旗下 Shopee 和 Free Fire 在巴西市场的策略

游戏化是 Shopee 在巴西成功的关键策略,通过转盘、虚拟宠物等小游戏提供真实奖励,吸引用户每日打开应用。这种方式将休闲游戏与实际购物结合,帮助 Shopee 在两年内成为巴西最受欢迎购物 App,并可能影响拉美其他电商平台采用类似设计。

游戏化

轻量级建站工具推荐,涵盖网站创建、静态网站生成、CMS及博客平台

文章提到 Siter 未来将支持导入 Sketch 设计稿。设计师可把 Sketch 文件直接带入 Siter 的无代码编辑环境,实现从设计到网站的一键转换。该特性针对习惯使用 Sketch 的用户,降低学习新工具的成本,同时保持设计到发布的流畅衔接。

Sketch

Figma 研究笔记:Product-Led Growth 的误区与思考

本文提到Figma 2018年客户多从Sketch迁移而来,Airbnb等标杆用户早期痛点包括Sketch在design system协作上的不足。Figma通过服务这些挑剔客户,将共同开发的成果标准化后快速扩散,加速从Sketch的替代过程。

Sketch

多邻国(Duolingo)S-1 上市招股书分析

文章简述reCAPTCHA为Luis von Ahn早期与导师Manuel Blum共同创立的项目,体现其从学术研究转向产业应用的路径。该经历帮助Duolingo融合技术与教育,支撑其内容自生成与机器学习个性化。

reCAPTCHA

多邻国(Duolingo)S-1 上市招股书分析

Duolingo每天产生23亿条追踪事件,支撑每季度500多次A/B测试,用于优化课程参与度和付费转化。通过测试,首日留存率从2012年的12%提升至40%以上,排行榜功能使平均学习时长增加近20%。这体现了其依靠数据分析而非营销实现产品驱动增长的策略。

A/B Testing

兔小巢的适老化与无障碍改造

改造完成后,团队组织7位老人和8位视障人士对优化后的兔小巢进行可用性测试。测试中发现认知障碍问题后,又针对性调整了20多处流程与文案表意,确保弱势群体能真正轻松使用。测试验证了适老化与无障碍改造的实际效果。

Usability Testing

NN/g 定量用户研究学习指南

本文在调查部分提到Jakob Nielsen的一段视频,内容围绕系统可用性量表(SUS)在UX项目中的实用性展开讨论,作为量化调查工具的参考资源之一。

Jakob Nielsen

Accessible Palette:更易用的颜色系统构建工具

本文指出 Sketch 作为主流设计工具,尚未支持 CIELAB 或 LCh 色彩空间,无法直接生成感知均匀的色阶,导致设计师难以构建一致的颜色系统。

Sketch

NN/g:设计长等待和中断的建议

用户在长等待期间离开执行其他任务后返回时,整体认知负荷会增加。文章建议通过成功对话框提供时间戳、处理详情等上下文信息,降低用户恢复工作上下文的负担。

Cognitive Load

NN/g:设计长等待和中断的建议

文章推荐对长时间后台处理后的成功提示使用模态对话框,要求用户主动关闭,以确保用户注意到任务完成情况,而非让消息自动消失。

模态弹窗

西方播客平台可向中国播客应用学习的方面

本文指出Spotify作为西方主流播客平台,缺乏让创作者直接与听众互动和变现的工具,创作者需依赖Patreon等外部服务。文章提到其2019年收购Anchor后推出付费订阅计划,但整体创新不足,主导地位使其无需改进用户体验。Spotify在中国被屏蔽,无法进入本地市场。

Spotify

NN/g:设计长等待和中断的建议

本文聚焦复杂应用设计,指出用户常因处理大数据、运行模型或查询外部信息而遭遇长时间等待,需通过 5 条指南降低中断带来的认知负担。

复杂应用设计

The Verge 总结 Epic 与 Apple 诉讼案百件内幕

苹果在文中被指通过特殊协议给予Netflix等公司15%低分成,同时执行严格的反引导和锁定期则,内部邮件显示其曾考虑调整30%佣金并打击竞争应用。

Apple

Google Gallery.io 即将关闭

本文所述 Sketch 插件随 Gallery 一起下线:11 月 16 日与 Gallery.io 进入只读模式同步停止服务,此后用户无法再通过 Sketch 插件访问或编辑 Gallery 项目。

Sketch

NN/g:设计长等待和中断的建议

文章强调允许用户在应用内创建开放式注释和备注,作为外部记忆来源,帮助记录思考过程,避免被迫依赖外部文档。

外部记忆

NN/g:设计长等待和中断的建议

文章强调在复杂应用长处理期间,系统状态可见性尤为重要,应及时反馈当前进度、已用时间及剩余步骤,避免用户因未知而焦虑。

Visibility of System Status

NN/g:设计长等待和中断的建议

本文由 Nielsen Norman Group 发布,讨论复杂应用中长时间等待与工作流中断的设计问题,并提出 5 条缓解用户挫败感的指南。

Nielsen Norman Group

NN/g:设计长等待和中断的建议

本文第5条指南指出,复杂应用中耗时流程应提供后台运行选项,避免强制用户等待。用户可继续执行其他任务或查看内容,系统则在后台完成处理。文章强调后台运行需配合醒目的完成提示(如模态对话框),以防用户因注意力分散而错过结果。该做法直接缓解工作流中断带来的挫败感,提升整体效率。

后台运行

NN/g:设计长等待和中断的建议

Kate Kaplan 为本文作者,于 2021 年 9 月 5 日在 NN/g 发表,针对复杂应用中的长等待场景给出具体设计建议。

Kate Kaplan

NN/g:设计长等待和中断的建议

文中以地理信息系统应用为例,其进度指示器同时展示完成百分比与当前步骤“Rasterizing polygon features…”,帮助用户了解处理状态。

地理信息系统

NN/g:设计长等待和中断的建议

文章指出,复杂应用中超过10秒的等待不宜仅使用循环动画,应提供百分比完成度或剩余步骤等详细进度信息,帮助用户判断是否值得等待或切换任务。

响应时间限制

NN/g 定量用户研究学习指南

本文由Nielsen Norman Group发布,是一份定量用户研究的自学指南,汇集了该机构关于量化研究、可用性测试、分析和数据可视化的文章与视频资源,按推荐顺序组织,帮助UX从业者系统学习量化方法。

Nielsen Norman Group

超链接为何默认为蓝色

文章追溯1985年Windows 1.0已出现悬停状态与下划线链接,1993年Mosaic正式确立蓝色链接后被Netscape、IE继承;作者总结现代交互设计需定义touch、hover、active、focus等状态,并确保链接点击区域足够大,以维持可用性。

Interaction Design

AirPower 原型机曝光

本文中Apple是AirPower无线充电器的开发者,该产品原计划支持同时为iPhone、Apple Watch和AirPods充电,却因技术难题于2019年3月取消。文章通过原型机展示了Apple在多线圈无线充电上的尝试,以及取消后的后续影响。

Apple

Fredrick Brennan 谈 Twitter 新字体 Chirp

本文提到iOS用户(大多数美国人)使用的苹果字体San Francisco技术复杂、阅读体验好,用户已非常习惯,该字体被视为当前阅读标杆。

Apple

关于 to-do 应用的一些思考

文中指出Trello因能移动卡片提供可见的完成痕迹而受人欢迎,能带来纸笔清单式的成就感,这是大多数数字待办应用所缺失的。

Trello

苹果关闭内部 Slack 频道

本文指出Apple内部Slack频道因讨论远程工作而被关闭,公司规定仅允许与项目直接相关的频道存在。此前这类限制执行不严,近期才开始严格执行,导致员工辩论空间被压缩。

Slack

超链接为何默认为蓝色

HyperCard是1987年Apple为Macintosh发布的程序,支持页面和应用间超链接。本文说明其链接未使用颜色,1987年彩色版仍保持黑色文字链接,仅在交互时出现蓝色强调,反映颜色在界面中的逐步应用。

HyperCard

Jonas Downey评iOS15 Safari重新设计

文章建议 Safari 可借鉴 Apple Maps 的滑动底部面板模式,在保持浮动栏优点的同时提供更多空间展示次要选项。作者认为此方案能缓解当前地址栏拥挤问题,并附上粗略 mockup 展示效果。

Apple Maps

苹果关闭内部 Slack 频道

本文中Apple正关闭内部Slack频道,以阻止员工讨论远程工作安排。面对员工对返岗政策的不满,公司此前已要求9月初起实行混合办公,后推迟至10月。部分员工因政策辞职,显示公司与员工在工作模式上的分歧加剧。

Apple

AirPower 原型机曝光

iPhone是AirPower原计划支持充电的设备之一,原型机照片显示其可为特殊原型iPhone供电,但无法与量产机兼容。文章指出,线圈需由设备唤醒,因此必须搭配定制硬件才能激活充电功能。

iPhone

Jonas Downey评iOS15 Safari重新设计

作者在自己的 iPhone 上运行 iOS 15 beta,观察到 Safari 是最显著的界面变化。文章强调单手操作场景下,底部控件虽提升可达性,但也与主屏手势和网站底部导航产生冲突。

iPhone

互联网弹窗问题

Nielsen Norman Group 在本文中发布了关于弹窗过载问题的研究文章,基于 452 名美国成年用户的调查指出弹窗仍是用户最讨厌的广告技术之一。文章通过真实用户测试和多站点案例,说明网站与浏览器同时发起的各类弹窗如何累积干扰任务,并侵蚀品牌信任。NN/g 建议设计师减少模态弹窗以改善长期用户体验。

Nielsen Norman Group

机器翻译的过去、现在和未来

本文中 reCAPTCHA 是 Luis von Ahn 开发的验证系统,用户需识别计算机无法辨认的扫描文本以证明人类身份,同时帮助提升图书数字化准确率。该项目是 von Ahn 在创办多邻国前的成果,体现了通过人类输入数据训练机器的思路,与机翻改进主题直接相关。

reCAPTCHA

Jonas Downey评iOS15 Safari重新设计

iOS Home Bar 与新版 Safari 浮动地址栏在屏幕底部紧邻,容易因误触导致意外操作。文章特别指出当网页本身也采用底部导航(如 Pitchfork)时,三层底部控件叠加,进一步加剧冲突。

iOS Home Bar

FlickType 应用因审核问题被迫下架

本文正文未出现 Apple 的任何描述或关联信息,仅通过实体列表列出。

Apple

互联网弹窗问题

Kate Moran 是本文作者,她汇总了 NN/g 的用户研究发现,描述用户在单次会话中遭遇隐私、营销和浏览器插件等多重弹窗的挫败场景。文章引用用户访谈原话,强调叠加与追踪式弹窗如何让体验极度烦人,并提出减少弹窗的具体测试方法。

Kate Moran

超链接为何默认为蓝色

本文提到Windows 1.0于1985年带来全彩图形界面,链接仍为黑色,但首次大量使用深蓝色于标题和边框。文中指出其采用下划线表示链接并引入悬停状态,这些交互特征延续至今。

Windows 1.0

苹果 CSAM 限制措施

本文中Apple于2021年12月推出多项儿童保护功能,目标是在帮助用户保持安全的同时创造赋能技术。这些功能聚焦在线环境变化下的儿童安全,强调设备端分析且不获取消息内容。Apple还通过Siri、Spotlight和Safari搜索提供额外指导资源,干预儿童剥削相关查询并指向求助途径。

Apple

互联网弹窗问题

Honey 是文中提到的浏览器优惠插件,在用户结账时会自动弹出模态弹窗。研究参与者在 Magnolia 购物时同时遇到网站弹窗与 Honey 弹窗,说明插件发起的弹窗与站点弹窗竞争,加剧了弹窗过载问题。作者提醒这类外部弹窗虽非站点可控,但会累积损害整体体验。

Honey

互联网弹窗问题

本文引用雅各布定律指出,用户大部分时间在其他网站而非你的网站上,因此其他网站弹窗带来的负面体验会直接影响他们对你网站弹窗的看法,导致普遍厌恶。文章强调这一定律解释了为何即使单个弹窗看似合理,也会因累积效应而损害用户信任。

雅各布定律

互联网弹窗问题

文章建议通过可用性测试来识别网站弹窗问题,推荐使用隐身模式浏览或进行远程可用性测试,观察用户在真实设备上遇到的模态叠加情况。测试可帮助团队统计弹窗数量、类型及竞争或跟踪现象,从而减少叠加干扰。

Usability Testing

案例研究:多邻国如何利用游戏化提升用户兴趣

以人为本设计强调关注人类动机与情感而非单纯功能需求,由 Yu-kai Chou 用于定义游戏化本质。Duolingo 通过该思路设计通知、反馈和奖励系统,让用户自愿持续学习,文章将其作为成功实践案例进行拆解。

以人为本设计

苹果推迟员工返工政策

本文中Apple因COVID-19病例回升,将原定9月起要求员工每周返办公3天的计划推迟至至少10月,并承诺至少提前一个月通知。此举使其成为首批延迟复工的美科技巨头之一。Apple坚持混合办公模式,认为面对面协作对公司文化至关重要,但面临员工要求远程灵活工作的压力。

Apple

案例研究:多邻国如何利用游戏化提升用户兴趣

本文引用Yu-kai Chou的观点,将功能导向设计定义为传统的产品设计方式,侧重功能实现而非用户动机。与游戏化的人本设计相对,它缺乏对趣味性和驱动力的挖掘,难以让用户持续投入语言学习。

功能导向设计

案例研究:多邻国如何利用游戏化提升用户兴趣

本文以Duolingo为例,展示如何通过八角分析法在产品中融入游戏化元素,提升用户动机与粘性。文章强调这种以人为本的设计能让语言学习变得更具目的感、成就感和趣味性,最终改善整体用户体验。

User Experience

案例研究:多邻国如何利用游戏化提升用户兴趣

Yu-kai Chou 是游戏化专家,创立八角行为分析法并提出“以人为本设计”理念。文章引用他关于游戏化是将游戏乐趣元素用于生产活动的定义,用该框架系统解析 Duolingo 的用户留存策略。

Yu-kai Chou

Baymard Institute:电商网站主页 UX 的8个常见陷阱与最佳实践

电商UX基准测试覆盖10900多个首页和类别元素,分析60家顶级网站的首页表现。报告显示平均表现良好,但分布分散,17%网站达到完美,部分因未持续维护而下滑。文章聚焦首页8个常见问题,提供可直接应用的改进建议。

Ecommerce UX

Baymard Institute:电商网站主页 UX 的8个常见陷阱与最佳实践

本文指出36%的电商网站在首页使用轮播图,其中75%实施不当,常因自动切换过快或控件不明显导致用户误操作。轮播适合推广功能或优惠,但需设置缓慢旋转、悬停暂停及手动控制;多数情况下静态内容区表现同样良好且更易维护。

Carousel

Baymard Institute:电商网站主页 UX 的8个常见陷阱与最佳实践

移动UX中首页作用更突出,因为类别导航不常驻可见,用户更依赖首页判断站点类型和产品范围。文章指出移动端广告和轮播问题更易导致负面体验,搜索栏需更醒目,国家和语言选择弹窗需占70%以上视口。22%网站首页搜索栏不够突出。

Mobile UX

Robinhood:高用户粘性背后的隐忧

文章将 Robinhood 的游戏化设计列为最大负面,指出其通过刮刮卡、彩屑动画制造赌场氛围,引导用户频繁交易和选择高佣金的期权产品。结合硅谷产品策略,Robinhood 最大化利用订单流和保证金利息等收入来源,而非鼓励长期持有。

游戏化