方法多多!教你搞定手绘专题页设计

2017/05/21 39057

@做设计的面条 :不知道大家发现没有,随着技能工具的增多,我们现在的设计形式越来越多元化了,但如果非要我推荐一项最通用的设计技能的话,我想非手绘莫属了,因为无论是修图/摄影/合成/玩C4D/做设计等,最终都是需要用到一些手绘。

无论何种手绘风格何种形式,都要与创意和需求结合后做出来的设计才有灵魂,这样才能打动人心获得更多商业价值,要不然只是一具空壳而已。

1.  那手绘的优势是什么呢?

有这么几个方面:

富有创意:就是可以创造出任何你想要表达的东西,比如场景/人物/情节/氛围等

节省时间:别人找个想要的素材需要花很多时间还不一定能找到,即使找到了也有可能会面临版权问题以及风格不匹配的问题,

趣味亲和力:网购大军里年轻女性是占多数的,那这些女孩子们怎么可能拒绝得了萌萌哒或浪漫诱惑呢?所以你才会看到电商设计里时常会运用到手绘,因为手绘常常会给人一种或可爱或梦幻的感觉呀,你心情愉悦了掏钱的时候自然会更爽快嘛。

救急互补:有些需求方可能会提出一些特殊要求或者现有的素材不太给力或有缺陷但又不得不用的时候怎么办呢?用手绘来搞定呀,比如产品看起来太不美观了,手绘修一下;模特缺胳膊少腿了,用手绘修补一下;比如运营非要你摘个天上的月亮给他,那你就给他画一个啊(微笑)。

2.  什么品类/主题/节日喜欢使用手绘呢?

品类:母婴个护/美妆护肤/服饰鞋包/吃喝玩乐等等主要为了笼络女性及儿童用户群体的品类,都比较喜欢用手绘类型的页面设计,当然,现在越来越多的些小鲜肉也开始卖萌或追求小浪漫了。

不知道大家有没有发现一个现象。。就是现在男人女人的特征喜好其实越来越差异不大了,很多男的也爱卖萌/化妆/护肤(可能也会整容之类的),长相穿着打扮比女人还好看,比如现在火的一塌糊涂的几位小鲜肉们

反倒是很多女的开始从发型和穿着方面表现出自己比较潇洒帅气的一面,说话也特别爷们儿,总之,性别已经越来越不是事儿啦,大家都可以按自己的喜好去表达自己。

主题:不管你是啥品类,在电商页面设计里,如果你的主题是走搞怪/卡哇伊可爱/炫酷/颓废/怀旧等路线的的话(恐怖画面除外,毕竟电商页面主要是为卖货目的而设计的嘛),基本都会需要用到手绘了,无论是全手绘还是半手绘(虚实结合的形式)。

节日:运用手绘最多的节日要数儿童节/中秋节/清明节/端午节/春节之类的了,儿童节是因为主要群体受众也是儿童和女孩子,而中秋节/清明节/端午节/春节是因为这些节日普遍都是中国古代流传下来的传统节日,这也决定了他会带有一些传说或神话因素情节在里面,而这些放在现代来说是需要想象力去表现的,手绘的形式正好满足了这种需要。

3.  手绘常用的元素和场景有哪些呢?(灵感来源)

也正是因为手绘的形式常运用于我们前面提到的一些品类/主题/节日里,结合那些品类和节日的特征,所以通过理解文案内容/产品的相关特性/风格选择/当前时间段是否属于节日等综合因素考虑,我们就能够获取到非常多的灵感,下面我给大家举例说一下咯~

(1)以护肤品举例:

护肤品是让我们变得更年轻更美的东西,所以我们常常会联想到什么呢?会联想到一切温馨美好的事物和人,比如胖嘟嘟的云朵/五颜六色的花儿/乖巧的小动物/参差不齐的树木/甜甜的美少女/小溪水滴等,因为这些事物构建成的场景画面时常会给我们一种重回少女时代般的感觉。

(2)以卡哇伊主题举例:

说到卡哇咿,我第一反应就是想到了韩国和日本的设计,他们特别善于利用一些小图形小元素制造氛围,瞬间营造出一种萌萌哒的画面感。

