• 曾文明:全力冲刺决战决胜脱贫摘帽 2019-10-19
  • 意大利留学生毕业致辞中国的白开水厉害得不得了 2019-10-13
  • 美国在台湾、南海问题上,采取了“切香肠”战术,一次次逼近中国的底线、红线,企图瓦解这些底线、红线。在经贸问题采取了同样的战术,一次次出尔反尔,不断勒索加码 2019-10-01
  • 《数码宝贝故事》第三阶段首发初回特典公布--人民网游戏 2019-10-01
  • 持之以恒构筑祖国北疆万里绿色长城厉行法治确保百姓享有更多蓝天白云 2019-09-22
  • 人民日报社习近平新闻思想理论研讨会发言摘编 2019-09-16
  • 聚焦两会:听民意 汇民智 落实十九大精神 做好每项工作 2019-09-16
  • “冷热莫测”的世界杯来了 2019-09-15
  • 狗屁不通!知道你的貴村長姓啥嗎? 2019-09-15
  • 宏达矿业:关于收到上海证券交易所关于公司有关交易事项的监管工作函的公告 2019-08-26
  • 特朗普称美国不再面临朝鲜“核威胁” 2019-08-21
  • 中国才是当今世界最大的民主国家 2019-08-21
  • 男子480万元彩票奖金被冒领调查 官司打赢仍难追回 2019-08-14
  • 在战火中诞生的党中央机关报(连载九) 2019-08-14
  • 人民币兑美元相关新闻 2019-08-07
  • [产品设计]产品设计中圆角为何应用那么广泛?

    双色球128期历史同期 www.nzhc.net

    无论是硬件设计还是软件设计,圆角的应用都非常广泛。这是因为人眼处理圆角更容易,圆角具备较强的信息引导性,能够更加凸显卡片中的内容信息;同时,圆角的设计也更具安全性、亲密性。

    产品设计.jpg

    我们最熟悉的苹果公司在使用圆角卡片最早卡已追溯到1981年,当时 Apple 的天才程序员 Bill Atkinson 正向团队展示他是如何用一种聪明的方法可以在仅有 68000 处理器的 Lisa 和 Macintosh 机器上快速画出圆和椭圆。

    Steve Jobs 看了之后有另外的想法,他说:“圆和椭圆都不错,但是能画出带圆角的四边形吗?我们现在也能画出吗?” Bill Atkinson 回答说,很难做到,而且他认为并不真需要圆角四边形。Steve Jobs 就立刻强烈回应了:“到处都是圆角四边形!看看这个房间周围就知道了!”并且还带着 Bill Atkinson 出去转看可以碰到多少圆角四边形,最后 Bill Atkinson 被说服,第二天下午就拿出了满意的结果。

    首先,我们纵观2018年当下各大厂商发布的手机,在工业设计上来看基本都采用了更加柔和的圆角设计,例如:iPhone、SAMSUNG、小米、VIVO等等。


    在屏幕设计上同样选择了圆角设计,在细节之处也保持了高度的统一,例如:在摄像头位置的连接处同样采用了圆角弧度作为过渡。我们以iPhone为例:


    可见,圆角设计的应用已经成为硬件工业设计的中的非常重要的设计语言。

    不止是手机的工业硬件设计上采用了大量的圆角,各大厂商的手机系统 UI 也大量采用了圆角设计。

    大家最熟悉的可能就是 iOS 系统里的圆角设计,自2007年随着 iOS 7 的发布,Apple 将 iOS 上的标志性的圆角标轮廓做了更新,将工业设计中的曲线连续概念应用到了视觉设计上,一直延续至今,在 iOS 12 全面应用。


    除了 iOS ,Android 的各大厂商也纷纷使用圆角设计,例如 SAMSUNG 的 ONE UI,都是采用了圆角的设计语言。


    以及国内的 MIUI 10 的系统界面设计同样使用了圆角作为设计语言。


    相对于其他图形,人类的眼睛更容易识别圆角矩形而不是直角矩形,因为人在眼睛的生理构造上中央凹(fovea centralis,是视网膜中视觉最敏锐的区域)在处理圆形时最快,而处理矩形边缘则需要涉及大脑中更多的“神经影像工具”[1]。

    所以,人眼处理圆角更容易,因为它们看起来比普通矩形更接近于圆。


    例如:App Store today页面,通过圆角的卡片设计用户可以快速识别内容,但如果换成直角的话则会提升它的识别成本。


    在巴罗(Barrow)神经学研究所完成的关于“角(corners)”的科学研究发现:“角的突显性感知与角的度数的线性变化,锐角比钝角产生更强的虚幻的突显性”[2]。

    换句话说,角越锐利,看起来就越显而易见。而角出现的越凸显,就越多对视觉过程产生影响。


    例如:西瓜视频改版中,将“锐角”的播放按钮改成了“圆角”的播放按钮,较少了锐角对用户的视觉影响。


    相对于锐角,圆角显得更加柔和,具有安全感。尖锐的图形或者物品更容易应用在警惕性的场景里,会给人予以警示或者伤害。

    例如危险的标示:


    圆角自身的图形属性则更加柔和、舒适,给人一种安全感和亲密,例如:在设计玩具的时候会采用大量的圆角设计,来让家长对其放下戒备心,让家长觉得这是安全的,可以给孩子玩。试想哪个家长会给孩子一把刀子玩?

    现在的少儿用户群体增长也带来了不可避免的趋势,针对少儿用户,由于群体的特殊性,少儿应用 app 中使用了大量的圆角设计,例如:ABC mouse 中控件都使用了大圆角的设计,使界面显得富有童趣,且安全可靠。


    圆角在使用地图或图表的场景中具有的得天独厚的优势,圆角的弧度能够更加平滑的连续的引导用户的视线,符合用户的头部与眼睛的自然运动,而锐角则会迫使用户的视线进行强制转折,其中容易造成用户的停顿。


    例如:北京的地铁地图,在折线处都采用了圆角设计,具有很强的引导性,来帮助用户快速查询各个地铁站点。


    在一些具有引导性、指向性的图标中大量使用圆角曲线,例如高德地图的导航界面,转弯 icon 的转折点使用了圆角作为过渡,引导用户视线。


    在卡片上的应用中,由于边缘圆角向内指向矩形的中心更加明显,所以更加凸显卡片内的内容。


    当多个卡片并排时,带圆角的卡片具有更强的内部指向性,且相邻的两条线差异化较大,我们可以清楚分辨他们的边界线,所以更加容易被分辨。而同样大小的直角矩形的内部指向性较弱以及临近的两根“线”更加相似,分辨起来会相对困难一些。


    微信关注我们

    微信分享此文章

  • 曾文明:全力冲刺决战决胜脱贫摘帽 2019-10-19
  • 意大利留学生毕业致辞中国的白开水厉害得不得了 2019-10-13
  • 美国在台湾、南海问题上,采取了“切香肠”战术,一次次逼近中国的底线、红线,企图瓦解这些底线、红线。在经贸问题采取了同样的战术,一次次出尔反尔,不断勒索加码 2019-10-01
  • 《数码宝贝故事》第三阶段首发初回特典公布--人民网游戏 2019-10-01
  • 持之以恒构筑祖国北疆万里绿色长城厉行法治确保百姓享有更多蓝天白云 2019-09-22
  • 人民日报社习近平新闻思想理论研讨会发言摘编 2019-09-16
  • 聚焦两会:听民意 汇民智 落实十九大精神 做好每项工作 2019-09-16
  • “冷热莫测”的世界杯来了 2019-09-15
  • 狗屁不通!知道你的貴村長姓啥嗎? 2019-09-15
  • 宏达矿业:关于收到上海证券交易所关于公司有关交易事项的监管工作函的公告 2019-08-26
  • 特朗普称美国不再面临朝鲜“核威胁” 2019-08-21
  • 中国才是当今世界最大的民主国家 2019-08-21
  • 男子480万元彩票奖金被冒领调查 官司打赢仍难追回 2019-08-14
  • 在战火中诞生的党中央机关报(连载九) 2019-08-14
  • 人民币兑美元相关新闻 2019-08-07
  • 射龙门稳赚不赔投注 四肖免费期 喜乐彩走势图 香港六合彩特码 上海天天彩选4开奖情况 吉林快3三期追号计划 2018nba冠军 广西快乐十分有何技巧 彩票中奖税率 体彩6十1走势图带连线2元网 棋牌游戏可以提现的 pk10冠军遗漏算法 北京赛车冠亚大小技巧 下五子棋小游戏 pc99预测神测网