美文网首页UX、UI和UE
从购物图标的变化看图标发展趋势(附土豪金版购物图标教程)

从购物图标的变化看图标发展趋势(附土豪金版购物图标教程)

作者: 泱泱悲秋 | 来源:发表于2017-01-02 16:10 被阅读39次

    先比较一下下面两个购物图标

    上面的是购物袋样式,下面的是购物车样式,有没有选下面的,认为下面这种好看的。

    恭喜你,眼光还停留在10年前,这不是复古风,这是被时代抛弃的节奏(或者是粉色萝莉控?原谅我不懂)。

    好吧,我承认我在做图标时偏心了,第一个好赖还做了点效果,第二个直接用ps自带性状,一个字,丑,而且效果也只加了个投影和高光。

    好了,废话不说,上教程,直接说第一个的做法。

    首先是底色块,土豪金,不解释,我就是那么赤裸裸的喜欢,就是这么任性。照例,上浅下深的渐变叠加,加2px高光,加15px的投影。

    内陷圆圈效果,上深下浅的渐变(就是上面倒过来的效果),内阴影15px,深色,投影2px,浅色。

    再叠加一层圆,再倒过来,上浅下深。投影,高光。

    加两个圆孔。

    加手提带。步骤如下:圆形-圆形,得到圆环,用矩形去减,得到半圆,再用两个小圆补上切面。

    复制一层,调节锚点和手柄,羽化,做阴影效果,然后加蒙版,擦去(黑色画笔去涂抹)中间部分。

    手工。华丽的手提袋版购物图标出炉,看官,有没有购物的冲动?

    插播一条

    手提带子的立体感忘记做了

    很简单,复制一层,上层做内阴影+浅色内发光+深色投影

    然后填充改成0

    栅格化之后用柔性橡皮擦擦掉与两个小圆的切点部位。

    好了,完美。

    相关文章

      网友评论

      本文标题:从购物图标的变化看图标发展趋势(附土豪金版购物图标教程)

      本文链接:https://www.haomeiwen.com/subject/bbbwvttx.html