南部商务区的一件产品也能拍!
手机:18958279518, QQ:279247780
天气
平面设计 样本画册 包装设计 海报招贴 传单折页 Logo标志 名片设计 PPT设计 活动展览 其他设计 广告制作
 
    视觉艺术  /  News
5分钟学会制作轻质感3D图标
发布时间:[2020-10-21]    点击:

对于授课、写文章、写教程等行为,很关键的一点是同理心,传者需要明白听着想要什么,而我最了解谁呢?当然是从前的我!

由此脑中突然灵关一现,如果刚毕业的我遇到现在的我会发生什么事情?“他”一定会有很多问题,比如和大学时的女朋友有没有成啊,现在一个月赚多少钱啊,当然少不了专业上的问题,毕竟我是个爱学习的好孩子。

所以接下来,我就以“2014年的菜心”和“2019年的菜心”之间的对话,来分享一点干货。

去年年底在做项目时沉淀下来下面这套图标设计:

5分钟学会制作轻质感3D图标

14年的菜心问我怎么做的,今天就来和他分享下制作方法和思路。

[SITESERVER_PAGE]

1.软件

14年菜心:大哥,你这套图标用什么软件做的啊?

19年菜心:ps为主,c4d为辅。

2.造型

14年菜心:大哥,这样立体的造型我该如何下手

19年菜心:其实并不难,基本就是主形象加个厚度,可以采用平行视图的透视关系,也就是2.5d的设计风格,经常用到的辅助线如下:

[SITESERVER_PAGE]

5分钟学会制作轻质感3D图标

但我这次没有严格按照这个辅助线来走,但是方向还是会尽量保持统一,不然会很乱。

如果有些透视关系找不准,我会用c4d简单的建个模,看下规律,然后再用ps钢笔画出每个面,例如:

5分钟学会制作轻质感3D图标

这一步主要就是看看每个面的交错关系,然后找到自己想要的角度画出来。

[SITESERVER_PAGE]

当然,如果你c4d渲染特别6,直接渲染然后ps微调即可,如果不熟练的话,可以用ps钢笔画,然后再加颜色和质感。本次教程也主要是用ps画。

3.色彩与质感

14年菜心:对于图标的色彩有什么可以传授给我的吗,我的配色能力好差。

19年菜心:我之前有写过一些关于配色的野路子,有兴趣可以去我公众号看下。

最开始我在c4d里面渲染出来的效果是这样的:

5分钟学会制作轻质感3D图标

[SITESERVER_PAGE]

由于材质和光都没调高,所以导致颜色有点脏且不透气:

5分钟学会制作轻质感3D图标

颜色脏主要是因为本身固有色就很脏很重,而不够透气主要原因就在于高光、暗部、环境色这些东西没有用好,或者丢失了一些细节。

首先填充固有色,由于风格是轻质感,所以颜色不会用的太重,在色板上的区域都集中在这一块:

5分钟学会制作轻质感3D图标

[SITESERVER_PAGE]

填充后效果如下:

5分钟学会制作轻质感3D图标

只要颜色你能保证足够轻量,填充固有色后,大体效果就不会太差。

接下来为了让色彩更加透气,我们需要加些明暗关系,光源假设是左上方,那左上角就是亮部,右下角就是暗部,效果如下:

5分钟学会制作轻质感3D图标

[SITESERVER_PAGE]

其实简单来说,就是以光源为出发点,每个面都拉一个由浅变深的渐变。

明暗渐变有了之后,就开始加环境光,我融入的环境光是白色偏蓝,这一步操作方式有很多,比如图层样式的内发光,我经常用的方法就是,把环境光的颜色画出来,然后进行羽化,然后置入固有色的图层中,效果如下:

5分钟学会制作轻质感3D图标

最后一步就是加一些细节,比如转折出的高光:

5分钟学会制作轻质感3D图标

[SITESERVER_PAGE]

有些金属材质的镜面反光等等:

5分钟学会制作轻质感3D图标

这些都是点睛之笔,很重要。

这样,基本上一个图标也就差不多完成了。

4 细节

14年菜心:真厉害,还有什么细节值得注意的吗,大哥

[SITESERVER_PAGE]

19年菜心:我觉得很重要的一步就是,暗部颜色千万不要用“禁区色”,这个知识点我有讲过很多次,比如下面这个铃铛暗部颜色用到了“禁区色”:

5分钟学会制作轻质感3D图标

调整颜色区域:

5分钟学会制作轻质感3D图标

效果如下:

[SITESERVER_PAGE]

5分钟学会制作轻质感3D图标

关于“禁区”这个知识点,可以看之前的文章:《我的配色野路子(升级篇)

这是让颜色通透很重要的一步,大家千万切记。

前期在摸索的时候,每个图标都有做很多个版本:

[SITESERVER_PAGE]

5分钟学会制作轻质感3D图标

5分钟学会制作轻质感3D图标

5分钟学会制作轻质感3D图标

做多了,自然也就熟能生巧了,如果大家有兴趣,可以自己做做练习,然后后台发我看看你的练习,我有时间会尽量回复大家。

[SITESERVER_PAGE]

