网站设计中的手绘元素应用
发布时间:2018-11-08

    一、手绘元素作为分割符
    手绘元素几乎可以和任何设计元素有效地搭配起来,包括图片、视频、文本等等,还可以为留白增加视觉焦点。
    作为分隔符,手绘元素不会显得过于突兀,让分割区块的留白也不至于单调,让用户明白内容区块的边界的同时,也保持了整个页面设计的节奏感。


    二、优化交互体验
    手绘元素还可以让网站中的交互变得更加有趣。不管是将它作为加载动画还是网页设计交互体验的一部分(许多网站已经开始使用),手绘元素这种设计技巧能够很好的引起用户的兴趣,发挥自己的优势。


    Real Estate Stained Glass 这个网站就做的相当的到位,他们不仅仅使用了手绘图标,将整个网站做成了手绘动画,而用户可以随着动画和音乐,给页面中不同的区块上色,整个过程无比的流畅,你所填充的色彩会实时地出现在页面当中,整个沉浸式的体验相当棒。


    三、吸引用户
    手绘元素对于儿童有着无与伦比的吸引力,对比与其他形式,儿童对于手绘元素更为青睐,因此一些面向儿童的网站,采用手绘元素能够很好的引起用户的兴趣。
    卡通画和插画等手绘元素也能带来清新脱俗的感觉,让网站变得更加与众不同,在视觉上也会显得更加舒适。


    四、突出设计感
    上面说的手绘元素在网页中都起到了一定的功能性作用。但这还有一些手绘元素纯粹是出于视觉设计的目的而存在的。


    在 Mother's Brewing 这个网页当中,首页上巨大的手绘的心型图标明显就是为了这样的目的而存在的。设计师在其他有的页面上也采用了类似的手绘图标来装饰页面,强化视觉,突出整体的设计气息。


    五、用手绘传递情绪、营造氛围
    手绘设计元素常常更加轻松、欢快。它们可以在几乎任何网站中发挥自己的这种特点,你在网站使用的手绘元素越多,网站会显得越轻快,用户在浏览时的情绪也不会太差。


    六、展现创意
    手绘设计元素还可以用来展示网站的创意,这尤其适用设计师作品集的展示网站。这些手绘元素可以让用户集中了解设计师想法的产生,设计的具体过程。
    The Feebles网站首页上就使用了手绘元素,右图展示了设计师的创作过程。除此以外,首页左上方还有一个手绘Logo,十分俏皮。


    七、手绘元素使网站人性化
    格式化的文本和图形更像是计算机和数字为主的语言。虽然一些内容看起来非常棒 ,但缺乏人性的感觉。想象一下,虽然出自同一个人的同样的内容,但在邮件中收到的是一封蘸着墨水的手写信。但当你阅读它们的时候,两者会引发不同的情感,手写的信件会更加朴实自然。


    从某种意义上说,我们会觉得手写信对读者更具亲近力。这样的想法也同样适用于网站,将文本内容转换成手绘的形式。注意LAI Video如何在其页面中使用手绘图标和内容。它与该网站的儿童活动的主题相关,同时也为该网站提供了更加贴心和人性化的感受。


    八、动态手绘效果
    在这个动效大行其道的今天,手绘元素更终也难逃动画效果的"魔爪"。动态的手绘元素,无疑拥有更强的娱乐趣味,在增强网站转化率、延长用户停留时间上有其他设计元素所不可比拟的优势。


    Long Story Short 就在网页设计上沿用了这样的思路。不止是网站本身的手绘LOGO 采用了动态效果,而且借用快速的视频剪辑,将他们其他的品牌设计项目快速地展现出来。