自己熬夜看完了 WWDC2022 直播,又断断续续看了很多相关的文章,结论是 iOS 16 的诸多更新中唯一能吸引我升级测试版系统的特性似乎只有「个性化锁屏」,忍不住更新了 iOS 16 后,折腾完个性化锁屏,习惯性打开《Books》(即《图书》app)准备看书时,整个人都懵了:

这次《Books》更新的幅度远超预期

不同于「个性化锁屏」将 Apple Watch 表盘上的那套设计「本土化」到 iPhone 锁屏上的操作,《Books》的更新则是重新设计了一整套全新的交互逻辑。甚至嚣张点可以说给其他阅读类产品指明了未来几年的优化方向。除了在去年更新中出现过的翻页动画和下沉式的交互逻辑外(下文会详细介绍),其他几乎所有的改变都是首次出现在 Apple 的操作系统中。

最近在阅读产品和交互设计类的书籍,恰巧这次升级引发了自己对《Books》这款产品的思考,很多书中学到的知识得到了印证。于是想借着这次机会,用打造一款产品的视角来探索这次更新的内在逻辑。希望通过分享自己思考的过程,能给大家带来点不一样的灵感。

太长不看,本次更新的要点

  • 阅读界面中,多了两枚无法隐藏的按钮,分别是关闭和多功能按钮
  • 将原先的目录、样式、搜索、添加书签等按钮集成到了多功能按钮中
  • 用滑动翻页动画替换了仿真翻页动画
  • 用双击文字区域替换了单机屏幕右上角添加书签的交互方式
  • 新增全屏下滑关闭正在阅读书籍的交互方式
  • 将目录单独分离为一个按钮,并且和原先的阅读进度条进行了融合
  • 新增样式主题功能,可以对六种主题进行单独的文本和布局自定义
从左到右依次为上文提到的新特性截图

熟悉又陌生的界面

这次升级主要聚焦在阅读书籍的界面,让我们一览升级前后相同界面下的不同点。
变化主要集中在截图中的上下部分,左侧为新版,右侧为旧版。

专注阅读时的界面

在新版的系统中,界面上始终且只存在两个顶层按钮,一个是关闭按钮,另一个是多功能按钮。而旧版的软件中,只有点击屏幕中央区域呼出菜单栏后,才会在屏幕上显示其他几个按钮。
个人而言,我更喜欢旧版系统专注阅读时的界面,因为整个屏幕上没有多余的元素吸引自己的注意力,整个屏幕上只有文字,看起来更加简洁明了。而新版始终有两个按钮固定在屏幕的俩角落上,有点影响原先整齐极简,没有干扰的阅读体验。

呼出菜单栏的界面

单击文字区域呼出菜单栏后,可以发现旧版中顶部一共有五个按钮,加上底部的一个进度条,一共是六个元素。而新版还是只有两个元素:关闭和多功能按钮,一个多功能按钮整合了旧版中的五个按钮。

左侧为新版,右侧为旧版

新版图书选中文本后,上方浮动弹窗的样式进行了重新设计,可以明显感受到和《Books》阅读界面的整体设计风格更加匹配。还有高亮笔记的样式也进行了一定的优化,高亮块四周新增了轻微的圆角,看起来更加有质感,颜色也做了一定的调整。

单纯从「呼出菜单栏的界面」角度来看,新版《Books》确实在界面上感觉更加简洁。新版中的两个顶层按钮无法隐藏一开始确实让我特别费解,为什么苹果不能在「专注阅读时的界面」中隐藏这两个按钮?

想要回答这个问题,还需要我们进一步深入了解这次更新的其他细节,这里先按下不表。
紧接着让我们看看基于以上界面的改变下,具体的交互逻辑发生了哪些变化。

交互逻辑的变化

下沉式交互逻辑

整体按钮交互下沉

从上面这张图中可以发现,在新版的界面中,所有功能的交互都集中在屏幕的下半部分,正常握持设备的姿势下,单手可用大拇指完成一些简单的操作。目前手机屏幕越做越大,我们的手指越来越难够到屏幕顶部的区域,而这一整体交互逻辑的下沉就非常巧妙地解决了这个问题。

双击添加或删除书签

点赞逻辑从单击右上角变为双击屏幕

当自己看到原本右上角书签的位置被关闭键占据时,接着点开下方的多功能按钮后看到了书签的按钮,心理已经开始忍不住吐槽这次更新了。因为原先添加书签的操作只需单击屏幕右上角,而现在得先点开多功能按钮,接着再添加书签,硬生生增加了一步操作,但随后的事实证明, Apple 的交互设计师给我好好上了一课。

