江苏龙网

  1. 首页 > 人文 > >

你对圆角所有的困惑，这里都帮你解答了


编辑导语：圆角设计在生活中是比较常见的 ， 在手机、网页端等等我们都能看到各种圆角设计 ， 特别是苹果手机的软件设计都为圆角；为什么设计师喜欢用圆角？本文作者对此做出了详细的介绍 ， 我们一起来看一下 。
你对圆角所有的困惑，这里都帮你解答了
本文插图
圆角无处不在 ， 不论是banner中的按钮、彰显身份的头像 ， 还是承载内容的卡片 。
但是 ， 圆角的背后到底是什么样的逻辑？或者直白点说 ， 为什么这里是圆形头像 ， 那里是矩形？这里出现了全圆角按钮 ， 那里却不是？
如果你和我有一样的困惑 ， 希望我的这篇文章能帮到你 。
一、圆角的历史
其实 ， 互联网中的圆角矩形最早源自于1981年的Macintosh 。
乔布斯希望这种美好的形状能够出现在正在研发的苹果系统中 ， 他用生活中带圆角的桌椅、甚至是街头带圆角的标志牌成功说服了工程师比尔·阿金斯特实现了圆角矩形的绘制技术 ， 并为其命名为RoundRects；之后 ， 这个美妙的形状便被沿用到了苹果所有的用户界面当中 。
你对圆角所有的困惑，这里都帮你解答了
本文插图
值得一提的是 ， 自那个彻底转型扁平的ios7开始 ， 所有的圆角矩形得到了特殊意义上的优化 。
在7代之前 ， 图标的圆角曲率并非连续的 ， 每个圆角与边缘的衔接处都会带有明显的切边；苹果受工业设计的启发 ， 将工业中的曲线连续概念应用在了ui中 ， 以连续、渐变式的曲率来将让圆角矩形变得更加圆润、平滑；同时 ， 这种更新也与同一时间发布的iphone5c的边角工艺设计达成了统一 。
你对圆角所有的困惑，这里都帮你解答了
本文插图
苹果对圆角的执着并不仅仅停留于此 。
到了2017年 ， 圆角甚至被直接运用到了手机屏幕当中；当手机机身、屏幕、dock和图标 ， 每一处的圆角以近乎于等比数列的形式依次追随时 ， 就形成了一种充满魅力的秩序感、和谐感；而这种被称为全面屏的工艺也被各大厂商们竞相效仿 。
你对圆角所有的困惑，这里都帮你解答了
本文插图
既然谈到苹果 ， 就不得不谈到苹果的老对头——微软 。
其实早在远古的XP时代就出现了圆角界面设计 ， 乃至后面的vista和win7；但是到了WP时代 ， 微软为了与苹果做出风格差异 ， 以完完全全的直角来作为触屏端的设计语言 ， 而这个语言也成为了微软最具代表性的特有风格——metro（modern UI） 。
在metro下 ， 所有的图标彻底得脱离了拟物的范畴 ， 它们全被一巴掌拍扁 ， 变为了地铁标志牌一样的直角矩形色块；向来追随苹果脚步的微软思想超前得引入扁平化的概念 ， 这也加快了拟物时代向扁平时代的过渡的进程（虽然当时的win8由于忽略了占据绝对比例的非触屏设备用户的体验 ， 而被喷得体无完肤 。 ）
你对圆角所有的困惑，这里都帮你解答了
本文插图
这种另类的风格一开始并没有被大众认可 ， 直至后面得到显著优化的win10以及17年推出的Fluent Design ， 这种风格才算是真正得被用户们接受；不过 ， 由于直角本身过于方正锐利 ， 导致这种风格犹如“钢铁直男”一样缺乏细节和美感 ， 因此喜欢这种风格的用户依然是少数 。
值得一提的是 ， 在去年20H1版本的win10界面中罕见得回归了久违的圆角 ， 这也意味着微软彻底放弃了自己坚守近10年的直角阵营 ， 正式向主流的圆角风格妥协 。
你对圆角所有的困惑，这里都帮你解答了
本文插图


推荐阅读


上一篇：淮北市|安徽省投资集团公司原董事长杜长棣被公诉

下一篇：降幅为|15股股东户数连降3期以上 最多已降15期