同样是刘海屏,为啥iPhone X的更顺眼?

2018 年 5 月 29 日 威锋网

在苹果的产品上,我们总能看到各种美妙的曲线。

当苹果第一次让刘海屏出现在 iPhone X 上时,几乎没有人愿意说这是一个好看的设计。但是时间来到现在,当越来越多的安卓手机开始加入刘海屏阵营的时候,我们也看到了各式各样的刘海,然后才发现,其实 iPhone X 的缺口设计竟然是看起来最顺眼的了!?

为了解答大家的这个疑问,设计师 Brad Ellis 在博客上发表了一篇文章,详细解释了苹果在 iPhone X 缺口设计上的特别之处。首先我们需要来看看实现 Notch 屏幕(刘海、缺口屏)都有哪些方式,上图和下图的这些 Notch 屏要说制造难度、成本和 iPhone X 的屏幕其实没什么区别,都是需要按照须先设定好的形状切割而已,但是效果确是差了不少。

Ellis 表示,苹果在设计过程中并没有遵循常见的圆角矩形的曲线,也就是在一段直线之后直接接入一个正圆的圆形,而是用上了一个名为“方圆形”的曲线,它的坡度一开始更“陡”,而后来变得越来越柔和。下方的两张图能够清晰地解释两种设计方法的不同,简单来说,苹果这里用上了曲率连续的方法。

虽然很多人把苹果的设计风格成为“圆角矩形”,但是 Ellis 表示,其实苹果多年来一直在 MacBook、iMac 电脑和 iOS 7 以后的系统中使用曲率连续这一招数,并且这一形状其实比较难实现,因为它过去在 CAD 这样的 2D 编辑器中并不可用。

更加直接地为大家展示 iPhone X 的“刘海”,Ellis 又举了个例子。当我们需要将上下两条平行直线通过两个圆弧连接起来时,按理来说总会有那么一下圆弧的切线会垂直于两条平行直线的,对吧?但是苹果的设计中,你却发现这些切线竟然都不是垂直的!

对于苹果在刘海设计上的独具匠心,Ellis 表示这些决定看起来很小,但是在很多公司中,即使设计师愿意花些心思设计出一条美妙的曲线,公司也不一定会投入资源去让它变为实际产品。未来苹果肯定会不断改变 iPhone 刘海的曲线,直到完全实现100%的屏占比,而这其中的变化将很有趣。

当然,Ellis 也表示,需要提醒各位设计师朋友们,在开发 iOS 产品的时候,一定要用苹果官方的设计资源,你不知道他们在哪个地方突然给你来了一条充满奇思妙想的曲线。

今日壁纸

往期 精彩回顾

苹果贵州数据中心已于本周奠基 2020年完工

苹果在为MacBook研发铰链转轴 跟随微软?

欧洲上线史上最严隐私条例 革了不少中国企业的命

WWDC18之前买这些苹果产品要三思

登录查看更多
0

相关内容

iPhone 由苹果公司(Apple, Inc.)首席执行官史蒂夫·乔布斯在 2007 年 1 月 9 日举行的 Macworld 宣布推出,2007 年 6 月 29 日在美国上市,将创新的移动电话、可触摸宽屏 iPod 以及具有桌面级电子邮件、网页浏览、搜索和地图功能的突破性因特网通信设备这三种产品完美地融。
一份简明有趣的Python学习教程,42页pdf
专知会员服务
77+阅读 · 2020年6月22日
3D目标检测进展综述
专知会员服务
193+阅读 · 2020年4月24日
Python数据分析:过去、现在和未来,52页ppt
专知会员服务
101+阅读 · 2020年3月9日
谷歌机器学习速成课程中文版pdf
专知会员服务
146+阅读 · 2019年12月4日
【机器学习课程】Google机器学习速成课程
专知会员服务
165+阅读 · 2019年12月2日
可解释推荐:综述与新视角
专知会员服务
113+阅读 · 2019年10月13日
强化学习最新教程,17页pdf
专知会员服务
177+阅读 · 2019年10月11日
已删除
架构文摘
3+阅读 · 2019年4月17日
原来CNN是这样提取图像特征的。。。
计算机视觉life
8+阅读 · 2018年11月23日
10行代码实现目标检测,请收下这份教程
极市平台
4+阅读 · 2018年6月27日
一份数据科学家必备的技能清单(附资源)
THU数据派
7+阅读 · 2018年5月29日
无人零售的正确打开方式,到底是什么?
黑智
3+阅读 · 2018年1月22日
【原理】学懂GAN的数学原理,让它不再神秘
GAN生成式对抗网络
3+阅读 · 2017年11月26日
AI都干过什么让人细思极恐的事?
全球创新论坛
4+阅读 · 2017年9月15日
Knowledge Based Machine Reading Comprehension
Arxiv
4+阅读 · 2018年9月12日
Arxiv
3+阅读 · 2018年3月29日
Arxiv
6+阅读 · 2018年2月7日
Arxiv
7+阅读 · 2018年1月31日
VIP会员
相关VIP内容
一份简明有趣的Python学习教程,42页pdf
专知会员服务
77+阅读 · 2020年6月22日
3D目标检测进展综述
专知会员服务
193+阅读 · 2020年4月24日
Python数据分析:过去、现在和未来,52页ppt
专知会员服务
101+阅读 · 2020年3月9日
谷歌机器学习速成课程中文版pdf
专知会员服务
146+阅读 · 2019年12月4日
【机器学习课程】Google机器学习速成课程
专知会员服务
165+阅读 · 2019年12月2日
可解释推荐:综述与新视角
专知会员服务
113+阅读 · 2019年10月13日
强化学习最新教程,17页pdf
专知会员服务
177+阅读 · 2019年10月11日
相关资讯
已删除
架构文摘
3+阅读 · 2019年4月17日
原来CNN是这样提取图像特征的。。。
计算机视觉life
8+阅读 · 2018年11月23日
10行代码实现目标检测,请收下这份教程
极市平台
4+阅读 · 2018年6月27日
一份数据科学家必备的技能清单(附资源)
THU数据派
7+阅读 · 2018年5月29日
无人零售的正确打开方式,到底是什么?
黑智
3+阅读 · 2018年1月22日
【原理】学懂GAN的数学原理,让它不再神秘
GAN生成式对抗网络
3+阅读 · 2017年11月26日
AI都干过什么让人细思极恐的事?
全球创新论坛
4+阅读 · 2017年9月15日
Top
微信扫码咨询专知VIP会员