Toem美术风格分析与实践

最近因为游戏创作的需求去游玩了Toem。我想在这篇博文中分享我对Toem这款游戏独特美术风格的见解,以及我们团队在实践中寻找的美术风格创作方法。该游戏由瑞典游戏工作室“Something We Made”开发,以旅行拍照为游戏目的展开主角对世界的探索。

图片来源为制作组IG

创作方式分析

整体画面为黑白色调

Toem游戏整体为黑白色调。根据制作组官网的游戏展示,我并不喜欢他们其他游戏的色彩风格,如果Toem也是这种色彩风格我可能不会入坑。

Toem作为一款旅行拍照游戏极度依赖视觉效果,制作组利用黑白配色很好的规避了不同色彩风格受众不同这一问题,达到了吸纳多审美倾向玩家的效果。虽然我相信对制作组来说给贴图上色并找到他们喜欢的色彩比例并不难,但是不可否认黑白色调减少了画面色彩调控的工作量,无需再考虑颜色的饱和度,只需在明暗中进行选择,让画面主次分明。

制作组官网中的其他游戏

模型创作

游戏中的模型尽量呈现出片状物体拼接的风格,但出于工作量的考虑,模型应该还是在建模软件中完成搭建的,并非在Unity中使用面片进行拼接。

模型的表面呈很明显的手绘风格,如不规则抖动的描边或修饰线条,简洁童趣的模型设计。在绘制贴图时要尽量保持线条的抖动感,但对于方形物体边缘又完全取消这种抖动感,给块状物体锋利的边缘感。

森林章节的大巴车

下图可以更明显的看出制作组对于某些线条的要求是完全锋利,但某些线条又保留抖动来保持其手绘感。

森林章节中的滑梯

非模型物体

游戏中的非模型物体均带有方向识别和朝向摄像机功能。

transform.LookAt(targrt);

描边物体会在unity中单独使用shader单独描边,使其更加平滑。在下图中更加明显,图像出现了明显的失真,但边缘依然保持圆润的平滑状态,这是通过了shader的描边处理。

放大的奶奶

不同需求的处理形式

植物

木本植物

对于对称的、塔形的树,使用面片插片来呈现。尽量避免在插片的正中央绘制纹理。这里用两种颜色的细节来表现树的层次感。

插片树1

插片树2

不对称的树会采取建模的方式,游戏应该是选择了柳树作为原型,用方形抽象概括。这种树只出现在了城市场景中,并且不成片出现,各自独立。用改变方块数量的方式制造树的多样性。

方块树1

方块树2

我本人很喜欢这种树的黑色树干,跳脱又沉稳。

草本植物

游戏中的草本植物有两种高度,趴伏在地上的小作物和与人物同等高度的植物。草本植物全部使用面片。

某种野菜

幻想的棉花糖植株

香蒲

芦苇

菌类

如果我没记错的话,这是游戏里出现的唯一一种蘑菇。每组蘑菇纹理相同,所以是同一组贴图重复摆放。

条纹蘑菇

盆栽

盆栽的解决方式是下部建模,上部面片。

盆栽1

对于无法方块化的膨胀物体,游戏用这种溢出的插片来表现,不细看的话已经以假乱真,这种方式运用在了很多地方。

盆栽2

地面

地面的丰盈感

Toem虽然是黑白游戏,但场景不会让人感到空洞。在这里我以一个森林场景来举例。在童子军场景中,各种植物素材分成了三个层次进行摆放,

童子军场景

  1. 基础的地面纹理+低矮的地面植物,小草、碎石阴影
  2. 有高度的地面植物,更茂密的草
  3. 树和岩石:松树和岩石

即是换到了其他场景,这套公式也依然存在

幽灵小屋场景

毛茸茸雪怪场景

海里的场景也一样。

海底宝藏场景

地面的纹理

Toem的地面看似简单实则细节加满。

砖块地面贴图有两种砖块,还附带了建模砖块,所以简单的砖块地面上面有三种元素

海滩砖块地面

这张图可以看到灯柱下有专门的砖块围边,楼梯口有线条纹理,墙壁上的砖块和地面完全不一样。

海滩灯柱地面

走秀场景的瓷砖地面,细看会发现瓷砖边分布着随机黑边

走秀场景

建筑类型

Toem的建筑从墙体纹理拐角材质房顶设计几个方面进行区分。

城镇房屋

Toem对窗户进行了5种设计,防止楼体单一。

椅子的细节

因为人物比例进行了夸张化,所以符合人物动作的椅子被进行了矮化

游戏中的通用椅子

肉桂面包场景

打工人

我们的创作

我们在制作之前大量分析了Toem的创作方式,并把这种扁平化的风格运用到自己的创作中。但因为我们的模型并非完全方块化的物品,所以流程更麻烦一些。

这是实验效果中的,但不会最终使用,因为它缺少原创的设计。

image-20230313181754771

创作这种房屋需要在建模软件中先延伸面片再对面片进行贴图绘制,达到Toem的效果。这是一项繁琐的工作,感谢我们的3D美术。

借鉴Toem风格创作的房屋

Author: ZhangNort
Link: http://example.com/2023/03/13/Toem美术风格分析与实践/
Copyright Notice: All articles in this blog are licensed under CC BY-NC-SA 4.0 unless stating additionally.