提升 iPad App 设计

嗨 我叫 Rene Lee 我是 Apple 设计团队的一名设计师 今天 很高兴能和大家分享 iPad 即将推出的新功能 如何帮助你提升 App 的设计水平 iPad 的核心在于简约 而 iPadOS 26 正是基于 这一坚实基础打造而成 只需一个新手势 就能丝滑调整窗口 尺寸 让多任务处理变得轻松自如

工具栏新增了窗口控件 放大即可清晰显示它的功能

新版指针操控更精准 响应更迅捷 最后 全新的菜单栏可自由定制 你可以在其中添加所有能让 App 独具特色且功能强大的控件

凭借这些新功能 你就拥有了所需的一切构建块 最终让你的 iPad App 实现全面升级 在本次讲座中 我将带你逐步深入探索 首先从 App 的导航开始 接着 我们将探讨 iPad 多任务处理中的窗口操作逻辑 然后我将介绍 iPad 的全新指针设计 和指针悬停效果的升级

最后 我们将以 iPad 的全新菜单栏 作为本次讲座的收官环节 首先从导航功能开始 要优化 iPad App 首先要选择合适的导航模式 第一个选择是侧边栏导航模式 侧边栏特别适合需要管理大量子视图 或邮件等深层嵌套内容的 App

让我们深入解析邮件中侧边栏的设计 邮件应用通过侧边栏集中展示 所有邮箱和多账户列表 将内容层级结构直接呈现于顶层界面 iPad 版邮件应用之所以速度更快 得益于它的侧边栏的平级导航设计 我们来看另一个例子：音乐 与邮箱不同 音乐 App 采用标签页、 媒体库和播放列表的组合式导航结构 因此 在音乐应用中 这些核心模块都整合在侧边栏内 实现了极速导航体验

音乐应用的侧边栏还包含一个 类似标签页栏的按钮 轻点它 侧边栏会流畅地变形为 一个标签页栏！

标签页栏是一种更紧凑 更灵活的导航模式 因为它比侧边栏占用空间小得多 现在 你的 App 可以呈现更多内容 带来更具沉浸感的体验 将标签页栏切换回侧边栏 同样流畅自如 这种灵活的设计让用户能自由选择 偏好的导航方式

如果仍不确定哪种导航模式最适合 你的 App 建议从标签页栏入手

标签页栏可轻松变形为侧边栏 随 App 的发展灵活扩展 接下来 我们具体分析每种导航模式 在小屏设备上的适配表现 当 iPad 转为竖屏模式时 侧边栏会 通过变形切换回标签页栏进行响应 但从界面布局的角度来看 设备方向变化本质上意味着 App 需要适配宽度的改变 当导航具备自适应特性时 你的 App 就能灵活适配任意屏幕宽度

你也可以将这种自适应特性 扩展至浮动窗口 因为浮动窗口 同样会导致显示宽度缩小 采用标签页栏设计 你的 App 就能优雅适配所有屏幕尺寸

不使用标签页栏的 App 同样能 通过纵向折叠导航栏 来适配不同布局

在进行尺寸适配时 必须确保所有布局调整 都是非破坏性的 App 窗口尺寸调整 不应永久改变它的布局结构 在可能的情况下 应伺机恢复至初始状态

接下来 围绕导航扩展你的内容

用户使用你的 App 是为了获取内容 因此 请充分利用屏幕空间 打造最具沉浸感的体验 你可以使用新的“滚动边缘效果” 在工具栏下方绘制内容 来实现这一优化 扩展内容对于 比全屏 App 更小的浮动窗口 尤为有益

你还可以将内容延伸至侧边栏下方 当内容以这种方式延伸超出边界时 你甚至可以通过滚动幅度 来判断具体哪一行发生了滚动 总结一下导航设计的原则 选择最契合内容需求的导航方式

建议优先考虑采用标签页栏设计 针对小尺寸屏幕优化导航设计

围绕导航扩展内容

接下来 我们将探讨窗口设计规范 iPadOS 26 中新增了窗口管理系统 看似简约 但功能很强大！ 所有支持多任务处理的 App 现在都会在右下角 显示一个操作手柄

