《最强蜗牛》是《不思议迷宫》团队新推出的放置类冒险游戏，这不由得让人对它有很多期待。所以今天就和大家来一同探讨一下这款游戏风格，大家接着往下看吧～

（本文共2650字，阅读完约为5分钟）

在探讨风格之前，

我们先来了解下游戏的故事背景

---------------------------------------------------------------------------------------

2120年，地球遭受未知能量攻击，所有城市化为焦土，世界文明濒临灭亡，世界上99%的物种灭绝，仅存少量低等生物苟延残喘。在游戏中，玩家将扮演一只蜗牛，从100年后的末日穿越回到现代，通过进化、变异等手段，一路过关斩将，打败邪神最终拯救地球。

---------------------------------------------------------------------------------------

其实光影也能够应用于游戏的界面设计中。

下面给大家介绍几种光影应用技巧：

Part.1 美术风格

《最强蜗牛》这款游戏的美术风格用的是饱和度比较低的手绘插画风格，偏恶搞方向，这的确和前段时间流行的《动物森友会》的可爱Q萌的风格形成了鲜明对比。

《最强蜗牛》的美术风格无疑来说是“特别”的，但这个“特别”就是一把双刃剑，用好了会对大家对这款游戏的记忆度和辨识度加分，但稍不留神，这个风格就容易在比较复杂的画面中显得比较花。所以在这里会把美术风格一分为二来看。

1.风格统一，调性明显

▲

《最强蜗牛》开始游戏界面

魔性并且看了忘不掉。《最强蜗牛》整体风格用了描线扁平插图风格。这样的风格对于剧情表现会很好，让大家更有代入感。这对于游戏剧情的推进是很有帮助的。

2.设计元素统一

▲

《最强蜗牛》LOADING界面中的蜗牛元素

很多控件和细节，都和蜗牛主题有关。我们之前在叶子学堂的课程中也有给大家讲过，一个游戏从LOGO设计到控件、面板的设计都应该有共同的元素来贯穿。《最强蜗牛》中就运用了大量和蜗牛有关的元素。比如LOADING设计，结合了蜗牛很慢的特性；加载中的小动画也是。

这样的好处是不断加强游戏整体的品牌感，这些都是游戏中的辨识度。

3.场景化设计，让人更有代入感

很多系统的框架都用了场景化设计，这样可以避免单一的游戏界面展现，和每个系统的契合度更高。比如收集页面，用的就是展示架的设计，另外大礼包的展示就是比较立体的展现形式，物体之间还有组合感。

不过抽奖这个界面，大概是因为风格影响，感觉有点破旧，感觉后期可以优化下。尤其是和氪金有关的界面。

美中不足需要优化的几个点：

1.标题太密集

▲

《最强蜗牛》开始游戏界面

标题的装饰部分大过了标题本身的辨识度。

导致缩小之后没法看，不太适合拓展应用。所以在这里建议把装饰要素提炼出来，作为某个字体的笔画替换，同时可以把蜗牛形象结合到LOGO设计中，提升《最强蜗牛》的品牌形象。

2.浮层页面整体优化

“完成生存训练”美术字用了彩虹色，有点显得很“缤纷”。其实在这里的标题建议沿用LOGO的黄色字体就好。另外现在感觉整个浮层页面的内容会有点散，会显得较简陋，缺一个能支撑起来的托底。同时获得物品的背景光可以稍微做大一些，托住整个页面，看上去会更整体一些。

3.魔性风格注意表现“尺度”

▲

《最强蜗牛》开始游戏界面

现在这个剧情的画面会让人感觉“有点过”。

大概很多妹子玩家看到这里会容易被劝退...

希望官方能在这样类似的页面提升画面观赏舒适度，“适度玩梗”。

4.文字颜色

界面下方“形态能力”描述部分的文字颜色真的看不清，相信这不是美术同学所为。

但咱们UI同学们在和程序对美术还原效果的时候，一定要确保文字清晰可辨认。

不然这个锅可落到了咱们身上哦～

5.某些构图缺主次

找了两张都是《最强蜗牛》的构图来做对比。

