首页

iOS 15 发布后,看看这3个值得关注的设计细节!

雪涛

相比于去年 iOS 14 带来的小组件和 APP 资源库的功能,今年 iOS 15 的升级幅度似乎确实没有那么大。

接下来就从设计师的角度来看看 iOS 15 带来的视觉和体验的变化。

iOS 15 发布后,看看这3个值得关注的设计细节!

通知中心的重新设计

iOS 15 对通知中心进行了视觉排版上的优化,放大了 APP 图标并置于卡片的左侧,让用户可以通过图标更轻松的区分和查看消息。

消息小卡片的圆角也更加圆滑,圆角接近于与控制中心按钮的大小,这种圆角更大的设计也更容易将用户的视线过渡到内容中心,同时也使得 iOS 系统设计风格能够更加一致。

在通讯类 APP 的推送中,采用了联系人照片 + APP 小图标的组合形态,增加信息来源的辨识度,以这种形式更清晰地告知用户,所收到的信息的来源和属性。(目前国内的 APP 例如微信、飞书的消息通知等都还没有完全适配)

iOS 15 发布后,看看这3个值得关注的设计细节!

值得注意的是,iOS 15 还可以根据用户设置的时间来定时推送,这些定时推送会构成一个较大的通知摘要卡片,而摘要的内容会进行智能排序,这种机制将会对设计和运营有较大的影响(所以 APP 通知推送会因为这种机制形成新一轮的内卷么?)

随着营销推送的内容越来越密集,用户承受的信息压力也越来越大,苹果也在尝试构建更多细分场景下的推送管理,在 iOS 15 中用户可以选择让 APP「静音一小时」或者「今天不再推送」来避免干扰。

iOS 15 发布后,看看这3个值得关注的设计细节!

更好用的 Safari 浏览器

新版 Safari 有较大的改进,iOS 15 将顶部的地址栏和底部的工具融合到了屏幕底部,成为了一个悬浮的交互控件,并在视觉上进行了简化,右滑动地址栏可以在不同的页面中快速切换,向上轻扫地址栏,则可查看所有打开的标签页,这种在底部操作的交互方式也更符合大屏化的趋势。

这种左右滑动和向上轻滑也明显能感觉到是从 iOS 整个系统的手势操作中迁移而来,而这种手势可以极大的降低用户的学习成本。

iOS 15 发布后,看看这3个值得关注的设计细节!

在页面向下滚动时,悬浮的地址栏和工具栏会自动隐藏到底部,界面看起来沉浸感也更强。

iOS 15 发布后,看看这3个值得关注的设计细节!

这种交互方式的变化逻辑也符合交互设计中的费茨定律

费茨定律

任意一点移动到目标中心位置所需要的时间,与目标距离正相关,与目标大小负相关

iOS 15 发布后,看看这3个值得关注的设计细节!

这里举个例子来简单理解一下,手指当前的位置与按钮的距离 D 越长,所需时间越长;按钮的宽度 W 越大,所需时间越短。应用到产品设计中就是将按钮放置在离手指较近的地方,比如屏幕底部易操作区域,完成任务的时间也就会越短。

iOS 15 发布后,看看这3个值得关注的设计细节!

夸克浏览器同样是将输入框以及一些常用操作置于底部,这是因为我们正常握持手机时,大拇指离底部更近,所以需要进行点击操作的时底部的输入框操作起来更方便,也更快。

iOS 15 发布后,看看这3个值得关注的设计细节!

Safari 的这种交互方式在移动操作系统已经有了一些案例,三星的 one UI 以及安卓阵营中的众多产品也都逐渐往这种大屏化的交互逻辑发展。

iOS 15 发布后,看看这3个值得关注的设计细节!

此外,Safari 采用了新的标签栏设计,同时可以对繁杂的标签页进行整理和保存,标签组支持多设备间的无缝同步,在任一设备上的改动,都能及时同步到所有设备上。

iOS 15 发布后,看看这3个值得关注的设计细节!

卡片化的设计

在使用 iOS 15 的过程中能清晰的感知到,iOS 整很多界面卡片设计更加和谐了,我们最常用的设置页就整体卡片设计上做了区块化和圆角化的处理。要比之前系统直线分割的界面柔和许多。

这种通过使用大留白、两侧缩进的卡片设计使得界面所呈现的功能更加清晰,也更能够突显内容,同时和苹果自家产品 App Store、Apple Music 等产品的设计风格更加靠近。

iOS 15 发布后,看看这3个值得关注的设计细节!

同样天气 APP 主界面也做了布局的改动,增加了卡片化的设计,信息组织也更加直观清晰。天气 APP 头部的天气背景也进行了重新设计,动画背景更加真实,能够准确地反映出太阳的位置和降雨情况,相比之前会美观很多。天气 APP 也增加空气质量、温度、降水强度,空气质量地图等诸多功能。

iOS 15 发布后,看看这3个值得关注的设计细节!

更多新功能

除了通知、Safari 浏览器、天气、钱包、地图等常用功能的更新外,iOS 15 新版本在其他方面也做了更多功能性的升级,这里就来简单看下有哪些重要的更新。

1. Live Text