拖动这个手柄即可将 App 调整为悬浮于壁纸之上的浮动窗口

每个窗口的左上角 都设置有全新的窗口控件 轻点即可放大控件 直观展现各项功能 长按控件会进一步展开 显示可快速创建多种窗口布局的 快捷操作面板 窗口控件集成了丰富功能 是 iPad 多任务处理的核心操作元素 我们来深入了解一下 这些控件在每个窗口中的呈现方式 窗口控件将显示在工具栏的前缘位置 现有控件会自动右移腾出空间 避免遮挡

对于尚未更新 以适配 iPadOS 26 的 App 系统将自动扩展 工具栏上方的安全区域 并将窗口控件置于前缘位置

请注意 这种工具栏上方的控件布局 仅为兼容性考虑而设

由于这种布局会在工具栏正上方 形成永久性安全区域 采用这个方案将不利于 实现 App 内容区域的最大化 更优方案是 将工具栏环绕窗口控件布局 使二者保持视觉对齐 当你将工具栏环绕窗口控件布局时 即可避免预留安全区域

如此一来 无需扩大窗口尺寸 即可利用节省的空间显示更多内容

接下来 你的 App 在处理新文档打开方式时 需注意一个重要调整 当你打开文档时 文档默认 App 会在上方启动 并在相应窗口中打开文档 可以肯定的是 在 App 被隐藏或故意关闭之前 App 的当前状态 是有价值的 但若需同时打开第二份文档 系统将如何处理？

在进行多任务处理的工作流程之前 如果某个 App 被要求 打开另一个文档 系统会在 App 的唯一窗口中 打开这个文件 并在这个过程中 清除所有先前的上下文内容 对于支持多任务处理的 App 这种“就地打开”的操作模式 已不再被推荐采用 今后 你的 App 应当 为每份文档创建独立窗口 当启用多任务处理时 App 应当为每份文档 分配独立窗口打开 叠加式操作模式更具实用性 因为 所有窗口都将持续保留 直至被关闭 但这是否会导致窗口大量堆积 从而增加查找目标窗口的难度？ 采用这种新的叠加式窗口操作模式后 确实会随时间推移 逐渐积累大量窗口

为方便定位目标窗口 App 菜单中新增了 所有已打开窗口的列表专区 但若窗口名称不具有描述性 这个列表就没多大帮助了 因此 请务必为 App 的窗口 设置描述性名称

请为每个窗口设置唯一字符串 例如采用文档标题作为窗口名称 如果你的 App 能为每个窗口 提供描述性名称 查找特定窗口就会容易得多

本节要点总结：请采用工具栏 环绕窗口控件的布局方案

为每份文档创建独立窗口 最后 请为 App 窗口 设置描述性名称 接下来 我们来看看 iPad 的指针 将会有哪些变化

iPad 的一切设计都以触控为核心 因此 最初的指针被设计为圆形 以便在尺寸和精准度上 都能最接近手指的触控体验 但事实上 指针的精准度 远超手指触控的精准度 因此在 iPadOS 26 中 指针采用全新 形状 彻底释放它的精准操控潜力 新的指针操作起来感觉更加精准灵敏 因为它始终与你的输入 保持 1:1 的实时同步 除了采用全新形状外 指针悬停在按钮和控件上方时的 交互反馈也经过了重新设计 全新的高亮效果 呈现为一种液态玻璃面板形态 当指针悬停时 会直接在按钮上方实时浮现

悬浮于液态玻璃控件上方的高亮效果 通过弯曲和折射底层元素 来清晰标示当前选中的按钮 当指针悬停在 具有多个按钮的液态玻璃控件上时 高亮效果会立即显现 精准标示你即将点选的按钮

当你在按钮组间移动时 高亮效果会实时追踪指针位置 在目标切换的瞬间立即响应 全新高亮效果取代了原先的悬停效果 即指针直接变形为 高亮区域的交互模式

全新指针将不再吸附 或弹性贴合任何目标元素 而是始终与你的输入保持精准同步

