教程·手绘（UI设计） | 手机图标UI设计手绘方法

UI设计指对软件的人机交互、操作逻辑以及界面美观性的整体设计，要达到便于搜索识别、提高工作效率，便于记忆与回想，以及节约屏幕空间的目的。但软件只是完成创意的一个工具，做好设计师应该从手绘开始，本篇将为大家介绍APP图标UI设计手绘效果图的表现技法与步骤。

前期准备

设计原则

· 易于识别

· 合适的图标惯例

· 合理的隐喻

· 联系上下文

· 差异性

初期考虑

· 图标适用于什么电子设备

· 图标适用于什么风格

· 其他方面的设计要求

注意事项

· 要遵循数学规范，确保比例尺寸准确

· 谨慎使用细节和装饰

· 学习优秀设计，创新出个性风格

· 利用网格提高图标的一致性

简单的图形设计

在初步设计阶段，可从简单的圆形、正方形等图形开始设计。花、草、字母等都是适合初步设计的简单元素，且手稿不用特别精致，如下图所示。

更多精彩图片 请登录

详细步骤

本篇教程使用彩铅颜色的色卡如下图。

更多精彩图片 请登录

Step 01用直线画出正方形，并对4个角进行圆角处理。

更多精彩图片 请登录

Step 02根据比例关系，用2B铅笔画出木头材质图标的内部结构。

更多精彩图片 请登录

Step 03添加局部细节，进一步完善线稿。注意把握好层次感，线条的叠压关系要准确。

更多精彩图片 请登录

Step 04用409号彩铅铺第一遍颜色，画出木材的基本色。

更多精彩图片 请登录

Step 05用414号彩铅、478号彩铅加深暗部，加强颜色明暗对比关系，凸显体积感。

更多精彩图片 请登录

Step 06用499号彩铅、459号彩铅、466号彩铅、495号彩铅、476号彩铅刻画棋子、植物等剩余部分的颜色。

更多精彩图片 请登录

Step 07用478号彩铅刻画木头材质的肌理效果，注意线条不要画得过重，要有虚实对比。调整画面，完成绘制。

更多精彩图片 请登录

TIPS

更多精彩图片 请登录

在绘制时，无论形体大小都要时刻注意画面的明暗对比关系。上图为木头材质图标设计手绘局部细节刻画放大图。

更多精彩图片 请登录