游戏开发论坛

 找回密码
 立即注册
搜索
查看: 3930|回复: 0

游戏UI设计师怎样的作品更值钱?

[复制链接]

8364

主题

8525

帖子

1万

积分

版主

Rank: 7Rank: 7Rank: 7

积分
14833
发表于 2019-2-22 10:52:17 | 显示全部楼层 |阅读模式
文/邓杰、雨菲,资深游戏UI设计师

简历情况

某中型游戏公司5年老员工,每年加薪2-30%左右,目前月薪税前12k(无奖金)
渴望有更好的发展空间,但长期加班没时间练习,平时也没提高能力导致简历中只有工作项目作品。

主人公简历作品节选如下(网上搜的类似品质)

2014年代表作品

10.jpg

2015年代表作品

11.jpg

2016-2018年代表作品

12.jpg

2016-2018年代表作品

13.jpg

应聘者虽然工作了5年,作品和参与项目较多,但是作品跨度太长。

从2014-2018年作品都有,设计品质不在同一个水平线上,这样不利于拿到一个高薪资offer

简历存在问题

1、 时间跨度大、品质不高拉低了简历含金量
2、 题材和风格单一,整体设计感弱
3、 作品少有出彩的地方,设计能力平庸
4、 没有手绘图标等其他作品,综合能力弱

14.jpg
怎样能赚更多毛爷爷~

2019年项目类型和风格预测
(排名不分先后)

欧美风-王者荣耀MOBA类换皮游戏
欧美风-吃鸡换皮类游戏
欧美风-战争、SLG(策略)类型
欧美风-漫威题材和科幻类型
二次元-迎合少男少女口味
中国风-电视剧改编游戏增多,女性向中国风

其它:

欧美Q版休闲游戏
棋牌类游戏
扁平化H5小项目
独立游戏等项目(成本低,小公司最爱,新人准备这类作品好入行)

15.jpg

通过数据发现2018年霸榜前10名的游戏类型和风格,很遗憾没有一个是中国风。


那么,今天来聊聊二次元作品

导师:Jack    作者:雨菲

16.jpg

练习作品定位为活泼欢快的基调,希望迎合年轻人喜好

17.jpg

练习前,我们下载了二次元游戏试玩并做了一些剖析

18.jpg

总结之后得到了一些经验

19.jpg

二次元界面主要特点

扁平风
动漫元素强
大色彩倾向
几何形构图
重视文字的设计和排版
点线面构成等……

如果每次练习都当成游戏中打怪升级赚金币,相信大家会很有动力哦~

20.jpg


快乐的打怪兽升级过程

网络找的某款上线游戏截图

21.jpg
零境交错

01次设计如下,问题较多非常不满意

22.jpg

筛选参考素材,并提炼如下

请新人注意,UI设计师在工作中需要匹配项目角色、场景原画风格,不能随性搭配以免造成视觉风格混乱。

23.jpg

02次设计层次和颜色倾向有提升,但交互很变扭,所有信息都在右变

24.jpg

03次设计修改交互的信息和内容取舍

25.jpg

左右手可同时操控节约玩家游戏时间,也方便查看界面重点信息


有经验的老司机还会在界面设计的时候考虑需要的动效和整体资源大小问题,比如按钮选中的状态,头像选择和切换的状态等变换效果。

我们练习作品文件较大,这里放上一些类似特效
选中角色头像一瞬间的参考动效

30.gif

切换不同头像选择的动效

31.gif

选人等待时会有缓慢飘动的樱花效果

32.gif

以上方法都可以提高我们作品专业度和含金量!
使用好至少待遇也会提高个几千块吧~

26.jpg

每次项目完成都有一种被虐翻了的感受。大家呢~

PS:招聘的时候,专业的HR和主管只需要通过简历作品就可以了解面试人能力和经验,并决定待遇和是否录用等问题。

作品太差的简历往往连第一关面试或笔试机会都没有

27.jpg

如果应聘者能力较好,又有靠谱担保人介绍,某些公司也会只需要面试就可以大手一挥决定是否录用。(特例)
有推荐人介绍,同等岗位待遇也会比平台招聘薪资会高一些哦。(熟人好说话么)

附-按钮实操教程

二次元游戏是年轻人群较易接受且喜爱的一种风格,这类游戏项目的设计都属于平面化的,更贴合动漫原画的风格。

