恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
《鉨变》二次元作品设计复盘
1.5°
2024-04-03 原创文章 经验/观点 举报 336 0 0 0

“录音机” 同学由 “23K老师”指导,以下为学生复盘


01  关键词与情绪版


大家好,我是录音机,最近出的《终末地》让我非常激动,加上喜欢《死亡搁浅》,让我有了想制作这套界面的想法。在风格定位上也是一步步打磨,一次一次的修改,不断地更新关键词,找到符合世界观的视觉效果和更符合落地的方法,使作品更符合二次元手游落地的倾向

前期的情绪板元素&参考

据《终末地》放出的PV的视频为作品初期参考,提取的关键词是沙漠,科技,虚幻,未来感。


初期想法的界面制作和遇到的问题

最初做的是不怎么找参考按照自己想法做的属性界面的风格稿,采用了沙漠的黄色基调为主氛围,一开始打算往黄色调子上做延续。做了几张风格稿发给老师看以后有几点问题:页签的排版不合适,界面太同质化,调整了字体,界面没有出彩的地方,太平庸了(实在不好意思放出来)。经过23K老师修改以后,发现新关键词:热成像、玻璃,以这张图为基础继续往下延展。


阶段性问题:

太同质化,视觉也有问题,虽然找到的参考看起来不错,但是做出来老是感觉不是那个味道。

发现平面的东西再怎么弄也无法做出像3D建模那种更容易实现,且华丽的效果,我就说出了那句话:“老师,我想学建模……”


02  建模辅助修改设计


抽卡界面

虽然使用了3D辅助,但是没有做出科技的味道,反而显得有点小气,信息排版也略微简单没有细节。还是按照属性界面那张图做延展。

界面问题:背景太单调、滑动方式不太适合,主体物不够突出。解决办法:转换镜头角度,拉近视野,优化信息布局。

主体换成3D以后 ,在形状上模糊不清,滑动条处于平面也有点奇怪。解决方法:把滑动条竖起来,加入全息影像的视觉跟视觉主体呼应,展台上加入细节增加科技感。视觉中心修改成类似菱形,让形状感加强。

场景有点寡淡,很平稳,没有氪金抽卡的强烈情感。解决方法:用不同视角的构图方式来刺激视觉,增加画面张力,延展几张草图。

这张图卡了好久,最后选择了有未来感的蓝色为氛围基调开启延展。做完这张界面是开心的,以前不会的东西掌握了,也算打通一个小BOSS。3D辅助会帮助UI设计师大大提升设计效率和图片的质量。

问题:背景的英文字母太扭曲,有点干扰阅读,抢了主视觉的风头。解决方法:文字中间部位流畅,加一点科技的点线面穿插。


角色界面

当确定好蓝色基调后,属性界面想尝试在相互视觉上面做出差异,开始简单规划了几张草图,右侧UI信息面板视觉不顺畅,左侧页签也略显笨重。

经过老师指导以后,把页签和信息面板做干净,尽量做平一些,更有科技感。尝试换一下偏立体的项目角色,联想到滑动切换角色的动效效果出几个方案。三个角色在界面中特别影响视觉,改成只留当前角色展示,颜色饱和度偏高,颜色倾向太严重。

到现在这张图,氛围基调才算是最终确定,空间氛围更容易包容不同的角色展示,ICON加入科技波点,用HUD陀螺仪的感觉突出SR标志,人物头像用3D全息的风格来表现,后续的图都往这张感觉上靠近。


关卡界面

这张图的问题在于背景太单调、滑动方式不容易操作,主体物不够突出。先把之前的闯关界面颜色改掉。底部黑压压的一片,有点死板。右侧的信息面板和展示的地图都用了倾斜的手法,画面中没有稳定的一个面,右侧的信息面板的对比性、亲密性也有问题。

蓝色、科技的关键词让我想到《死亡搁浅》和大部分科幻电影,是否也可以用一下手环呼出的方式,降低玩家的理解成本,这个页面是怎么产生的、何种方式产生、在什么样的情况下产生是合理的。

原本颜色灰蒙蒙的,优化以后,把右侧信息变规整,主要突出地图的核心视觉,按钮加入圆角贴合之前属性界面的延展。继续优化,调整信息栏顶部的ICONT图标和开始调查按钮,更符合科技感的味道。

闯关界面差不多后,开始下一张登录界面。


登录界面

最初的氛围想法是一特战队员乘坐宇宙飞船去另一个星星执行任务,却不知一切都在幕后黑手的操控下进行着。界面问题:不太像界面,有点海报感,推翻重做。

问题:氛围代入感不够,中的方格罩子有点影响画面平衡。左图的字体有点粗,在辨识度上有点吃力。右图后面两个字也是不好阅读。解决方案:重新设计名字,要让其符合科技感、轻盈、内敛的感觉。

之前Loding图的平面版式太单调,推翻重做。以登录界面为基础进行修改。

原本想到的动效是飞船一直在上升,进度条跟着飞船一直上升,这张草图跟大部分的加载界面有点不一样,如果会动效的话,可能更好的实现自己的想法。后面的图在视觉上还是张力不够,应该让玩家的情绪感再提升一下。最后这张是根据登陆界面联想到的镜头切换的动效方式来转换到加载界面。


战斗画面

把之前的战斗界面重新优化,还是从大感觉开始出几张草图,在小地图的制作上采用全息影像的美术方式。


登录画面

问题:名字位置不舒服,主体物轮廓感不强。解决方案:把名字往旁边移动一下,主要展现中心的容器,主体物加入轮廓光。氛围增加代码流氛围和空间感。


03  最终调整



建模展示


04  项目复盘与总结


这套界面用了大半年的时间,中间停下来去研究建模耽误了一些时间,但是慢慢做完以后还是能感觉自己进步比较大的。

个人总结:

1、平面方面还是继续不断地加强练习,在平面上有点薄弱。

2、以后的练习应该更大胆一些,有时候太拘谨反而会限制在自己设定的框框里面出不来。

3、遇到问题要及时问,闭门造车不是一种好方法。


这套图感谢老师这么长时间的付出,耐心讲解作品中遇到的问题。一个好的作品必将是由一个不好的作品慢慢培养出来的,我相信量变引发质变,做图的时候不要太纠结。在AI环境的影响下,很多人会很焦虑,我个人感觉还是打牢基本功,才能如蛟龙入海一般,自由遨游。

最后,我想把名人温斯顿的名言送给大家和自己:“成功不是终点,失败也并非末日,最重要的是需要继续前进的勇气”。


指导评语:

“录音机”阿明是个行动力很强的同学。想到了就不停留,立刻开始调查、学习、总结、落地。这套作品虽然做了很久,但过程中一直在刷新技能,融入新的知识,这是非常可贵的。希望他可以在未来的作品中一直保持这样的热情,不断进步~


Powered by Froala Editor

更新:2024-04-03

收藏

0人已收藏

叶子学堂

叶子学堂 官网:http://www.yezixt.com

  • 195

    作品

  • 7269

    粉丝

  • 3

    关注

  • 2024大厂实体班起飞计划❗0基础玩转游戏UI❗️
  • 《书与花》乙女风作品复盘
  • 韩 系 黑 白 独 立 风 作品设计复盘
  • 《ZERO TASK》“潮流盲盒风格”设计复盘

    猜你喜欢

      2024-04-03 原创文章 经验/观点 举报 336 0 0 0

      《鉨变》二次元作品设计复盘

      1.5°

      你确定要举报《鉨变》二次元作品设计复盘

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2024年04月03日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      0
      0
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录