咱们先看左侧的图：虽然是对称构图，但是在竖构图界面如果想表现对抗的感觉，但现在缺乏主次，缺视觉中心；右边这张构图会比左边的构图好很多：首先运用了三角形构图，同时画面上方有光线照着蜗牛主角，既突出了视觉中心，又让整个画面很稳定。

6.框套感有点重

一般咱们在画面里如果主面板是方形的话，需要做层次叠加，或者破框处理的步骤。

所以咱们看下面两张截图能看出，左边这张是有问题的。首先这张图背景是以装裱的厚本子为主型，同时上面又分为3个方形二级面板底，主二级 面板底又带了一个标题框。这就是典型的我们之前希望大家避免出现的“框套框套框”的构图。

解决的办法正好可以看右图：右边这张界面构图的处理办法是用别针来作为装饰，将主二级面板底和标题框很好的衔接到了一起，“礼包奖励”小标题文字也是有一个页签托底，这样很好的对画面进行了“破框”处理。

其实最后整体来看，两个页面的主标题框其实都可以优化成其他的形式。

7.饱和度太低，阅读困难

这是《最强蜗牛》这套UI最明显的问题。

饱和度太低，再加上这种描线的插画风格，很容易让人找不到视觉中心，以及这个画面里需要突出的交互部分。

▲

左图为调整前，右图为调整后

找到了问题所在之后，用我们在课程里学过的的黑白灰检查方法检查层次问题，可以看出之前的层次会偏灰。

接着用PS的曲线工具把整体的黑白灰关系调整一下，在视觉中心处增加了主光源，上下不太重要的部分做了遮罩，突出了返回按钮，这样画面就不像最开始那样很散了。

Part.2 交互体验

好的交互体验是《最强蜗牛》做得比较好的部分，所以这里也顺带聊聊～

1.互动有趣，剧情代入感满满

剧情是层层推进的，对话形式也是自带槽点 。配合着音乐，竟然有一丝悬疑的效果。（让人想接着往下面玩儿～）玩到后面会发现，从始至终最强蜗牛都是用主线剧情来包装的。

2.新手引导流畅

游戏流做的不错。每个玩法层层递进，并且关联紧密。很好的运用了提示文字指引玩家继续出发。

每部分玩法逐一出现。页面下方新增的指南针图标，和蜗牛图标都是上面的快递盒里蹦出来的。点开地图按钮一看，原来是个“探索情报”入口。

3.交互简化，操作方便

游戏中把更多的部分留给了玩家体验剧情，甚至把很多梗留给了探索玩法。所以从交互上我们可以看到，UI上其实简化了很多复杂交互，把很多需要复杂战斗的部分都转化成了挂机模式，这大大提升了玩家在移动场景体验游戏的乐趣。

--------------------------------------------------------------------------------------

2020/06/10

叶子学堂读书笔记

骨头老师为大家复盘一下今日份知识点噢～

美术风格部分，做的好的点是：

1. 调性统一，风格明显

2. 设计元素统一

3. 场景化UI设计，会让人更有代入感

4. 
   

美中不足的是：

   1.  标题太密集

   2.  浮层页面整体优化

   3.  魔性风格注意表现“尺度”

   4.  文字颜色

   5.  某些构图缺主次

   6.  套框感有点重

   7.  饱和度太低，阅读困难。

交互体验是做的比较好的部分：

   1.  互动有趣，剧情代入感满满

   2.  新手引导流畅

   3.  交互简化，操作方便

--------------------------------------------------------------------------------------

咳咳～

说到了这里，

毕竟《最强蜗牛》走的也不是美型路线，

但至少通过魔性沙雕的风格出圈了。

或许这个时代，被人记住更重要。

但好的玩法和好的运营才能走得更长远。

▲来自骨头老师的摆摊自画像

希望各位大家都能对线上流行的游戏风格进行体验，

并且分享自己的感受和体会～

你觉得《最强蜗牛》这款游戏的美术风格如何？

欢迎在评论区留言，

以及参与我们的互动哦～

Powered by Froala Editor