ICON“抄袭”技术指南

Recommand
北京/产品设计师/5年前/550浏览
ICON“抄袭”技术指南Recommand

设计·优化·提升你的设计质量从ICON开始

1.有话先说


我一直坚信,不学习可能会落后,但是不思考一定会被淘汰。

在设计师的生命周期里,如何从“猿人”进化为“智人”,这并不是个简单的事。在设计师中的“猿人”通常会按照所在“社会制度”的安排,通过使用工具去完成制定任务。但一个合格的“智人”不仅需要熟练的使用各类工具去完成任务,更需要深知工具与完成任务背后的逻辑与方法。与此同时拥有更多的自主思考与创新的能力,甚至是推动所在“社会制度”的发展与变迁,那就是更高的境界。在成为“智人”的路上,感觉需要更加努力,所以突发奇想在工作中总会遇到画icon的需求,但如何把这个事更加体系化和流程化,我觉得还蛮值得挖掘的。所以有了这篇吹水的文章,希望可以忽悠到你。



2.工具简析


在这里谈及的软件主要是指在UI设计工作中,针对视觉设计的主流软件。在我看来,工具就是工具,能满足你需求的工具就是好工具,这里对以下几个软件的简析不吹不踩,只针对这几个软件在绘制Icon时候提供的帮助简单梳理,希望可以帮助你更好的选择适合自己的工具。


undefined



3.解刨与重构


在这部分会按照一个先后次序去细化在Icon设计中的每一步骤具体的思考方式,执行方法以及验收标准。

undefined


3.1 前——准备

undefined

  • 沟通与分析

收到一个需求,不要单纯的“相信”你的需求文档,找到需求方具体聊下他们的期望以及具体诉求,这会帮助你发觉在需求文档里没有描述的部分可能是你设计的关键点。


  • 明确目标

即使画小小的icon也要明确自己目标,这个目标涵盖业务/产品的目标、设计目标与个人目标三个方面。这三者的关系是:设计目标基于业务/产品目标,而个人目标是基于前两者的基础上产生的。搞清这个关系,可大大避免你设计出了一个炫酷屌炸天的icon,但设计领导、业务/产品却不认可的尴尬场面。


  • 筹划与准备

当你明确了各方的具体目标与需求,那么去找到一个更为直观的图至关重要。因为不同人对于风格、感觉的理解都是不同的,语言和文字的描述不够直观,搜罗和整理好风格和样式示意图,会让你的验收标准更加直观,设计也拥有了可视依据。


[此阶段验收标准]确定符合需求的具体的视觉方向,并可预期最终效果以及完成周期。



3.2 中——执行

3.2.1基础

尺寸、颜色、栅格、描边和填充、风格、质感、空间、体量、形状、角和连接、圆角、端点、透视、动效(这些内容到处都可以搜到细致的分析,这里不加赘述),每一个细节的变化都会带来不同的视觉感受,多尝试,不要拘泥于找到的示意图所呈现的效果,借鉴并超越才是关键。


灵魂3问

[1]怎么找到这些变化?一个字——不断的试!世界上没有绝对真理只有相对真理,设计也是如此,只有经过不断的尝试才能选出最优结果。

[2]怎么试?两个字——各种试!从颜色变化到圆角半径大小再到端点平圆,要试的太多了。

[3]怎么判断最优结果?三个字——职业眼光!你会问这个回答太扯了,啥算职业眼光?这可能就涉及更深层的原因,比如个人的审美、阅历、经验、直觉、敏感度等等。我并不认为这是一个单纯的时间维度问题,更多还是来自于对自己的训练与经营。如果硬要量化这个指标,那么下面这个方法希望对你有帮助。


第一步:选择你要考虑的基础细节,eg:圆角

undefined

第二步:选择一组描述这个细节的反义词,eg:圆润-尖锐/温柔-凶狠/…

undefined

第三步:量化这组反义词,并进行等比分阶,eg:圆润代表0-尖锐代表10,以2进制分为0-2-4-6-8-10

undefined

第四步:回顾你的目标,你的图标更需要什么程度的圆角,并选择出来,eg:商业更加锐利一些会更专业,所以选择了2,当然4也可尝试下

undefined

PS:也许这看起来没有那么科学,但是请想一下这个办法取代的上一个方法是你拍脑袋决定的,所以相对拍脑袋这已经完全不一样了】


3.2.2隐喻

不仅要做到映射成立,可读性良好,还通过一些细节更多的去传递内核的价值观或者创意延伸就更为高级,这里以苹果的icon为例子,访达的icon是从毕加索的画作中提取了创意,这个icon不仅设计巧妙,更是把乔帮主那种嬉皮士的感觉完美融合。所以从合适的角度去借鉴和提取灵感,与自身的icon进行融合,这种处理手法不仅可以事半功倍,更会传递更深的艺术含义。

undefined

3.2.3基因

品牌特色的融入、本土化设计,这里一些部分是与基础部分重合的,找到其中的韵律、组织、情绪、趣味会赋予你的icon差异性。照抄和硬搬绝对不是高明的手法,善于去发现自身品牌的感觉和特质与你的icon融合,不仅可以更好的诠释品牌的调性,更是对设计师一个功底的考验,因为设计不可无缘无故,尤其在产品设计中。

undefined

[此阶段验收标准]在规定时间内完成完整、规范、可使用、符合预期的设计稿。


3.3后——沉淀


交付文档

这里不仅需要输出符合开发需求的文档,更需要对所有设计细节进行规范说明、标注,以便多人协作之后的设计工作,保证整体的一致性。


资产整理

除了在工作中的交接,形成自己的资源库,不仅会让你了解到自己的进步和成长,也可以帮助你在之后的工作可以更高效的借鉴、说明和使用。


复盘总结

在这个地方不用整得很复杂,在洗澡、吃饭、通勤、发呆的时候静下心想一下这个流程中自己的得与失,自己还可以进步的点在哪,方便的话简单的记录下。通过不断的日常积累,你会发现进步的不仅仅是你的视觉表现力,而是自己思维方式的不断提高。



4.“抄袭”的奥义


undefined


设计师不仅需要好的视觉表现能力,会思辨的考量设计问题,才是关键。别太着急的去表现自己的视觉能力有多强,静下心找到自己的感觉,寻找到最适合的视觉解决策略,你才会把自己的视觉能力输出到最大值。停止简单的搬运Icon视觉风格,有目的、有方法、有探索、有改变、有沉淀的做每一个Icon,你的设计会更佳具有说服力。

我们的终极目标并不是为目前这个产品画好一个icon,而是形成属于自己的审美体系,以及辨别是非的能力与思辨的能力。



原创//没有梦想的鹅卵石

如果你喜欢我的文章那就帮我点个赞吧♪(^∇^*)


5
Report
|
7
Share
相关推荐
icon
icon
icon
icon
作品收藏夹
梦游
Recommanded by editor
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
相关收藏夹
icon
icon
icon
icon
作品收藏夹
IP形象——动物类
IP形象——动物类
IP形象——动物类
IP形象——动物类
精选收藏夹
作品收藏夹
ip形象设计+表情包
ip形象设计+表情包
ip形象设计+表情包
ip形象设计+表情包
精选收藏夹
作品收藏夹
企业展厅/文化墙 参考
企业展厅/文化墙 参考
企业展厅/文化墙 参考
企业展厅/文化墙 参考
精选收藏夹
作品收藏夹
小家电
小家电
小家电
小家电
精选收藏夹
作品收藏夹
IP形象及IP内容
IP形象及IP内容
IP形象及IP内容
IP形象及IP内容
精选收藏夹
作品收藏夹
大家都在看
Log in