赞助商
立即赞助

氛围独特情绪深沉的深色系网站,设计上有什么讲究?

专题页设计3年前 (2021)发布 流光
3.7K 0 0

在设计,情绪传和氛围造常是要看设计项目目是什么,而不配色和不元素组合,往往能够呈现出截然不风貌。相比下,深色系网站常常会呈现出更为独特氛围,传出更为复杂多样情绪。虽然这样情绪并不定是正和上,是好设计归是让过目难忘。

想要借助深沉的色调来创情绪相对独特的设计,是有一些可供遵循的见的设计技巧,今天的章,我们来分享一这方面的容。

深色,并不定是黑色

氛围独特情绪深沉的深色系网站,设计上有什么讲究?

首先这必须明确,深色并不定是黑色。

在取配色的时候,明亮的色彩当中添黑色或者灰色得的色彩,通会显得更深沉浓重,这样的色彩中往往会包含之前的色调。

在上面的 Hooligan 这个网站当中,计不仅采用了深沉的黑色背景,而且采用了和黑色背景相当匹配的暗金色,种深色之间色彩暗依然存在对比,和色的标题文本构成了三个层次,不仅有视觉吸引力,而且创造出了沉稳厚重的氛围。

阴影的使用

氛围独特情绪深沉的深色系网站,设计上有什么讲究?

阴影和光线往往是相伴现的,而阴影带来的舞台剧般的效果则充满了戏剧感和神秘感,这是设计师它的原因,这样的设计会户心中产生兴趣和好奇心。

在上面的 Clear Motion 这个网站当中,车辆周围被阴所包围,文本内容容易吸引用户的注力。同,用户会好奇这辆车有什殊的地方,有什地方起来不一,黑暗的氛围下,用户的好奇心会身不由地高涨起来。

黑色叠加层

氛围独特情绪深沉的深色系网站,设计上有什么讲究?

黑色的半透明层叠到图像上,是制深色系背景的一种见手法。在图片的取和同的透明之,背景图片呈现来的效果和氛围,是非同的。

透度较低的情况下,黑色叠加图层会让用户不清背景中的息,这使得背景息在整个计中参度较低。透度较高的情况下,更多的背景素会透过叠加层呈现出来,和前景素产生交叉和互动。但是总的来说,黑色叠加层让素之间产生对比,也使得行为召唤素更容易发挥作用。

面的 Fhoke 这网站当中,透明叠加层让背景中的场景当透露一点出,但真吸引人注意力的,还标题左侧的行指引。

简陋的画布

氛围独特情绪深沉的深色系网站,设计上有什么讲究?

细节较多的背景让人觉得息丰,而粗陋的画布则更容易创造出一种虚无的觉,相应的,后者是会让人更有探索的欲望。粗陋甚至赤裸的深色系画布好地将神秘和探索的欲望结了一起。

Dubois 这网站的背景同样非常的简单,纹理,只通过均匀分布的小圆点行装饰,如果仔细观察会发这些点的分布、色彩其实微妙变化的,会引导去注意于整页面底部的文本标题,虽然绝多数的网站并不会把标题这样的置。

字体的选取

氛围独特情绪深沉的深色系网站,设计上有什么讲究?

Punk is Not Dead 这个网站给你的觉是否独?网站的计非常清晰,识别度极高,网站本身还有音频组件,它的计从视频音频一应俱全,整体充了朋克的风格。

黑暗的背景明亮的字体色彩于实这样的效果,但字体的选取关键的。象一下使用普通的字体,完全达不到这样的效果。尖锐粗糙的并不那么友好的可读性,让他视觉朋克的精神保持了一致。

黑白配色

氛围独特情绪深沉的深色系网站,设计上有什么讲究?

当计完全失去色彩,仅仅保留黑色的情况下,会给人什的觉呢?如果整个计是以黑色为主,搭配少量其的颜色,体验和氛围是什的呢?

黑白配色纯黑主的配色一样,很易创造出戏剧化的效果,这两种色彩本身所构的冲突对比就原因。

黑白的强烈对比,常常促使访客在浏览程中忙注意不同的细节,面对 Super Rebel 个网站的时,种感就非常明显。打开页面之,注意力迅速被右上角的图吸引,随便忍不住把对比强烈的所有模块扫视一遍。黑白搭大量信息很容易创造出信息载的效果和验。

图片的选取

氛围独特情绪深沉的深色系网站,设计上有什么讲究?

Jimmy Chin 他的作品集网站的「关于」页面当中,他将自己的照片直接了去,色彩采用了单纯的黑色。

彩的明暗和饱和度的选取,直接影响着整个设计的情绪,在里,单纯的黑让整个页面的形式感更强,而所呈现出来的感也非常的锐。想想看,他穿着黄的衬衫和绿的裤子,么整个图所呈现出来的感是完不同的,浮夸而醒目。

图片选取于情绪表和氛围造有着巨大影响。

也可以营造轻松的氛围

氛围独特情绪深沉的深色系网站,设计上有什么讲究?

许深系的网站给人以深沉、怪异的感,但是深并不完代表着负面的情绪。深系的网站同样以被设计得轻松而富有活力,主要取决你何将元素组合到一。

在 Atom 这个网站,个背景都采用了典型深灰,是卡色和轻盈色调让网站凸显出可爱而有趣感觉。这样设计也能带来视觉奇观,并不会让用户感觉到负感受。

这种设计户和之间的情感联系更轻松,务更容易为户接受。

结语

那些带有负面情绪和独特氛围的,你吗?带有这样情绪和氛围的,需要设计师更多的时间和精来拿捏程,来达成相应的设计目标,而且这样的设计并非好。情绪的设计,有趣而神秘的氛围,带有负面情感的表达,躁甚至暴躁的设计,这些都有独特的作。

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

@Jenny黄静雯 :节日闪屏的呈现虽然只有一个画面,但了解设计背后的来龙去脉,才能让设计有根可寻。 一、节日闪屏是什么?​ 1...
情感化设计
无论是在上市 BAT 还是创业小公司,都随时可能接手从0开始的新项目,那么作为负责新项目的主设 OR 独立设计师,我们应该从何...
产品设计流程
现代人对于健康越来越重视,而移动端APP 在这方面为用户提供了多种多样的帮助。无论是系统化的健身应用,还是卡路里计算器,...
App设计
上篇内容笔者介绍了「交互设计七大定律」的前五个,接下来笔者将剩下两个定律为大家做个实例分析。 六. 复杂性守恒定律/泰思...
交互设计
设计师的主要职责之一,就是为产品定制合理的视觉,基于目标用户的特征和产品的设计目标,给用户特定的感觉。UI和UX设计师需...
ui设计
编者按:设计原则总是看起来简单抽象不言自明的,但是在细分的设计领域,这些原则其实有着各自不同适用情况,有着「特定的条...
ICON
如何构建一个完整的解决方案呢?学会提问,学会多角度看问题,可以帮助我们构建一个完整的方案。 Airbnb Design与News Deepl...
经验分享
今天跟大家分享的是《瞬间之美》之Web 界面设计如何让用户心动? 本书分为七个部分,第一部分到第三部分讲用户进入网站前30...
Web设计