如何从零开始学习图标设计

发布网友 发布时间：2022-04-22 06:17

我来回答

共4个回答

懂视网 时间：2022-05-11 23:14

总结过去的学习经验，建议大家边观察边思考，观察整体与细节的处理，思考为什么这样做，如找到更好适合自己的实现方法，不妨去尝试做出来，这样才能更有效助你提高

最终效果



1、构图造型：

先用钢笔工具，画出一个杯子的大概外轮廓，调好各部位的固有色。



2、明暗关系：

重点处理杯子的明暗关系及抹茶与气泡的刻画，目的让物体立体起来，同时表现出抹茶与气泡的材质，让自己找到感觉，这点很重要。



技巧提示：教程里大部分使用了蒙版+画笔（硬度为0）去刻画物体明暗及细节过渡。



3、细节深入：

整体细致刻画，深入纹理、波纹、气泡、高光。



纹理处理技巧：把原来的抹茶液体及气泡的图形路径转为位图，然后在滤镜菜单里选择添加杂色，参数如下。目的让视觉表现效果更为丰富，磨砂的表面也正符合抹茶的材质表现。



波纹技巧处理：使用模糊滤镜+蒙版+画笔的组合，是我在刻画拟物图标中纹理及明暗面的常用技巧套装。波纹技巧处理也不例外，如下：



气泡处理技巧：气泡的效果主要用图层样式的内阴影和外发光，然后采用或居或散，或大或小，或深或浅等不规则摆放，表现得更为丰富。



高光处理技巧：高光与波纹处理方法一样，最后提炼高光，马上感觉整体效果突现出来。



小结：如果大家有疑惑，就拿源文件去分解吧，点这里下载源文件。



最终效果：

热心网友 时间：2022-05-11 20:22

想要学习图标的制作，需要学习图标设计的方法以及工具，那小小的图标其实中间应该包含了很多设计知识。一组的图标需要满足产品特点和风格，而且需要有辨识性，整体需要保持统一有需要有稍许区别，让人能够看到图标就能够了解点击图标后的功能。

图片来源：阿多比设计学院学生作品

一、设计图标的工具

可以设计图标的工具很多，我们选择PS和AI，去学习一下这两款设计工具如何使用。

1、PhotoShop

如果是初次接触PS，那我们需要了解PS的基础用法，所以下面我们会从PS界面，基本设置，新建文件，视图操作、保存，导出，移动工具去带大家一步步了解PS。让大家能够熟悉PS工具在平面设计中的常用功能及具体用法，能够使用PS进行基本的图片处理。

打开PS工具，简单了解界面的组成部分以及工具的作用。 然后再去了解PS常用功能及具体用法，比如图层关系及应用、填色、魔棒抠图、选区和复制、锁套和羽化、去污点工具、修补工具、液化效果 、实战、文字（字符和段落）、形状裁剪、变形。

当了解PS基础功能后，需要进一步了解图层关系、抠图、钢笔工具，橡皮工具，吸管工具，画笔工具等常用工具、蒙版、滤镜，从而熟悉图层样式，具备版式排版应用、海报合成设计的能力。色阶、对比度、曲、色相饱和度、色相平衡、调色融合案例、剪切蒙版、混合模式、图层样式 1 、图层样式2、滤镜效果。

2、AI

工具的使用最好的方法不是给出大段的文字描述，介绍每个功能，而是找具体的实例去操作，从实例的操作去学习该软件的功能。我们通过以下几个实例去简单讲讲AI的使用方法，了解AI的基本操作、AI复制、旋转、转换矢量图、AI的分割、剪切蒙版、平滑、扩展、AI路径文字、效果、形状生成器、AI渐变、立体字、AI二方连续、四方连续等。从而达到熟练结合应用PS和AI工具对素材进行处理，根据要求完成3D效果、混合效果等各种特殊效果的设计。

二、制作图标的视频教程

掌握了设计工具，那我们来简单分享几个不同风格的图标，去看看这些风格的图标应该如何制作呢？

1、剪影图标

