【维C设计分享】考试版面借鉴:UI设计的黄金比例

发表于 讨论求助 2022-08-17 07:47:18


【 前言 】

我们都知道黄金比例的比值是一个无理数,取其前三位数字的近似值是0.618。由于按此比例设计具有很强的美感,因此称为黄金比例。这个数值的在绘画、雕塑、音乐、建筑等艺术领域有着不可忽视的作用。

但是很多UI设计师在设计页面却很少运用黄金比例,设计完页面总是感觉差点意思,但又不知道哪里出了问题,这是为什么呢?还有临摹别人的作品,总是感觉自己的差强人意,除非把所有尺寸、间距都调成跟人家的一样才会看的舒服。那么问题出在哪里呢?

最后我们会教大家一个根号2(√2)黄金比例画法!

【 案例分享 】

1、苹果iOS11信息页面

标示1、“信息”的位置,恰到好处的放在了黄金比例分割线上,这样视觉更集中有力度。

标示2、“搜索”文字跟搜索图标并没有像微信那样放到中间,而是在黄金螺旋线的位置,黄金比例的效果就出来了,看起来也就会更舒服。


2、全民k歌

顶部分别都用了黄金比例,可以证明设计师是有意这样设计!


3、支付宝

页面跟黄金线虽然差了几个像素,但这也是黄金比例,UI设计师都知道我们设计尺寸最好都是偶数,这样有利于开发人员的换算。

只要接近黄金比例的尺寸都是黄金比例!


4、uc浏览器

左图蓝色部分加上间距正好构成黄金比例,且并不影响下面内容板块,下面图片上下间距也都是26px。


5、西瓜视频

小视频栏目每个食品图片尺寸都是黄金比例。


6、优酷app

这是颜色不同的1:1.618的黄金比例


 黄金比例的绘制方法  

√2矩形的黄金比例绘制方法

【总 结 】

黄金比例结构设计对UI设计是很重要的,但是不能过度依赖于黄金构图,不能为了用而用,要结合UI的设计规范,结合交互功能、页面的内容,恰到好处的运用。

初中级设计师最好能多运用黄金比例来做设计,用的多了心中就会自带黄金比例,为什么资深设计师随便构个图就很好看,那是因为他们心里有各种构图原理,所以得心应手。

以上内容来源于网络



别错过干货分享,请关注⬇️


高校资源链接 \ 整合

我们在无锡

要做最专业最新鲜最充满活力

的设计考研Family




各院校免费答疑群:

江大设院:348013556  浙江理工:451439643

华东理工:306300682  华东师范:413457241

南京工业:456308100  南京理工:497065437

南京林业:483859643  上海大学:533528946

上海师范:496478607  同济大学:526970423

东南大学:306955423  北京理工:529372592

湖南大学:543110682  武汉理工:147164771

汕头大学:531812225  深圳大学:521186421


同时

欢迎大家加入维C设计考研官方群

及时获取重要考研资讯:336735629



详情咨询?







发表
26906人 签到看排名