(3)以春节举例:

说到春节你会联想到什么呢?也许你会联想到一群小孩放鞭炮/贴对联挂红灯笼/一家人热热闹闹吃年夜饭/逛集市采购年货等等各种喜庆热闹温馨的场景,但是,这里面涉及到的道具和人物都太多了,你如果去玩合成,估计找到合适角度/风格的素材都很难,玩C4D和摄影工作量也是相当大,最省力的方式也许就还是手绘了,你想要什么样的场景和人物都给你迅速画出来(这是指对有绘画功底的人来说)。

4.  手绘在设计中的运用及注意事项

(1)全手绘和半手绘

从手绘占比的角度,我们可以将手绘类型的页面设计分为全手绘的和半手绘的,全手绘的比如这些:

△  作品来自草木之心和韩束,手绘页面设计的非常漂亮

但全手绘也有一些局限性,有时也许会显得有点低龄化或风格局限,所以我们也时常会采用半手绘的形式,比如手绘搭配着摄影/diy/合成/建模等形式来做,这种形式既可以很活泼俏皮,也可以很时尚,基本适用于任何人任何品牌,即便是一些大牌也可以用,而且相对于全手绘来说,它也更省时省力一些,所以运用的范围也更加广泛:

△  圣保罗艺术家Ana Strumpf与时尚杂志合作的封面设计

(2)手绘的构图形式

其实无论是不是手绘页面,构图形式无非就是下面这几种基本构图形式以及它们的组合运用:

S形:

梯子形通栏:

非通栏(头部Banner与背景为一体,楼层豆腐块状):

非通栏(头部Banner与背景为一体,楼层呈长条状):

分栏形:

但对于手绘的页面来说,以下这些设计方式及特点是只有它才拥有的,比如借助手绘搭建一个场景,场景里有小路/小溪/或藤蔓等刚好化作楼层来放置商品,使得头部Banner与楼层部分融为一体,整体看起来非常流畅:

即便是不搭建场景,仅仅只是利用页面里的某一个人物或物件的某一个部位,比如树干/树枝树干树根/人的头发/人的裙子/云朵/钱袋/彩带等,也可以放置商品啊:

另外要说明的是,无论是不是手绘页面,其实构图与我们以前讲的所有类型的页面都没有什么区别,因为你把这些手绘元素当作点缀好啦,我之前写的一篇关于点缀元素运用的文章,大家也可以看看:

Banner设计终极宝典!6招搞定点缀元素的运用!

(4)手绘的质感风格

看到这里,不知道大家发现没有,其实根据不同的需要,不同手法/维度/色彩明度/色彩饱和度等的手绘设计给人的感觉是大不一样的,举例给大家看下:

简笔画:

简笔画搭配模特或产品,非常俏皮

扁平+柔和线条+低饱和度,给人一种怀旧的感觉:

轻质感+低饱和+高明度,给人一种明媚又复古的感觉:

轻质感+低明度+低饱和度,再加上一些现代化的元素,比如灯带/电子设备后,就有一点混搭的感觉了:

扁平+硬朗线条+高明度+高饱和度,显得年轻又现代:

轻质感+柔和线条+高明度+高饱和度,显得可爱萌萌达哒:

扁平+多彩:


加上光影质感后,趣味感更加强烈:

扁平轻质感:

轻质感手绘+人物后,虚实结合显得更加有新意:

扁平+卡通形象绘制:

如果加上光影质感后,就更加有代入感了:

二位平面化:

转化到三维空间层面后,也会显得更加真实有代入感:

以上我先给大家看这么多,其他还有很多对比效果大家可以自行去总结发现,总之,从不同手法/维度/色彩明度/色彩饱和度等很多方面都可以自由创作出N种不同的效果,从而满足不同的设计需要。

(5)注意事项

首先是整体的手绘风格要与主题要求的气质保持一致,再其次,页面的元素与元素之间风格要保持一致。

比如下面这2种手绘页面,无论是色彩明度/饱和度/空间层次/气质/质感等都是完全不一样的,他们之间的元素也就无法互换或混合使用:

VS

