穿搭与界面设计

  • 经验类型经验/观点
  • 经验属性原创文章
  • 经验版权署名-非商业性使用-相同方式共享
17645 42 299 2017-10-23

现在的年轻人衣服越穿越好看,懂得搭配的越来越多,各种颜色、款式、面料的衣服、配饰真是让人看的眼花缭乱。

会穿衣服,尤其是会搭配衣服的设计师们其实是很富有智慧的一群人,他们懂得如何利用设计知识来装扮自己,其实这点引申到界面设计里面也是相通的:


衣服色彩搭配  VS  界面整体配色


在服装搭配技巧中,色彩搭配尤为重要,先不谈衣服款式如何,你给人的第一印象很大程度是你所穿的衣服的颜色决定的,这其中也能透露出性格信息,比如偏爱黑色的人往往是沉稳、内敛的,偏爱彩色系往往是活泼、阳光的等等。


服装搭配中从头到脚主色最好不超过三种,在界面设计中也有主色辅色之分,三色原则一般认为在一个界面设计中颜色应该保持在三种以内,这里跟服装搭配一样,也并不是强调必须三个颜色,而是三种:主色、辅色、强调突出色。


Image title

黄色手包和黄色高跟鞋起到了画龙点睛的作用,在UI设计中很多时候互补色和主色也能起到点缀作用


再比如一般妹子上身穿一个纯色系T桖,下身穿一个白色裙子,这样穿突出了上衣,也符合上深下浅的原则,整个人给人明快、活泼的感觉,但是如果鞋子穿一个小白鞋就会显得整个人不稳定,其实一些UI界面也是这样的,很多重色的使用对画面平衡有非常大的作用,UI设计中大面积的纯色使用可以让用户对产品的感受更加统一并且印象深刻,如果这个纯色还能贯穿整个产品的设计,那更加能让你的产品易于传播。


Image title

红色上衣+白色裙子让引导目光从上到下还可以衬托腿长,然而这种引导在UI设计中也极为常见,一些App的我的界面中用大块纯色引导用户视觉


UI设计中通过有效地使用对比可以使你的内容更加清晰从而让阅读变得轻松。好的对比,一般会采用色彩的两极,如白与黑,淡蓝与深蓝,高亮与低亮。在服装搭配中也存在对比,比如色彩对比,明都对比等,用的较多的是明度对比,能衬托个性张扬。


Image title

Image title

一些比较好看的界面,其实它们的配色跟一些女装颜色搭配有相通的地方,看来流行是全领域的


深色系背景比浅色来的更加深沉稳重,比较适合用来展示图表、数据网格等,良好的布局之下,黑色背景能显著提高这些图表、数据的表现力,让用户更加聚焦。


Image title

暗色背景比较适合Dashboard展示数据图表


深色系UI背景本身就具有很强的神秘感,吸引人,结合内容对比度、可读性较强,深色背景非常适合亮色和鲜艳的颜色控件,这点就和黑人适合展示鲜艳颜色衣服一样。


Image title

Image title

一些黑人很喜欢穿亮色鲜艳的衣服更好的展示自己


什么是律动?


如果说万物生长是有规律的,那么设计就是萃取大自然的旋律,经过设计师重构呈现在用户眼前的韵律美。


大自然告诉我们美的事物都具有一定的规律,包括鲜明的生动的形式——渐变色彩、音律、形态等给用户以舒服的感觉。我们这里主要谈谈渐变色的律动和形态起伏律动:

Image title

渐变色的包臀裙极富层次感,让本来就身材火辣的模特显得婀娜多姿凹凸有致,UI设计中这种手法也能让整体看起来更具有节奏感,信息和谐且具有秩序性


Image title

Image title

同样形态下不断的反复进而形成强烈的韵律效果,再结合渐变色,整个logo更加具有活力



形态起伏律动与渐变律动不一样,它着重体型细节处理,更加强调某一细节因素的规律变化,使形态结合富有层次感、肌理感,投影明暗错落有序,生动。节奏的形式产生的美感就像流体雕塑一样,这种感觉犹如地平线上起伏的山峦,如果标志设计中运用到这种手法,会使标志充满力量感、灵动性,并且独一无二,这其中以Dribbble上的印尼设计师Yoga的作品为代表。


Image title

第八代索纳塔提出的“流体雕塑”概念,线条更加饱满 车身更时尚年轻 


Image title

App设计里面的形态起伏律动


Image title

yoga的logo设计




穿衣性格  VS  产品性格


一个人的性格不仅体现在行为举止上,衣着打扮也能看出一二,一般女生天生爱美喜欢打扮,所以相对男生来说比较难看出。比如穿衣风格喜欢保持一致的人,可能相对固执、保守,不倾向于做出调整、改变和接受新事物,再比如喜欢搭配饰的人可能比较重视细节而且还有些小挑剔。