请务必使用全新指针测试你的 App 以检测可能出现的异常交互效果 请随时返回本节查阅参考和指导 逐步优化和完善指针交互设计 最后 我们来看一下 iPad 上的菜单栏设计 菜单栏一直是 macOS 的核心组件 它的设计理念 与 iPad 版菜单栏一脉相承 因此 本节将重点解析 iPad 菜单栏的独到之处 在 iPad 上 你可以通过 将指针移至屏幕顶部边缘 或用手指向下轻扫来唤出菜单栏 每个菜单栏都包含 App 菜单、 系统提供的默认菜单 以及 App 提供的自定义菜单 今后 iPad 上的所有 App 都将配备专属菜单栏 那么 我们先来了解一下 设计优质菜单栏的实用技巧 首先要整理菜单项

下面将详细说明 自定义菜单的配置步骤 以“邮件”应用中的 “信息”菜单为例 首先 你需要将与菜单名称相关的 所有选项填充其中 应根据使用频率 而非字母顺序来排列这些选项 此外 应将相关操作项 分组到各自的独立模块中 以强化视觉区隔 若菜单过长 可将次要选项移至子菜单中 接下来 为每个菜单项分配符号 最好与它们在 App 中显示的 样式保持一致 最后 请为最常用的选项 配置键盘快捷指令 最终呈现的是一个结构清晰的自定义 菜单 它不仅包含各项独立指令 更能为用户构建可内化的心理地图 从而提升对 App 的理解 接下来 填充“查看”菜单

系统默认提供的菜单中 包含“查看”菜单 但具体需由你的 App 为它配置实用操作项 如果你的 App 采用标签页布局 强烈建议将它纳入“查看”菜单

请将标签页添加为“查看”菜单中的 选项 并为它分配键盘快捷指令 以加速 App 中的标签页切换

现在 你已成功配置了一个 功能完备的“查看”菜单！ 另一个实用的操作项是导航切换功能 任何用于显示或隐藏侧边栏的按钮 都是对“查看”菜单的绝佳补充 添加侧边栏切换控件 可让用户快速显示或隐藏导航界面

接下来需要谨记一点 绝不可根据 App 的上下文 隐藏任何菜单或选项 当用户使用你的 App 时 使用场景始终在变 因此当用户打开菜单时 部分选项会显示为灰色不可用状态 表示当前无法执行相关操作 这种设计是经过深思熟虑的 菜单项必须始终保持位置固定 即使处于非活跃状态时也不例外 这些菜单项在可操作时 呈现完全不透明状态 而在不可用时显示为灰色禁用状态 你可能会疑惑 为何不直接隐藏 非活跃操作项 以节省界面空间？

不建议隐藏菜单项 因为这会让用户感到困惑 当菜单内容频繁变动时 用户每次打开 都需重新浏览整个菜单 因为他们无法再依赖 空间记忆进行定位 务必保持菜单内容固定不变 这既能确保菜单栏的操作可预期性 也能帮助用户在每次访问时 发现新功能 最后说一下 根据具体使用场景 菜单内的所有选项都可能无法操作

即便遇到这种情况 也要避免整体隐藏菜单栏 当整个菜单间歇性消失时 操作可预测性将完全丧失

务必保持菜单栏和其中内容持久稳定 确保用户始终获得 符合预期的操作体验

让我们回顾一下菜单栏的设计要点： 首先需要合理组织菜单项 在“查看”菜单中配置 标签页与侧边栏切换功能 严禁隐藏任何菜单及菜单项 请在设计 App 菜单栏时 严格遵守这些准则 以打造最佳用户体验！ 现在已讲完 我今天为你们准备的所有内容 我仔细讲了流畅的导航 和叠加式多任务处理如何 让你的 iPad App 比以往更强大 我还介绍了全新指针 如何实现精准操控 以及菜单栏 如何帮助整理 App 操作项 让各项操作一目了然 如果你想进一步了解 这一全新的设计系统 建议你观看这些相关讲座

当你将这些构建块融入到 App 中时 它们产生的整体价值 必将超越各部分的简单叠加 我深信 你将充分运用今日所学 真正革新 并提升你的 iPad App 体验 谢谢观看！