专栏名称: 微交互
分享交互经验,提升产品用户体验。帮助您打造优秀产品。细节设计成就卓越产品。
目录
相关文章推荐
北京LOOK  ·  好多新展!年末必看好展推荐 | 北京LOOK ·  2 天前  
北京LOOK  ·  好多新展!年末必看好展推荐 | 北京LOOK ·  2 天前  
手艺门  ·  雅致非凡!一缕馨香梦回千年 ·  4 天前  
手艺门  ·  雅致非凡!一缕馨香梦回千年 ·  4 天前  
ZaomeDesign  ·  每日灵感丨十二月十一日 ·  4 天前  
庞门正道  ·  每个人都是个动物~ ·  1 周前  
庞门正道  ·  点进来,保证你眼花缭乱! ·  1 周前  
51好读  ›  专栏  ›  微交互

手机界面小图标,怎么设计才符合甲方爸爸的喜好?

微交互  · 公众号  · 设计  · 2017-06-23 08:02

正文



几乎每隔一个月的样子,我都要去手机主题中心看看有没有新出的界面,现在有很多人把自己设计的界面放在上面共享或者售卖,界面上的小图标也是根据设计者天马行空的创意制作而成,一个界面受欢迎的程度往往取决于小图标的形状、样式、色彩,那么,小图标到底应该怎么画呢?接下来我们就具体说说小图标的画法。

 


软件


首先是软件,我们到底该用哪个软件画小图标?答案是 Sketch 或者 Ps。为什么不推荐 AI 呢?因为在 UI 设计中,这些小图标一般都不是独立出现的,而是和界面作为一个整体出现,做界面的时候大家都是使用 Sketch 或者 Ps,如果你的小图标是在 AI 里做的,就必须每次画完再导入到 Sketch 或者 Ps里。还有一点是,我们做这种图标不可能是一次到位的,比如说有时候修改了界面布局,需要调整图标的大小或者样式,这时候还得回 AI 里调就特别麻烦,所以我们用什么软件做界面,就用什么软件画图标。



绘制方法


这些图标用什么方法画呢?是用好几个圆切出来么?就像下图一样:

 


答案是不,这种用圆切的教程实在太多了,导致我当年自学的时候也以为画小图标要这样,但其实不是的,这种切的方法是在做 Logo 时用到的,我们做 UI 的基本不用。做一个这样的 Logo 可能需要几天的时间,再加上计算和黄金分割就更久了,苹果公司和锤子科技的 Logo 都是用这种方法做了很久才完成的。

 

我们做小图标要求要快,有时候一个页面里可能就有十几个图标需要绘制,如果每个图标都画好几天的功夫去切,那要做到猴年马月啊。在工作中,UI 设计师绘制小图标的方法非常简单,就是把简单的图形进行组合和调整,比如三角形,正方形这些图形,先组合它们然后进行旋转,镜像等操作。最后再进行布尔运算,就是路径的相加相减。一个小图标就画好了。



当然,有很多同学可能看完了文章也还是觉得云里雾里,不知道该如何下手去画一个漂亮的小图标,所以在这里要给大家送一个小小的福利啦!我们特地联合潭州UI设计学院,开始为期三天的免费UI直播课程教学,不管你是设计小白还是想提升自己的UI设计师,在直播课程中老师都会针对大家各自的情况来一一进行解答。



pc端网站/移动端app/项目流程实战/交互设计原理/思维推演

不是技术大牛也是在成为技术大牛的路上

UI设计| 免费直播课

时间:2017年6月23日-6月25 日 晚上20:00-22:30

调性:我们只想做一场有深度的技术交流分享


让匠心知识服务有价!


报名方式:长按识别二维码或者加群号(187688847)

(长按保存图片 → 打开手Q,扫一扫  → 从相册选取二维码 ,即可!)


↓↓免费直播课课程表↓↓

课程内容《网页UI界面设计如何突破瓶颈》设计思维

直播讲师:小九老师

适合对象适合小白/UI设计师

上课时间:6月23日  星期五  20:00-22:30

课程内容企业级游戏网站项目流程

直播讲师:小九老师

适合对象适合小白/UI设计师

上课时间:6月24日  星期六  20:00-22:30

课程内容《项目的色彩搭配流程》项目+色彩

直播讲师:小九老师

适合对象:适合小白/UI设计师

上课时:6月25日  星期日  20:00-22:30



·特邀讲师·

特邀讲师·小九老师

从事UI设计8年,2009年从事网页设计,2011年担任顺丰网页设计师,2013年担任国内某第一批知名移动互联网创业公司产品项目UI设计总监,同时兼任网页设计、APP设计。2015年从事线上教育,资深互联网在线教育讲师,同时也是UI设计学院创始人,UI设计学院金牌主讲老师。



 

让匠心知识分享给最需要的人!

 



点击“阅读全文”了即可加入学习群


推荐文章
手艺门  ·  雅致非凡!一缕馨香梦回千年
4 天前
手艺门  ·  雅致非凡!一缕馨香梦回千年
4 天前
ZaomeDesign  ·  每日灵感丨十二月十一日
4 天前
庞门正道  ·  每个人都是个动物~
1 周前
庞门正道  ·  点进来,保证你眼花缭乱!
1 周前
Cocoa开发者社区  ·  程序员的恐惧
8 年前
乐趣微生活  ·  ☂妹子,你是不是想歪了!【NO4】
7 年前
豆瓣电影  ·  艾米,你愿意嫁给我吗?
7 年前