剪影图标大多数是单色表现，当然也有双色图标。剪影图标简洁大方、高度提炼出图标的意义，能够通过最简单的线条的表现出该图标代表的作用。看似简单的剪影图标，其实考验了设计者对于产品需求的高度提炼，突出理性与感性在功能传达上的逻辑思维。

2、扁平图标

扁平化设计风格在APP的设计中常常都能看到，那图标也不例外。所以学习扁平化的设计风格有很高的通用性，在平时设计工作中也会经常遇到。那扁平化风格其实是从iphone开始流行起来，其特点就是所有元素的边界都干净利落，没有特效、没有过多的装饰效果，组成元素简单，能够直观的传达信息。

3、临摹图标

都说学习图标设计最好的方式是先临摹，那我们选择毛线图标、毛球图标和播放器图标去看看，这类的图标是如何设计出来的呢。

毛线图标和毛球图标是两种图标的表现形式，毛线型的图标绘会将毛线针织的一针一线体现在设计中，有中温暖和温馨的感觉。如果毛线的质感运用得恰当，会让设计出彩，那毛球图标也是一样。虽然这类的图标实用性较小，但是了解一下增加一下自己的设计知识储备。

4、拟物图标

虽然现在大多数应用都是扁平化发展，但是流行是个圈，拟物化风格又在悄悄开始流行起来了。想必UI设计师们都能感受到“新拟物风格”这股风现在刮的多么凶猛了。那我们通过拟物话筒图标、拟物篮球图标、拟物伞、水滴图标、拟物甜甜圈图标的学习去紧跟这个流行趋势吧。

三、图标网站

学习的过程汇总需要大量的临摹素材或者是灵感来源，在这里分享几个图标类的网站。

1、阿里巴巴矢量图标库：国内功能很强大且图标内容很丰富的矢量图标库,提供矢量图标下载、在线存储、格式转换等功能。

图片来源：阿里巴巴矢量图标库

2、IconStore：是一个提供一流的免费图标包素材的站点,汇集了很多优质的icon素材。

图片来源：IconStore

3、Flaticon：图标设计丰富。

图片来源：Flaction

4、Material Design Icons：包含常用的图标，如用于媒体播放、通讯、内容编辑、连接等等。

图片来源：Material Design Icon

5、Logo Maker

图片来源：Logo Maker

除了以上图标设计网站，优秀的图标设计网站还有icons8、iOS 11 Icon Pack、Icons Mind、IconStore、iconfinder、Icons | Font Awesome、徽标实验室 - 测试您的徽标、标志情报局 - 全球LOGO新闻和品牌设计趋势权威媒体(LOGONEWS)、Simple Icons等。

图片来源：阿多比设计学院学员作品

设计图标，获取灵感最快的方式还是手绘，所有图标的初稿可能都来源于图纸，再通过电脑制作反复打磨出符合产品特色的终版图标。想要做出完美的图标实际还是很困难的，这不仅需要设计的经验还需要很高的图形处理能力、想象力和逻辑思维。

图标是人机交互的重要组成部分，它具有高度的视觉化和形象化等特征，就是说图标设计师用设计的图标去抽取表达产品的功能、动作的寓意以及实现。因此，它承载着向用户传递交互信息的任务，促使用户正确认知从而实现正确的操作。所以小小的图标背后有大大任务，希望以上图标学习的内容能够带你了解入门图标设计，也希望你在今后的工作中能够设计出优秀的图标。

热心网友 时间：2022-05-11 21:40

零基础学习UI界面设计的话，选择上课系统学习是比较不错的，这样能整体的把UI界面设计学完整，在选择时，多方面了解再决定，如课程安排、就业、环境、教学等，都是需要了解考察的。

热心网友 时间：2022-05-11 23:14

[ UIDesigner1.0(原型设计利器) ]
[ Axialis IconWorkshop(图标编辑设计) ]
[ AAA Logo3.1.0(aaalogo)(Logo设计) ]
[ Fresh UI(系统配置优化)V8.76多国语言版 ]
DirectUIBuilder skin++