一次偶然间双击屏幕的操作,才让我知道在新版《Books》中直接双击屏幕的文字区域就能添加书签。这个交互逻辑似乎更加符合我们被各种平台训练出的双击屏幕点赞的习惯,而且在单手操作大屏设备的使用场景时,新版的双击添加书签操作可比原先的操作优雅太多了。

关闭书籍的交互优化

全屏下滑关闭图书

在旧版本中,想要关闭当前正在阅读的书籍,只能先单击文字区域呼出菜单栏,接着点击左上角的返回键关闭图书。经常用 iPhone 的人可能知道,在 iOS 的很多场景下,只要左上角有返回的标志,手指从屏幕左侧边缘向屏幕内滑动也能触发返回的操作,但是惯用的逻辑在旧版图书里就不管用了,当我们看到返回按钮,条件反射下滑动屏幕左侧,发现仅仅是将页面往回翻了一页而已。这会对用户造成一定程度上的认知困扰,因为贯穿整个系统大部分场景下的交互逻辑在这里突然就不适用了。

而新版图书就解决了这个困惑。将原本代表着一套交互逻辑的返回按钮更改为一个经典的关闭按钮,而且位置也移动到了右边。而且得益于这个顶层按钮始终存在于页面上,想要关闭的时候不需要像旧版系统一样的需要先呼出返回按钮,

苹果总能在一些小细节上给你惊喜,但是也能在一些小细节上让人难受的不行。

在使用的过程中,又是不小心触发了屏幕下拉的手势,结果整个软件界面会跟随手指的移动,当我下拉到一定程度时松开手指时,神奇般地完成了关闭图书的操作。又一次被苹果上了一课。当我使用 iPhone 13 mini 的时候还没有感受到这个新交互升级的便利,但是将目光转移到手边的 iPad mini 上时,思绪豁然开朗——单手握持 iPad 的时候,也能优雅地关闭当前阅读的图书了。

目录与进度条模块的融合

左侧为长按新版中目录按钮时激活的快速转跳功能

点开下方的多功能按钮后,可以发现最上面的目录按钮其实也是一个进度条。这个小设计个人感觉非常有趣,一个元素同时包含了两种交互模式:单击的时候打开的是目录界面,手指按住这个按钮并且左右拖动时又激活了进度条功能,可以快速的通过章节进行转跳。

新增的功能

虽然这次《Books》在界面和交互方面的升级已经足够超出我的预期了,不过 Apple 这次给的有点多,除此之外还新增了几个贴心的功能,让我更加感受到了 Apple 在细节方面的执着。

Books 也支持主题了

样式主题

原先的《Books》阅读样式只支持对文本字体,文本大小和背景颜色做简单的调整,而新版本中引入了「主题」功能。简单来说就是《Books》提供了六种不同质感的主题,每个主题可以单独设置文本字体,文字大小,是否粗体显示,不过无法修改背景色。

每个主题内的自定义设置

每个主题现在也支持单独对布局进行修改,开启自定义选项后,可以对行间距,字符间距,词间距进行微调,也可以选择是否两端对齐或者是否允许多栏。

这项更新就满足了我在不同阅读内容和场景下,想来回更改阅读样式的需求。现在只需提前确定对应的主题,修改成自己想要的样式,以后遇到对应的使用场景只需快速切换不同的主题即可。

新增的竖排锁定功能

注意右下角的图标

这里再一次被苹果的细节给震撼到,当在控制中心里开启屏幕「竖排方向锁定」后,新版《Books》中添加的「竖排锁定」功能似乎没什么作用。但是当关闭系统层面的竖排锁定,在图书阅读界面下转动屏幕,我们可以体会到 Apple 满满的细节。

这时候屏幕下方会出现一个锁定的图标,细节之处是这个图标的方向会随着手机屏幕的转动而旋转,这还不算完,当保持固定的屏幕方向一段时间后,这个小图标会消失,当再次转动屏幕方向时,这个图标又会出现。而且可以直接点击这个图标进行锁定/解锁「竖排旋转」的操作。这里又被苹果上了一课:再小的细节都不能放过,同时也应证了这句话:

成功的用户体验,就是能事先预知用户的期望并将其纳入设计之中。

—— 《用户体验要素:以用户为中心的产品》

