必须夸!这一届的学生真是太优秀了!

用户头像
上海/UI设计师/1年前/584浏览
必须夸!这一届的学生真是太优秀了!
大家好呀,这里是骨头33🦴~
随着叶子studio的UI教学课程稳步推进,
又有一批优秀的学员带来了属于他们的作品~
那么让我们掌声欢迎元宝咕噜同学和初六同学~👏
(本文约2500字,阅读完需要6分钟)
一、人鱼公主的梦境
hello,大家好呀,我是元宝咕噜,已经在游戏公司搬砖三年多了。由于不间断地工作,我一直没有时间和精力产出属于自己的作品,风格开始单一化。
之所以选择来学习,一方面是希望打破自己单一的创作状态,通过制作一套完整的作品打破舒适圈;另一方面也是想借此机会了解现在的设计市场,提升设计能力,提高自己的职业竞争力。我一直都有关注叶子,叶子的文章总能给我许多设计灵感。在这里,我学到了很多专业知识,并且得到了非常专业的指导。
骨头老师是我的导师,她不仅在专业上给了我许多指导,也会在我设计遇到瓶颈和挫折的时候耐心地鼓励我,帮助我走出困境。
其实决定做人鱼主题的游戏界面,算是个挺随性又很坚定的想法。
我喜欢玩各种不同类型的游戏,报名课程的时候,我正好沉浸在《无限暖暖》这款换装大世界冒险游戏中,当时出的1.5版本人鱼套给了我创作的灵感,
鳞片的光泽、裙摆的流动感,连配饰都透着种梦幻又细腻的感觉。
我当即想做一套和现在市面上已有风格不一样的,以人鱼为主题的游戏界面设计。
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxMTI=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxMjg=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxMjQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxMjA=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxMTY=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
游戏类型
:换装冒险×海洋探索
世界观设定
:半人鱼少女,将贝壳、鳞片与绸缎化为治愈时装,净化污染核心。
核心玩法简述
:探索梦幻海域,拾取污染物转化为时装素材。通过搭配治愈系服饰净化海洋,与人鱼伙伴共舞唤醒生态能量,最终举办海洋时装秀拯救人鱼国度。
目标用户群与视觉定位
:偏好梦幻治愈风格的16-25岁女性用户
1.初期调研:
参考了很多游戏的人鱼主题的运营活动界面,也在网上搜了很多人鱼相关的美学设计,美人鱼美学的视觉元素主要以蓝色、绿色或珍珠色调为主。质感通常是光滑、闪亮且带有虹彩效果,类似于鱼鳞。(mermaid)
随后我提取了多个关键词,作为整套设计的核心基础:
深海 幻境 贝壳 珍珠 鱼尾 鳞片 光感 绸缎 海底 光纱 水母 水波
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxMzI=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
一开始我想尝试偏深色调的界面,反反复复产出了多版的深色稿,想营造一种深海遗迹的感觉,但是总不满意做出来的效果,而且画面偏脏。后面根据骨头老师和嘉威老师的反馈,又尝试了偏亮的白色画面,将两种色调的风格整体对比了一下,白色调设计的平面质感更清晰,交互信息的层级也更易识别,整体观感更舒适。
确定了亮色调为基础后,我也定下蓝色和粉色为整体作品的配色方案。
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjgxNDQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjgxNTI=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
风格稿确定后,整体的画面依旧缺少梦幻的感觉。在塑造阶段,老师建议可以给点水底的效果,增加光斑,营造那种波光粼粼的水下梦幻感。
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjgxNTY=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
关卡界面,我想使用漂流瓶作为每个关卡入口的视觉表现。关卡界面修改前,色彩比较单一,画面也显得简单。我调整了水面与标题颜色的色相变化,并在不同漂流瓶之间稍微做了一些差异化处理,这样处理画面显得细节性更强了,不同关卡间有关联也有区别。
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjgxNjQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
弹窗界面的设计中,我运用了大量点线面的平面构成手法,用粉色圆形弥散光突出图标;同时,在整个界面中我加入了不少手写的英文字体作为线的装饰效果,进一步营造优美的氛围。
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxNDQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
登录界面的背景图,我先用 AI 辅助生成,之后再进行了一系列平面化处理。在标题设计上,我始终希望打造出华丽、梦幻且贴合人鱼主题的效果,因此融入了英文花体字元素,并以海螺剪影替换部分笔画;其中 “曲” 字还结合拱门元素做了变形,与背景的拱门造型形成呼应。质感与光效方面,我采用贝壳材质,让字体更具华丽感。
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxNTY=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
做设计时突破舒适圈,本身就是件很艰难的事,不脱产学习更是让这份难度加倍——我得一边工作,一边挤时间推进。当时赶这个作品时,正好遇上公司有重要项目要忙,每天高强度工作、频繁加班,晚上回到家连打开电脑的力气都没有。更难熬的是,有时会卡在设计思路里毫无头绪,忍不住想逃避,心里又急又焦虑,挫败感特别强。
还好有骨头老师一直陪着我,他不仅耐心给我提修改建议,每次我沮丧时,还会耐心开解、鼓励我。现在的我已经不再抗拒下班后给自己“充电”,希望休息调整后,能尽快开启下一个作品的创作。
骨头老师的话:
「元宝咕噜」是位很有自己想法,并且有很高效执行力的同学。
在这套UI作品中最开始阶段就展现了不错的设计感和创造能力。可能的确之前的工作中消磨掉了很多对设计的敏锐度。在作品集的准备过程中我们也稍微走了点“弯路”,但正是有了这样的对比让我们有了更明确的方向——需要做一套视觉更强更有辨识度,更能体现视觉元素的作品。
于是我们在作品集准备的过程中有4个重要的突破点,在这里也分享给大家:
(1)明确由人鱼主题,梳理出重要视觉元素;
(2)确定亮色调平面扁平视觉方向;
(3)在单一颜色配色中如何增加颜色的层次;
(4)AI立绘的替换(在这个部分我们会看到立绘的选择会让整体UI的气质有很明显的区别~)
很开心能成为「元宝咕噜」的导师,同时能跟进这套作品~希望「元宝咕噜」的作品能给更多同学在作品设计上有很多新的启发~
二、磁带盒未来主义 + NASA朋克
大家好,我是初六,很荣幸能在这里分享我的作品~
我是一名8年经验的游戏ui设计师,从上一家公司离职以后,我决定产出一些好的个人作品,一方面是为了更好的求职,一方面是为了提升一下自己的设计审美和综合能力,平时从各个平台上面都有刷到过叶子学堂的信息,感觉叶子的老师们都噶专业,决定报名了叶子学堂的创作提高课。开始创作我的作品。特别鸣谢我的关爱老师骨头33,在创作的过程中提供很多建设性的思路,教给我很多专业性知识。ღ( ´・ᴗ・` )比心。
1、初期调研和风格探索
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxNjA=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
情绪版收集
收藏
2、确定美术风格和色调
首先确认美术风格为:
 磁带盒未来主义、NASA朋克
,并根据风格确定主色调为:
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxNjQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
主色调
收藏
其次给项目定调:
世界观:
宇宙探险,寻找失落的文明
确定项目名lost planet(失落星域),并根据
情绪版和世界观
提取一系列关键词:
宇宙 飞船 探测仪 超时空隧道
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxNjg=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
早期概念稿(属性界面)
在完成概念稿的过程中,我找了一个比较有科技感的战士的立绘,能给界面带来一种未来感。然后开始用上课教过的
混沌p图法
制作风格稿。
找参考的时候,翻到了《死亡循环》这部作品,作品的美术风格也给了我一些灵感。
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUxOTY=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
它的主调以高饱和的橙黄和暗黑色作为界面的主基调,风格是扁平的印刷复古风,看似矛盾的设计元素,最终展现出了干净利落、现代、潮流的视觉效果,和我想做的复古未来风格很契合。在此基础上,我再结合情绪版中找的一些复古构成主义参考,制作出了第一版风格稿。
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUyMDA=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUyMDQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
结果发现效果更偏向末日暗黑风了一些,在功能面板设计的也有点太过于规整和死板。于是进行修改的第二版摒弃了印刷感和破损感,更偏构成主义。
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUyMjQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUyMjA=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
方向尝试
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUyMzI=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUyMjg=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
优化稿
收藏
3、AI辅助
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUyMzY=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
立绘借助ai跑图过程
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUyNDA=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
立绘借助ai跑图过程
收藏
存在问题:立绘放到界面中又发现现在这种构成主义的背景不是很合适,缺乏故事性,风格上也不是很契合。
因此我整理了调整界面的思路:整套界面应该是
相同的世界观
并且有
联系;
并且可以参考分镜的镜头语言。
场景+立绘借助ai跑图过程
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUzNDQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
思路发散
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUzMzY=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUzNDA=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUzNDg=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
最终差不多把属性确定下来了。细化了差不多90%,后面就是开始铺其他界面。
游戏界面立绘和场景跑图过程
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUzNjA=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUzNjg=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
主界面飞行器跑图过程
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUzNzI=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
飞行器+场景跑图过程
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUzNzY=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
4、界面完成稿展示
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjU0MjQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjU0MjA=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjU0MTY=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjU0MTI=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjU0MDg=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjU0MDQ=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjU0MDA=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
必须夸!这一届的学生真是太优秀了!(图ZMTUyMjUzOTY=) - 资讯 - 站酷设计师叶子_Studio原创素材 - 站酷ZCOOL
收藏
三、小结
网络班里涵盖了来自天南地北的同学,大家的基础各不相同,我们也花了很多时间给同学们制定不同的成长方案。我们在同学们的身上去找闪光点,鼓励大家找到自己擅长的部分,与结合市面上受欢迎的UI作品之间达到一定的平衡。欢迎更多同学们加入我们!让我们一起创造出更多能战胜“焦虑”,去班味的作品~
那么,今天的分享就到这里啦,对设计有任何想法也欢迎给我们留言! 如果你也希望在2025年踏入游戏行业,或是进一步提升设计技能,请来站酷后台滴滴,了解我们的游戏UI设计课程吧!
9
举报
|
11
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
平面插画情侣/矢量
金色颗粒质地的平面
课程海报,平面素材
平面花卉图案扁平简约无缝拼接插画
学习,优惠券,平面,海报
中国传统纹样创新图案设计
平面人物插画
平面设计 吊牌设计
平面风格黄绿色系花朵装饰
玄关入门地毯印花图案红地毯
金色颗粒质地的平面
空的平台平面和自然景观
城市园林平面布局航拍
平面书法字手写
牛奶乳液层次平面平铺平面
空的平台平面和自然景观
倒计时,海报,平面
中秋节可爱呆萌平面兔子蛋黄月饼贴纸素材
城阙凡花
城市园林平面布局航拍
“知识宅急送”外卖,快递,平面,海报,素材,教育
平面男孩喝咖啡插画设计
金色颗粒质地的平面
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
平面插画设计女孩喝咖啡
你可能喜欢
相关收藏夹
ui
ui
ui
ui
大家都在看
登录注册