「信迪诊断」完成近6亿元B轮融资
06-18
iPhone 12 Pro Max真的很难买。
前段时间iPhone 12 Pro Max发布的时候，有朋友向我抱怨，为了尽快拿到手机，他想通过线下门店去取，于是刷新就成了日常时不时会到苹果官网查询库存状况。
浏览了很多官方网站后，他也发现了很多有趣的现象。
苹果官网的产品详情页，滑动时往往会有明显的交互效果。
比如iPhone，网页中的文字、图形等都会通过滑动进行交互。
种类。
▲ 注意侧面的网页滚动条。
网页中的手机、文字、甚至图形都仿佛“活了过来”，非常有趣。
我没有抢手机，但是浏览网页（钓鱼）玩得很开心。
越滑，就越有趣。
刚才提到的网页交互方式，在设计领域其实被称为“视差滚动”。
它涉及到相当复杂的网页技术，但确实是最容易让人感知的地方。
用鼠标或手指上下滑动，网页上的内容就会发生相应的变化。
以苹果官网iPhone 12 Pro产品介绍页面为例。
整个网页的背景颜色为黑色。
随着鼠标或手指向下滑动，iPhone和文字会依次慢慢浮现，动画极其流畅。
在介绍iPhone 12 Pro中框的材质时，网页动画就像人工照明一样。
从上到下的明暗变化，文字也浮现出来，以视觉的形式展现了不锈钢材质，同时也使得人们可以更直观地观察手机的颜色和中框。
说到影像系统，iPhone 12 Pro这次的焦点，黑白和色彩的变化通过视觉滚动的方式展现到了极致。
在人像夜拍片段中，随着滑动操作，副本也向上滑动，高清夜拍图像在黑色背景中慢慢出现，仿佛真的拍了一张夜拍。
当然，这张高品质的夜间人像图像也为视觉表现加分不少??。
在AirPods Pro的产品介绍页面中，交互动画被提升到了一个新的水平。
它的产品介绍中其实有一个比较特别的互动。
为了强调 AirPods Pro 的贴合度，苹果特地添加了佩戴 AirPods Pro 的人摇头的动画。
即使如此大的摆动，AirPods Pro也不会掉落，这非常直观地体现了AirPods Pro的佩戴稳定性。
对了，下滑的时候动画会直接完成交互动作。
如果中途暂停并向上滑动，动画可以返回到之前的状态。
它看起来有点“幽灵”，浏览网页变得很有趣。
起床了。
▲ 快速上下滑动，场景变得“鬼魅”。
AirPods Pro介绍页面上还有很多类似的动画。
与传统网页展示内容相比，在视差滚动、互动动画以及相应图片和文案的支持下，增强了图像的美感和层次感，观看体验得到了极大的提升。
在iPhone 12 Pro产品介绍中，随着用户滑动，相应的内容会依次出现。
黑色背景和文字颜色的差异凸显了信息的层次，让用户不自觉地看起来更加清晰。
内容以控制用户的注意力。
▲不同颜色和字体大小的文字，向上滑动可以返回之前的动画状态，让人仔细观察产品的每一个细节。
比如AirPods Pro有多大、人的实际佩戴尺寸、不同侧面的内容等都可以通过视差滚动来体现。
同时，滑动反馈的参与感也能促进用户的沉浸感，提高阅读率。
与变化较少的图片和文字相比，具有明显的优势。
当然，这期间也有导致碎片化时代持续阅读越来越困难的原因，尤其是用户了解抽象复杂的产品功能和技术。
这也是视差滚动及相关交互动画技术的另一个优势。
就像刚才提到的佩戴AirPods Pro的人摇头的互动动画案例，人们很容易理解佩戴稳定性这个极其抽象的功能。
在苹果众多技术、动画、高清图片、文案的支持下，用户会发现越浏览越有趣。
为了让你的观看体验更加愉快，苹果付出了很多努力。
视差滚动只是苹果官网上使用的技术的一小部分。
自从2008年乔布斯回归苹果以来，作为一个非常重视设计的领导者，他自然也会关注当时公司的政策。
品牌展示出口——官网 非常关注苹果官网。
从2010年到现在，苹果官网发生了翻天覆地的变化。
从中我们也可以看到苹果设计的转变和传承，以及它如何让人们更加享受。
对比过去三年苹果官网，我们可以发现很多设计上的变化。
首先是布局。
2009年的苹果官网依然和大多数网页一样，内容排列比较密集。
到了2009年，也就是乔布斯回归后的第二年，页面开始注重布局的密度。
以产品为主、文案为辅的设计风格已经显露出来，两侧的排列大多是相对对称的。
有序也符合人们的阅读习惯。
人是视觉动物，图片永远比文字更有吸引力。
尤其是在展示消费电子产品时，人们普遍先关注图片，后关注文字。
大标题文案与产品高清图片的美感对称，阅读起来更加舒适。
到了2020年，文案与产品的配合已经越来越成熟。
标题文字与产品不仅与页面布局相对应，文案的想象空间也越来越大，越来越符合产品的定位。
。
是的，著名的iPod产品文案《把一千首歌放进你的口袋里》也在这个时候出现了。
时至今日，苹果仍然延续着这一设计规则。
在iPad Pro产品页面上，iPad Pro显示屏的斜角实际上与文案堆叠排列的倾斜度对称，还有一句“为什么你的下一台电脑应该是？” “电脑”甚至受到了广大网友的好评，甚至被引申为很多“表情包”。
▲ 文案和 iPad Pro 都比较年轻，是变化的一年。
随着iOS 7的发布，苹果从拟物化设计转向扁平化设计，并依托iPhone等产品的优势，掀起了扁平化设计的热潮。
，苹果官网也在这波变革中发生了变化。
在2019年苹果官网的首页中，我们可以看到很多按钮变得扁平化。
播放按钮只是一个中间有三角形的圆圈的抽象表示。
现在很多网页仍然采用滚动播放的方式。
用过它。
接下来的变化你可能会很熟悉。
滚动视差和各种交互动画的加入，将网页的观看体验带到了一个新的角度。
这期间我们也可以看到苹果设计的传承，交互动画也被苹果使用了。
在微信上。
查看其过去的推文。
它们大多采用相应的SVG动画技术来引导用户一步步操作和显示内容。
强大的创意和视觉美感能够吸引读者更好地阅读和理解内容。
此外，多设备尺寸适配也是苹果设计和技术变革的一个重点。
如果你留意的话，你会发现，在M1芯片版MacBook Pro的产品介绍页面上，很多元素都被圆角矩形框包围起来。
镶框。
除了圆角矩形是苹果一贯的风格之外，它还可以适应不同屏幕尺寸的产品。
当你在 Mac 上打开这个页面和在 iPhone 上打开它时，虽然主要内容基本保持不变，但它们的排列却发生了一些变化。
▲ 左边是电脑桌面网页，右边是手机网页。
2010年至2017年，苹果对网页设计和技术的探索位居全球领先，将实际观看和交互体验推向最前沿。
一个又一个达到新的高度。
为什么苹果如此重视其网站？与当今大多数公司相比，即使是同为顶级上市公司的微软，也没有像苹果那样在自己的官网上花费那么多精力。
微软中文官网上几乎没有视差滚动等技术。
都存在，更何况是一些普通的公司。
那么苹果为何要花费如此多的精力来建立这个网站呢？首先是中外互联网环境的差异。
现在你可能会发现，很多app的交互和页面设计都极其精致，但PC网站却非常简单。
原因就在于国内移动互联网的兴起。
与苹果这样经营已久，甚至见证了互联网兴起的企业相比，国内不少企业是在移动互联网浪潮中崛起的，比如美团、滴滴，其用户大部分来自于移动互联网。
互联网。
那是智能手机用户。
因此，App、小程序等移动应用往往会受到更多关注，企业在其上投入更多的人力、物力等资源。
第二是品牌。
官方网站是很多用户与公司联系、联系的网上入口。
第一印象非常重要。
如果官方网站非常简单，用户可能不会对该公司甚至其产品产生良好的印象。
更不用说订购产品了。
一个网站也可以说是一家科技公司的门面。
无论是苹果官网的布局，还是页面的黑白交替，甚至是动画效果，都是为了打造“高品质”，让用户信服。
所有网页都是这样完成的。
精致，产品应该相差不大。
作为一家科技公司，苹果的产品、技术、功能都比较先进。
向公众解释抽象而复杂的事物并不容易，尤其是在这样一个碎片化、强调即时满足的时代。
如果内容的美观性和刺激性稍有不合理，用户就会关闭页面。
这就是为什么上面提到的疏密有序、好的文案、视差滚动、交互动画等等都是为了让你快速理解。
AirPods Pro的降噪功能演示就是最好的案例。
降噪原本是一个极其抽象的功能，但通过一个声波缩小的动画很好地解释了。
最后，还有该网站对苹果公司的销售意义。
无论是国内还是国外，苹果官网都是其最重要的线上销售渠道之一，用户流量也不小。
在 Alexa 2018 年全球最受欢迎网站排名中，苹果排名第 54 位。
通过极其流畅、精美的视觉动画，苹果不仅让用户了解产品，还构建了极其精致的在线体验场，让人们在享受美好的同时不放弃。
这和我们之前在《苹果上线的 iPhone 12 配件搭配页面，让双十一「套路节」颜面扫地》中提到的“爱不释手”效果有异曲同工之妙。
即使在网上，你也可以有非常好的产品查看体验，人们在不知不觉中就会下订单。
从2000年至今，苹果在过去的23年里从未停止过对网页设计的探索，如今已经制作出了令一代又一代人着迷的精致流畅的视觉内容。
这可能是苹果最重要的产品。
版权声明：本文内容由互联网用户自发贡献，本站不拥有所有权，不承担相关法律责任。如果发现本站有涉嫌抄袭的内容，欢迎发送邮件 举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。
标签：
相关文章
06-18
06-17
06-08
06-18
06-18
06-17
最新文章
Android旗舰之王的过去与未来
智能手表不被开发、AR眼镜被推迟，Meta的产品经历了一波三折
为什么Cybertruck是特斯拉史上最难造的车？
更新鸿蒙3后，文杰允许你在车里做PPT了
新起亚K3试驾体验：追求“性价比”，韩系汽车仍不想放弃
阿维塔15登场！汽车配备了增程动力，理想情况下会迎来新的对手吗？
马斯克宣布创建 ChatGPT 竞争对手！ OpenAI的CEO给他泼了冷水， GPT-5可能会发生巨大变化
骁龙无处不在，是平台也是生态