UI设计师必看!游戏技能与道具的ICON设计指南

发布时间:2024-01-16 14:50:25 浏览量:192次


编者按 ICON看似很不起眼,但却是游戏中必不可少的存在。那么,怎么才能将它设计得更好?本文作者总结了自己在游戏ICON方面的设计经验,希望对大家有所启发。


文 | volvofu

腾讯互动娱乐 视觉设计


从事游戏UI设计零零散散加起来7年多,对交互和平面研究有限,却一直对设计各类ICON有着莫名的执念,参加完整的大小项目也有几个了,画的各种ICON已经记不得有多少,也算有些心得和积累,这次想和大家聊聊图标那些事儿。


各种游戏各种ICON五花八门,以自己有限的制作经验,个人总结其实可以归为三大类——技能图标,道具图标,以及一些要求精度比较高,纯展示功能的一些展示性图标(比如段位),这次先就聊聊技能和道具ICON。


首先放一部分项目作品镇楼,然后就开始正文。




首先要明确一个标准,什么样的技能ICON是个好的技能ICON,我的答案就是,图标不决问DOTA2!从技能到装备全是如此!


(DOTA2中的技能ICON)


开个玩笑,可能说的有点过,技能图标千变万化,各个游戏也是风格迥异,DOTA2最终的结果不一定适用于所有人,但是还是可以从中总结出一些基本的规律,来作为设计的基本支撑,经过长期的分析,也算是总结出个人感觉比较重要的4点和大家分享一下。


1.1 关于构图


1.1.1 取材


技能图标有一个特点,就是它往往表达的是一种行为和场景,所以要表达的内容会非常丰富,但是,技能ICON本身在游戏里的空间占比非常有限,所以就要求我们要抓住重点,在我们呈现的元素上,要有取舍,你想把什么都表达全,那很大概率上你就会走远。


比如下面这个例子,给CP草图阶段的修改。



这里我们要表现一个架枪射击的技能,左侧初始版本虽然把枪表现得很完整,但是问题也就在这里,就是表现得过于完整了,因为本身枪体结构就比较复杂,所以就把整个图标画面切割的非常碎,实际进到游戏中缩小后表现并不好,识别度并不高,右边这个优化版本,其实就是着重突出了这个枪的特征,这样就会让画面主次分明,虽然主体物展现的结构少了,但是给你刻画的空间变大了,这一点会直接影响你最后的表现。



一个疾跑技能,可以选择露出全身,也可以着重描绘向前的双脚。试想,在一个120x120像素的空间内,是描绘一双脚的表现力强,还是刻画全身的表现力强,结论一目了然。


所以,个人认为在开始取材构图的时候,技能ICON应该优先做减法,用最少的元素体现你想体现的东西,把空间最大程度上的留给需要塑造的地方,毕竟,能被看出来的细节才叫做细节,在小空间内过多的元素只能成为视觉的负担。


1.1.2 关于“张力”


分享

热门课程推荐

热门资讯

请绑定手机号

x

同学您好!

您已成功报名0元试学活动,老师会在第一时间与您取得联系,请保持电话畅通!
确定