首先就是 iOS 15 中为照片带来了「实况文本」功能,在这个功能的帮助下,在相册里长按图片,就会弹出复制、查询、翻译和学习等选项,这个新功能估计也是 iOS 15 更新最实用的功能之一了~(这个功能在锤子手机的“大爆炸”中也有)

Live Text 还可以识别照片的各种元素,比如地标、动植物和花卉种类等等。配合 iPhone 自带的系统搜索——聚焦搜索(Spotlight),根据文字元素来搜索图片。

iOS 15 发布后,看看这3个值得关注的设计细节!

2. 专注模式

iOS 15 加入了「专注模式」,能助你更好地专注重要信息,由之前的「勿扰模式」升级而来,包括勿扰模式、工作模式、个人模式以及睡眠模式。每个状态可以设置不同的显示通知,并可与其他设备同步。

iOS 15 发布后,看看这3个值得关注的设计细节!

3. 大闹钟回来了

在此前的 iOS 14 中,设定闹钟的控件改为了数字输入,在随后的迭代中又改为了很小的滚轮输入,这种过小的交互空间受到了很多用户的吐槽。

iOS 15 中苹果又将闹钟设置改为 iOS 13 的大滚轮,随手上下拖动拨盘就轻松的设定好闹钟了。

iOS 15 发布后,看看这3个值得关注的设计细节!

4. 桌面小组件

不知道小伙伴有没有发现,在 iOS 14 中桌面重叠的小组件没法拖动出来,只能手动删除再重新添加。在 iOS 15 苹果就解决了这个问题,小组件现在可以从堆叠状态移出,同时可以选择智能轮换和小组件建议是否打开。

桌面还有一项大的变化就是可以整页移动了,相比 iOS 14 只能一个一个拖动 APP,整页的切换和隐藏大幅缩短了 APP 布局困难者的“编辑”时间。

iOS 15 发布后,看看这3个值得关注的设计细节!

此外,iOS 15 相机和天气的图标也进行了一些细微调整。“健康” APP 中新加入了健康趋势,其中包括静息心率、睡眠和有氧适能,持续观测健康状况的变化。FaceTime 中也增加了空间音频、人像模式、语音隔离、同播共享等功能。相册增加了 EXIF 参数显示等。

除了系统及界面以外,iOS 在 Human Interface Guidelines(界面设计指南)的内容上也有了一些更新,比如新增了包容性的设计原则,SF Symbols 3.0 图标的新增,以及新的空间交互的设计。更多关于 iOS 人机界面设计指南可参考 :https://developer.apple.com/design/human-interface-guidelines/ios/overview/themes/

iOS 15 发布后,看看这3个值得关注的设计细节!

总的来说,虽然修修补补又一年,但 iOS15 系统在细节设计以及新功能上确实提升了用户体验。

文章来源:优设 作者:姜佳欣


分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


推荐:一个iOS开发者的经验分享

蓝蓝

一个iOS开发者的经验分享

一年以前,我(曹舒旻Kevin Cao)还在做各种Flash网站,而现在却是拥有一间小工作室的iOS独立开发者。从互动广告行业转型到移动互联网,也许也是正在阅读本文的你心中的一点小念头。即便你仍然打算奋斗在互动广告行业,对移动互联网带来的冲击也不可能置身事外。

移动互联网,正在真真切切的改变我们每一个人的生活,对你我正在从事的事业,都不能例外。那么,如何顺势而为,让我们能够在新的时代背景下游刃有余呢。

首 先你应当成为移动互联网的应用达人:拥有一款移动设备,并成为重度用户。你得比你的客户或目标受众更加了解这种新的媒介。你要学会观察和分析这些移动设备 产品设计背后的精髓,包括但不局限于:用户手持设备的使用习惯;屏幕尺寸限制对设计的影响;多点触摸的操作方式;单窗口应用和多任务的设计方法等。此外还 有GPS定位,陀螺仪等特有硬件模块的玩法。

然后你还应当看看Apple的人机交互设计指南,了解那些细节到有些龟毛的设计建议背后的理念。这也保证你在发想创意的时候不至于偏差得太过离谱。

此刻你一定已经有了一个不错的想法(或者靠谱的Brief)。现在到了我们尽情发挥创意和设计才华的时刻。 流行如“下拉刷新”的操作可不是一开始就写在设计指南里的,而是由与我们一样的创作者想出来的绝妙创意。这绝对是重度用户才能发想出来的直觉式设计的最佳范例。还有Instapaper客户端的倾仰翻页,以及前段时间非常流行的Clear式轻扫和捏合操作,也都代表了交互设计的顶尖水平。 虽然在这个领域不乏一些专业的UI设计公司,还有各种互联网企业的UED正规军。但是在如何把移动应用设计得有爱或有范的问题上,我们互动这行的设计师也不甘示弱。我们看看私密照片分享应用Path 2.0中 的创新折叠菜单。吸引了不少眼球吧。而我们拿它回过头来对比闪客们N年以前就已经实现的各种动态菜单,其效果不也显得黯然失色吗。用户在iOS应用上已经 看了好几年标准界面的产物,难免开始产生审美疲劳。现在进入了重视用户体验的时代,互动从业者们在视觉表现和交互效果上的经验积累在此是一大优势。相比其 他行业的转型者们,我们更容易创作出令人惊艳的作品。

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档