Image title

恬静的小姐姐、恬静的界面能第一时间透露性格


Image title

chuu模特SUNG KYUNG搭配很有个性,跟格子裙搭配上身应该避开条纹或格子



一般用户第一眼接触到产品的颜色是确定产品性格的最简单的方式,你可以从中窥探它背后的设计团队想赋予给它的灵魂,产品性格能帮助我们找到合适市场,特定传播路径,合理生存和发展的空间。一些小众化的App其实都是富有性格的代表,它们通过自身的设计风格和文案等定位目标服务小群体,但是在目前市场化情况下还能坚持这种定位的不算很多。


Image title


设计工作者有时候十分愿意将自己的思想和理念赋予到产品中去,以达到产品跟设计者的统一,这就叫做有灵魂的产品。


好了,感谢大家看我的瞎扯!


Image title






全部评论:42

  • 坚甲苍苍

    2023-03-02 14:20

    @: 真是说到心坎上了

  • 2020-07-14 15:29

    穿搭风格不变可能是因为穷,朕深有体悟

  • 竹禾禾

    2019-06-22 10:31

    醍醐灌顶,设计要思考,谢谢楼主分享

  • RETHINKAIZ

    2017-11-23 13:44

    这个对比方式很有意思!因吹斯汀!

  • ldguer

    2017-11-17 09:41

    @G设计: 所以说最后用了黑色的鞋子(深色)稳住以免飞起来

  • wstcee

    2017-11-06 15:24

    @生命之夏: 赞同

  • Snow诺

    2017-10-30 10:31

    一身黑就是沉稳?你得先看看人家穿得什么黑衣服吧。。。

  • UI平面设计学习群605464266

    2017-10-29 21:05

    引用楼主的这句“设计工作者有时候十分愿意将自己的思想和理念赋予到产品中去,以达到产品跟设计者的统一,这就叫做有灵魂的产品。”说得很对,设计师们看过来

  • 琉璃水的杯

    2017-10-28 11:13

    大神,厉害,喜欢您的阐述和作品

  • 生命之夏

    2017-10-26 11:56

    @G设计: 看脸

  • G设计

    2017-10-26 09:52

    请问一下,衣服上深下浅,不会显得头重脚轻吗?

  • 三通啊

    2017-10-26 09:18

    @Shijingkun石璟琨: 惊喜不

  • Shijingkun石璟琨

    2017-10-25 18:36

    @三通啊: hhhh

  • 三通啊

    2017-10-25 16:29

    @Shijingkun石璟琨: 你看起来像个C++程序员

  • Shijingkun石璟琨

    2017-10-25 15:44

    @三通啊: 他是我师傅

  • so_yan

    2017-10-25 15:23

    我作为一名设计湿,平常穿着都要个性化一点,因为总想着我是一名设计湿,不能跟普通人一样的穿衣风格,要有个性,然而,穿出来还是很普通,身材不好,穿什么都不好看,还是减肥吧................

  • cl_silver

    2017-10-25 10:06

    我也这么想。 这篇文章是入门,进阶可以讲讲具体搭配时色调是怎么偏移然后搭配在一起的~

  • 糖糖Badboy

    2017-10-25 09:46

    这对比太生硬了

  • Maimeri

    2017-10-25 09:22

    穿搭出的风格和界面风格是相通的概念,然我一下有了灵感,穿搭亦是设计,谢谢分享

  • 三通啊

    2017-10-25 08:59

    你看起来像个程序员

  • tere

    2017-10-25 07:32

    @Shijingkun石璟琨: 感谢感谢!

  • tere

    2017-10-25 07:32

    @大宝蛋: 感谢老弟,哈哈!

  • tere

    2017-10-25 07:32

    @·Jerry: 感谢兄弟看我瞎扯

  • tere

    2017-10-25 07:31

    @kihoo: 感谢感谢

  • tere

    2017-10-25 07:31

    @孟小豆: 大部分情况下这个理论应该是对的

  • 篱笆旁love彼岸花

    2017-10-25 00:22

    有意思

  • 孟小豆

    2017-10-24 22:01

    会穿衣服,尤其是会搭配衣服的设计师们其实是很富有智慧的一群人,哈哈双手赞同~~

  • 设计师Sun

    2017-10-24 17:21

    八错八错

  • kihoo

    2017-10-24 15:41

    前来支持老哥

  • ·Jerry

    2017-10-24 14:45

    扯得好!学了

  • 更多

更多作品

发表评论

取消

点击右上角
分享给朋友吧

分享到

取消

每人每天仅限5票,快给你心仪的作品鼓励的一票。

投票