浅谈网页设计中Grunge风格的应用

2016-02-16 21:57 7 1 收藏

人生本是一个不断学习的过程,在这个过程中,图老师就是你们的好帮手,下面分享的浅谈网页设计中Grunge风格的应用懂设计的网友们快点来了解吧!

【 tulaoshi.com - 平面设计 】

GRUNGE 原意是摇滚乐的一种风格形式,描述音乐里那种嘈杂而失真的感觉,但在设计行业里,它有特别的含义,表现为不规则颓废邋遢垃圾等特殊的视觉效果,而这样反而会营造出另类的美感。今天飞屋睿UIdesign写了一系列教程,从认识GRUNGE到如何运用在作品设计中,都有教程,赶紧学起来。

一、认识GRUNGE

GRUNGE,从英文单词的字面意义解释为:蹩脚的东西、乏味的东西、难看的东西。但在设计行业里,显然它还有更特别的含义。

设计中的GRUNGE是一种效果,就像音乐里的GRUNGE摇滚被翻译为垃圾摇滚一样,它表现为一种不规则颓废邋遢垃圾等特殊的视觉效果,而这样反而会营造出另类的美感。类似的表达也出现在服装设计行业,想想大家都熟悉的做旧感的牛仔裤等乞丐服,就不难欣赏GRUNGE风格了。

目前,扁平化设计大行其道的时候,作为拟物效果的GRUNGE风格似乎显得有些逆反而行,但是作为一种特殊的另类效果,它是值得在设计中作为考量和运用的。尤其是当设计主题为创意、想象或想表达某种另类不羁的时候,无疑,它能创作出非常有代表性的视觉效果。

下面我们首先来认识一下各类GRUNGE效果运用。

二、GRUNGE效果的网页

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)

GRUNGE效果并不单单是代表着垃圾、邋遢,GRUNGE设计也许只是运用了很少的GRUNGE风格的装饰,或者在主要内容里表现出这样的风格。下面是这类风格的网页设计。

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

三、GRUNGE风格的字体

当文字本身就作为设计元素的一部分,它的装饰性作用极强。搭配同样风格的背景,渲染出的GRUNGE堪称佳作!

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

四、GRUNGE风格的图标

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)

拉伸、扭曲GRUNGE图标可以承受这些,它与完美像素无关。

这是一组以黑板为背景的黑白GRUNGE图标,俗称黑板报效果,在怀旧课堂等为主题的设计中运用较多。

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

一组彩色GRUNGE风格图标,色彩搭配得非常协调,并且运用了纸张感觉图形作为背景,更加拟物形象。

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

五、GRUNGE纹理

这类型的纹理优设有很多呦,小技巧:同学们戳开下边的地址,Ctrl + F 搜索GRUNGE 就可以看到啦!

《史上最华丽!2000组PS杀手级纹理打包下载》,已打包噢

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

六、GRUNGE笔刷

类似 Brushking 这样的网站里有大量的GRUNGE风格笔刷可供用户免费下载。

浅谈网页设计中Grunge风格的应用,PS教程,图老师教程网

来源:http://www.tulaoshi.com/n/20160216/1575219.html

延伸阅读
大家好,我是阿木,今天我结合我在微博的实际项目跟大家分享一下极简风格的一点设计心得。现代城市生活中我们每天要面对嘈杂拥堵的街道和地铁,各式各样的广告,处理各种邮件和信息。于是我们内心追求一种体验那就是极简,像大家家喻户晓的品牌如:MUJI无印良品、 苹果 、宜家家居,都是这一风格的发扬者,他们的产品也获得了巨大成功。 极...
苹果公司的设计的确十分出色,即便是十年前的网站界面,放到现在来看依然十分精致,因此直到今天也有许多设计师不断参考与模仿苹果的这种风格。到底苹果设计是靠什么来征服客户的呢?通过本文中分析苹果网站界面,我们可以看到苹果网站的设计所具有的某些特点。 此外文中也收集了大量的苹果风格网站界面,是喜欢苹果的设计师参考的好材料。 苹...
手绘元素通常是用在纸上的,但是它们被越来越多的用在网站设计上面,这些速写元素令网站极具个性并能为访问者提供有趣的体验。手绘风格的引入,对于互联网应用作品起到了一个积极的影响。不同的主题和绘画风格,使其表现形式具有原创性,给设计带来了多元化,人性化的特征。 我们先来看一些网络中的案例: 节庆主题插画 GOOGLE每一次节日...
列表中使用两种相同的样式但颜色不同的背景,来间隔显示的内容。看了当下很多界面以及自身平时的设计之后,发现实际情况中使用的斑马纹在原来基础上通过视觉的处理有了扩展,不仅仅是一深一浅单纯颜色的配合使用。 大家好,我叫斑马纹 列表中使用两种相同的样式但颜色不同的背景,来间隔显示的内容。 当然这个释义我是借鉴《designing int...
正确的背景风格可以为整个网站确定基调。我们搜集了一批使用大幅图像、明亮颜色或出众图案来作为背景的优秀网站,希望从中探寻当下网站的流行设计风格。 什么样的背景最适合你的网站,这并没有一定之规,但确实有一些共同的要素: 互联网背景的内容应该有目的性。 背景应该与你的品牌风格一致。 背景之上的文字内容应该易于阅读(无论是...

经验教程

282

收藏

16
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部