这项新功能在一定程度上减少了来回去控制中心操作屏幕锁定按钮的频次,仔细思考后发现,这个功能满足了使用其他软件需要解除竖排锁定,但使用图书App的时候又希望能够保持竖屏阅读体验的场景。但还有一点疑惑就是,为什么 iPad 上没有这项功能,初步猜测是因为 iPad 横竖屏阅读的场景都比较常用,而在 iPhone 上横屏阅读的体验不是特别友好,所以「竖屏锁定」功能是 iPhone 独占功能。

更加智能的深色模式

更加智能的深色模式

旧版中只能通过将背景颜色改成暗色来启用深色模式,而新版中每个主题都有单独的深色模式,而且对何时开启深色模式提供了更加智能的选项,可以手动选择是否开启深色模式,和匹配系统的深色模式,或者根据周边环境来由系统智能决定是否开启深色模式。

第一方小组件阵营里的新成员

《Books》的小组件

iOS 16 中,Apple 终于开发了《Books》的小组件,支持查看阅读中的书籍和每日阅读目标,而且点击想要继续阅读的书后,打开软件会自动切换到选中的那本书。能够在主屏幕上替换 app 图标的小组件又多了一个。

总结

先回答一下文章中提出的问题:为什么苹果不能在「专注阅读时的界面」中隐藏删除按钮和多功能按钮?

经过不断对比和思考这次《Books》的更新后发现,有很多操作在新版本中的操作路径变短了,不过找不到任何一个路径由于更新后反而变长的操作。如果我们假设单击屏幕文字部分能够现实和隐藏这两个按钮,那么当我们在阅读文章时,想要进行的很多操作都会比更新前多一个唤出这两个按钮步骤。当我看透这一层的时候不得不感慨 Apple 在这个系统自带软件上所花的心思。Apple 在保持界面简洁和简化操作路径两个选择中,选择妥协一部分桌面的简洁程度以换取更加简短的操作路径,在我目前自己体验过十几个小时后再回来看这个决策,顿时学到了很多。

产品决策在一定程度上是一个通过妥协达到某种平衡的过程。

深入思考这次《Books》更新的一个个细节后,难免会产生一个疑问:Apple 这么做的目的是什么?为了回答这个问题,结合最近的阅读所得和使用软件的深度思考,姑且得出了这个宽泛的结论:苹果更新系统的目的是为了满足用户「更好用」的需求。

首先到「范围层」,Books 新增了「样式主题」「竖排锁定」「智能深色模式」等新功能,让软件能够覆盖更多用户的使用场景。

接着具象到「结构层」,图书更新后重新设计了各项功能之间的层级关系,将原本顶层的几个功能集合到同一个多功能按钮下,优化了产品的使用逻辑,让用户能够更加清晰地找到想要的功能。

接着具象到「框架层」,各种下沉式的交互升级,以及双击添加书签和下划屏幕快速关闭的交互方式,巧妙地解决了大屏幕下单手不方便操作手机上半部份区域的痛点,让用户一只手也能从容完成对应操作。

最后回到「表现层」,结合上面所有层级的更新,我们能够感受到的是一款极简中处处透露着优雅的阅读软件。这款软件它没有社交功能,甚至在国内没有书库功能,要看的书还得自己去找,单纯的是一个图书阅读软件,是我平时使用时间最长的一款软件。

交互设计的发展趋势

即将写完这篇文章时冷静下来细细品味时,纵观 iOS 近两年的更新细节发现,似乎上文提到的下沉式的交互设计在 iOS 的很多角落都能发现它的影子,我猜测这或许是未来UI交互设计的一个趋势吧。

媒体控件下沉,通知列表下沉,地址栏下沉,搜索框下沉

题外话:如何批量导出阅读过程中高亮标注的笔记?

在没有更新 iOS 16 之前,我们可以通过 iPad 版的图书 app 中全选所有的笔记,然后通过邮件一次性发送给自己,实现批量导出功能。

但是更新后已经彻底关闭了这条通道,不过天无绝人之路,在网上找到了一款软件支持在mac端导出《Books》中的笔记 —— Klib。免费版只支持前十本书的笔记管理,似乎只要看一本书导出一次笔记,免费版也能满足我们的需求,还顺带解决了自己看书拖延的问题。

> 下载 少数派 2.0 客户端、关注 少数派公众号,解锁全新阅读体验 📰 

> 实用、好用的 正版软件,少数派为你呈现 🚀