19年菜心:还有啥问题吗?小老弟。

14年菜心:暂时没有了,有问题我再请教你,咱这关系,肯定常联系,谢谢哥。

好了,以上就是本期教程啦,还等什么,练起来吧!

最后感谢在制作过程中,tina姐给的一些建议和指导,嘿嘿。

原文地址: 菜心设计铺(公众号)

作者:菜心设计铺

[SITESERVER_PAGE]


关键字:3d按钮设计 平面设计
0
 
友情链接  
宁波样本画册设计公司 | 家居好生活 | 宁波模特经纪公司 | 宁波亚马逊拍照 | 宁波短视频制作 | 宁波品牌策划设计公司 | 鄞州广告公司 | 淘宝页面设计 | 宁波包装设计 | 宁波淘宝拍照 | 宁波SEO网络优化推广 | 宁波VI设计公司 | 宁波鄞州南部商务区广告公司 | 宁波产品拍照 | 宁波广告公司 | 宁波样本设计 |
电话:0574-83035936    地址:宁波市鄞州南部商务区泰康中路456号博纳大厦604b    网站管理    网站地图

Copyright 2009-2020 宁波市鄞州甬邦广告有限公司 浙ICP备10212616号
www.cggtcc.com www.anvisi.com www.bivvie.com www.lyncin.com www.fitwix.com www.ptnllc.com www.stdllc.com www.satcjo.com www.kisuze.com www.jabov.com www.du301.com www.graash.com www.jibjaw.com www.aanbio.com www.laktec.com www.gsknsk.com www.bhootu.com www.rimoms.com www.daumes.com www.fzzllx.com www.osteod.com www.liondl.com www.rhawes.com www.irlidl.com www.rmocon.com www.ogdiaz.com www.jalebs.com www.bdaywx.com www.takdar.com www.dqsouq.com www.oaytm.com www.khgtv.com www.ccehr.com www.wamctv.com www.ceooec.com www.suzanr.com www.ijnbhu.com www.mgtsvc.com www.manguz.com www.nozoai.com www.gigaja.com www.sxagaa.com www.spodik.com www.speser.com www.sundoq.com www.steekt.com www.luvabi.com www.fasilm.com www.qcaddy.com www.vnextg.com www.wouvip.com www.theumo.com www.saptro.com www.gavvel.com www.gemoot.com www.kavinc.com www.dlexa.com www.twdep.com www.spmie.com www.maalm.com www.iksyt.com www.szhyjh.com www.pzapt.com www.intfo.com www.gyhcbg.com www.ymhzs.com www.gvcte.com www.feedmu.com www.psldc.com www.ewlsen.com www.repdst.com www.ozirap.com www.jkrap.com www.sdchenfeng.com www.gyzhao.com www.dgmxcj.com www.zyrszyc.com www.wuyu1001.com www.iosof.com www.tblook.com www.mz131.com www.ipad90.com www.whgqfdc.com www.sdgua.com www.zzdfkj.com www.zgdxsw.com www.zzwhjf.cn www.ntbnw.com www.chinadsdne.com www.chinasanlu.com www.china-peijing.com www.ls-chinawater.com www.bs0816.com www.jianzaokaoshi.com www.zxdwj.net www.china-1979.com www.daikin-chinese.com www.cybxcm.com www.23hk.net www.chinaxunbao.com www.wrygs.com www.ree411.com www.j-healthy.com www.cding.net www.zq9777.com www.china-btrip.com www.chinaisheng.com www.hippic.cn www.czlccl.com www.hb8579.com www.efxva.com www.fdlife.net www.chinadrtvhot.com www.china-heitao.com www.chinazhizhu.com www.0512baixing.com www.puggree.com www.mkmkus.com www.xmshrx.com www.cit163.com www.njzhengtai.com www.china-zeming.com www.chinayaozhou.com www.chinascair.com www.sapsago.com www.apodous.com www.sdlhhx.com www.21hrr.com www.cs-glkt.com www.ah-12530.com www.carysins.net www.mallserve.net www.astchina2008.com www.fxcbschina.com www.chinarbsic.com www.chinafuseman.com www.china-westtpe.com www.whznet.com www.123well.cn www.824365.cn www.365drink.cn www.mosker.cn www.havre.cn www.pulverable.com www.ascosporic.com www.antibaryon.com www.achromycin.com www.acerbating.com www.hdqctg.com www.etfip.com www.3wflz.com www.iphone6fix.com www.fscailong.net www.china-zhao.com www.chinasmb2b.com www.chinaunify.com www.chinanaobing.com www.chinagoipo.com www.china-cfjj.com www.jjhcsj.com www.liuhe1001.com www.123song.cn www.chanhuilu.cn www.123spot.cn www.00book.cn www.hghospital.cn www.year12.cn www.school12.cn www.business12.cn www.sure123.cn www.today123.cn www.only123.cn www.guest123.cn www.education123.cn www.case123.cn www.but123.cn www.liuhe1000.com www.123one.cn www.123match.cn www.watcha.cn www.658365.cn www.565365.cn www.wind365.cn www.single365.cn www.du303.com www.war365.cn www.woman365.cn www.listen365.cn www.down365.cn www.365mark.cn www.365be.cn www.365cool.cn www.365sen.cn www.365ling.cn www.365tong.cn www.scruting.cn www.brickfielder.cn www.fortunebook.cn www.exceedingly.cn www.exanimation.cn www.dehortation.cn www.dactylogram.cn www.lubricator.cn www.hydropathy.cn www.breastbone.cn www.animatedly.cn www.aeronautic.cn www.furrier.cn www.foliole.cn www.downsun.cn www.comecon.cn www.brusque.cn www.bottine.cn www.spezia.cn www.nullah.cn www.dither.cn www.jiatei.cn www.ringwu.cn www.verneuk.com www.volutin.com www.russety.com www.neotene.com www.pergana.com www.isogony.com www.pairage.com www.munnion.com www.monacid.com www.ordinee.com www.lochial.com www.morassy.com www.ninogan.com www.podalic.com www.oquassa.com www.lumpily.com www.lemnian.com www.muscoid.com www.cirsoid.com www.conchae.com www.ericoid.com www.cleruch.com www.akinete.com www.adenase.com www.unicostate.com www.supraoptic.com www.teacherage.com www.waterblink.com www.scotticism.com www.shovelbill.com www.pinnatiped.com www.russenorsk.com www.pulverator.com www.peroxidate.com www.pasteurism.com www.psikhushka.com www.pentastich.com www.indigotine.com www.infusorian.com www.heliophyte.com www.goloptious.com www.gramophile.com www.autolyzate.com www.cerography.com www.dunderpate.com www.constantsa.com www.contortive.com www.conclavist.com www.contraprop.com www.annalistic.com www.amerciable.com www.aerenchyma.com www.antitrades.com www.carrolline.com www.ambulacral.com www.antechapel.com www.ringchen.com www.aeciospore.com www.aesthetism.com www.amaigamate.com www.1hag.com www.4xns.com www.xztnbg.com www.cocrun.com www.shalijianzhi.com www.ctfzjx.com www.yog0.com www.ieww87.com www.xatffy.com www.xfckyq.com www.lyisme.com www.mryhua.com www.ettbs.com www.xjweiy.com www.dan312.com www.greefw-hz.com www.kingsoftdown.com www.smtqy.net www.fswajc.net www.imac-china.com www.51chinamarks.com www.chuchenchina.com www.chinazhuizhai.com www.chinamitfahren.com www.chinagaoer.com www.chinaartcs.com www.china-shjp.com www.china-hkwood.com www.acresso-china.com www.chinapcschool.com www.qqwangming98.com www.liuhe1003.com www.subsequent.cn www.bonesetting.cn www.angiotensin.cn www.clockmaker.cn www.ozonesonde.com www.lomoren.com www.26pfw.com www.tneoz.com www.china-baike.com www.gunilasi-china.com www.flash-video-soft.com www.lingxianmedia.com www.piaoliangmeimei.com www.nojiw.com www.aryafarmand.com www.jianfeipaihangbang.net www.betamethasone.cn www.rtzltf.com www.roadtone.net www.sohocash.com www.winnersz.com.cn www.nhcaesar.com www.chem-fine.cn www.oa274.com www.wxhh169.com www.tubing-pump.com www.wjkqpt.com www.myecoin.net www.jxxywang.com www.zqwybj.net www.lfhywz.com www.hxgifts.com www.hc1z.com www.cxw009.com www.guitarriffin.com www.hmsccm.com www.ahlidu.com www.dlxhdq.com www.hbnj2000.com www.klf999.com www.yznank.com www.papillonswimwear.com www.diklat-bimtek-p3otda.com www.wrestlinganddancing.com www.xinchangjinrong.com www.rusha.com.cn www.codeimba.com www.400so.com www.daoyh.com www.weidixinxi.com www.pwnagetool.net www.edbestmeds.com www.hulwo.com www.szxjzs.com www.szjiankeji.com www.maoshan2009.com www.sxdsrc.com www.900ms.com www.peanutoilmachine.com www.dfzgw.com www.rachelrenaemua.com www.enlightinc.com www.a2la2.net www.vinsonaudio.com www.fjjx168.com www.zbzsinfo.com www.tenshowchina.com www.tango-ocean.com www.lanbowang.net www.myvietnamtravel.net www.skullmp3-download.com www.heartoftheworldtours.com www.kobikalkinmamerkezi.com www.globaleducationresources.com www.itsgreektomeofbozeman.com www.wakatobiimigrasi.com www.santaynezweddingguide.com www.computingatscale.com www.thaoduocnamvietnam.com www.wallycatspersians.com www.nplusplusstudios.com www.guangshashangcheng.cn www.xiulindouzhipin.com www.dvd-tool.com www.nj-qingyan.com www.cd-yuxing.com www.mylch.com.cn www.muti-media.cn www.jinyuanjm.com.cn www.facegear.com.cn www.chaotianjiao.com.cn www.congyang.com.cn www.sichuanluntan.cn www.liaoningluntan.cn www.jiaochou.com.cn www.luanhai.com.cn www.ya-xing.cn www.64ac.com www.thelettersfromthekitchen.com