而下面这2种却可以(因为气质相符啊),你们可以感受下:

5.  各国手绘页面欣赏

我们可以一起来看下韩国/日本/中国这些不同国家的手绘页面分别有啥不同点。

韩国的手绘页面,多是这种,特别善于添加一些用于点缀的手绘元素,显得特别俏皮可爱:

日本的手绘页面,要么非常小清新,要么很重口味热血或搞怪:

也可以很卡哇伊:

非亚洲国家的一些手绘页面,要么明亮/简约/时尚:

要么带点英伦风的感觉咯:

当然他们有时也特别脑洞大开,甚至觉得怪异:

至于中国的一些手绘页面设计,我感觉好像有千万种可能诶。。。大概是因为中国文化博大精深的缘故吧。。。好像没有什么不可能的:

太多太多了,我就不一一举例了,总之没有你想不到手绘风格或形式的就对了。。。现在不是流行借鉴/跨界/混搭吗,大家也可以试试,哈哈~

总结

其实不知道大家发现没有,随着互联网的普及,这也导致方便了人与人之间/文化与文化之间的的传播交流,世界各地的设计风格都在互相影响和借鉴着,古代传统与现代的结合,国外和国内的结合等,人与人思想之间的差异也碰撞出了各种火花,从而创造了各种可能,使得我们的设计越来越多元化了没那么局限了,往往局限我们思维的是我们自己而已。

不管怎么样呢,一张手绘页面体现的是设计师的文化储备+想象力+手绘执行力+色彩构成+平面构成+营销定位等等各种知识把握能力的综合体现,还蛮考究功力的,反正要学的东西还很多哇。

以上我今天的分享就到这里咯,大家学到了吗?这里是《做设计的面条》,我们下期再见!~

(以上部分作品来源于花瓣,如果设计师本人看到这篇文章请跟我联系哦,因为引用了你们的优秀作品做案例讲解,所以我很愿   意为你们署名,如果你们愿意的话,感谢。)

微信公众号简介:专注开拓电商设计思维,不定期分享一些个人见解干货,当然也会分享一些顶级创意、摄影、人生感悟方面的好文啦。

欢迎关注小婷姐的微信公众号「TTTink-D」,一个干货与文笔俱佳的美女设计师:

小婷姐的电商设计系列好文:

  1. 《新人手册!聊聊关于电商设计的那些事儿》
  2. 《前辈经验!聊聊新人设计师最容易遇到的12个问题》
  3. 《不怕没灵感了!SALE 招牌的9种排版设计方法归纳(附案例)》
  4. 《如何辨别一个BANNER的好坏?(附案例)》
  5. 《电商干货!BANNER图设计之商品图该怎么玩(上集)》
  6. 《电商干货!BANNER图设计之商品图该怎么玩(下集)》
  7. 《感觉技不如人?聊聊设计师该如何正确认知自己的价值》
  8. 《超长干货!平台电商设计师vs店铺电商设计师哪个好?》
  9. 《职场进阶术!哪些性格特质有助于设计师的成长和提升?》
  10. 《设计师项目做到一半总是想要放弃怎么办?(附问答合集)》
  11. 《超实用!从人性的角度揭露电商BANNER图设计背后的秘密》



【优设网 原创文章 投稿邮箱:yuan@uisdc.com】

================关于优设网================
“优设网uisdc.com“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/
设计微博:拥有粉丝量200万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:http://www.uisdc.com/sketch-subject-page-100-ways

界面设计 HTML5 素材 交互设计师 好文 UI 用户体验设计 转场动效 设计师专访 设计师 排版布局 扁平化设计 设计规范 素材下载 视觉设计 职场 产品设计 设计趋势 配色 web前端开发 海报设计 AI教程 字体下载 设计理论 动效设计 神器下载 图标设计 psd下载 logo设计 神器推荐 ICON 职场规划 App设计 酷站推荐 字体设计 交互设计 ui设计 用户体验 设计师职场 优秀网页设计 酷站 ps技巧 PS教程 网页设计 经验分享
wechat

优设官方微信

50万设计师关注

微信号:youshege

把好文章收藏到微信

打开微信,扫码分享
学设计 优设网 在这里