28.jpg

策划需求

  • 绘制一个“发起战斗”字样的按钮
  • 最终游戏中对比强烈,制作精美


图标绘制步骤

(1)启动Photoshop,按Ctrl+N快捷键新建一个文档,设置【宽度和高度】为600×200像素,设置【分辨率】为72像素/英寸,设置【背景色】为白色,设置【颜色模式】为RGB颜色,8位,单击【确定】,创建完毕。

29.jpg

(2)用蓝紫渐变(蓝:R:127,G:155,B:205 紫:R:135,G:133,B:208)填充【背景】,然后新建图层,在新图层中用【直角矩形工具】绘制一个长方形。

33.jpg

(3)打开【属性】(窗口→属性)面板,将填充色改为渐变,然后为按钮填充一个较暖的粉橘渐变(粉:R:244 G:82 B:144 橘:R:239 G:174 B:127)

34.jpg

之后将矩形稍微倾斜,呈现出俏皮的菱形,效果如图:

35.jpg

(4)按钮的基本样子出来后,开始丰富细节,双击图层打开【图层样式】编辑面板,选择【投影】,为它设置一个黑色(R:40 G:39 B:39)的投影来体现空间感,设置参数如图,效果如图:

36.jpg

37.jpg

(5)下面为按钮添加纹理,我们选择一款二次元风格的素材,设置数值如图: 3-318,然后选取按钮的外轮廓,为素材图层添加一个按钮形状的蒙版,效果如图

38.jpg

39.jpg

(6)叠加素材之后按钮整体颜色变重,我们来调整一下,在图层界面下方找到【调整图层】新建一个【亮度/对比度】的图层,并将它【置入】素材图层上

40.jpg

(7)双击图层的位置,打开调节窗口,将参数调整一下,数值如图

41.jpg

42.jpg


(8)新建图层,使用黄色(R:222 G:200 B:96)在按钮的右上角位置做个高光,用【画笔工具】里的柔边笔刷点一个柔边圆,之后选择【自由变换】将柔边圆压扁成椭圆形,效果如图

43.jpg

44.jpg

(09)继续为按钮添加细节,选择一些圆形放射素材,放置于按钮的右下角,透明度设置为20%,再设置一个按钮形状的蒙版即可,按钮底部就做好了,效果如图:

45.jpg

(10)接下来添加文字,用纯白色较平直的字体输入“发起战斗”字样,大小调整好置于按钮的中间,再为文字添加一个紫色(R:184 G:63 B:143)的【投影】样式,设置参数如图:3-326,最终效果如图

46.jpg

47.jpg

这样一个二次元按钮就做好了,大家一起试着做做自己喜欢的其它二次元小元素哦!

48.jpg

49.jpg
恭喜成功!

其它作品交流

作者:杨国强

50.jpg

51.jpg

52.jpg

作者:carina

53.jpg

作者:鱼

54.jpg

作者:健健

55.jpg

作者:DoDo

56.jpg

作者:曾臣

57.jpg

58.jpg


彩蛋  5分钟练习法

很多朋友常常抱怨工作很忙,加班严重没有时间提升自己,其实提升自己灵活的使用碎片时间就可以。

如:最近北京下雪,小伙伴一起发微信交流,是否可以玩个速途?

59.jpg

我眼中的雪景

60.jpg

又如:最近情人节,小伙伴是否可以来点创意的礼物送爱人,

别都是鲜花、吃饭、千篇一律呢?

61.jpg

我眼中的西瓜

62.jpg

学习是需要坚持和交流的,任何好方法都都不如练习来的实在,

行动吧!

如何提高设计能力?

总结了一些练习方法,希望对小伙伴有帮助

前方超车请大家系好安全带!

再此特别感谢“苍老师”、“波多老师”等无私奉献的启蒙导师~

ps:为了不污染视听还是不放原图了,有♂趣的自行上原链接……

下图可学习配色和纹理的使用技巧

63.jpg

下图可提取文字的使用技巧

64.jpg

下图生动的照片让我学习到了字体搭配和排版技巧

65.jpg

来源:庞门正道
地址:https://mp.weixin.qq.com/s/FVb8PXa3mYveE7pQkkXqnA

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

作品发布|文章投稿|广告合作|关于本站|游戏开发论坛 ( 闽ICP备17032699号-3 )

GMT+8, 2024-4-20 19:55

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表