跳到主要内容

44 - 俯视角的树木

原文地址

img

田野里,坚韧不拔的树木扎根于大地,世世代代守护着这片土地,在阳光和泥土之间默默伫立。这些大自然的忠诚仆从慷慨地为各种爬行、飞翔和蠕动的生命提供庇护和养料。它们以其广袤的绿色身姿展现着勃勃生机,既美观又实用。无论它们是成片地生长在绿色的海洋中,还是独自守护着一片田野,我们都应该对这些木质的守护者心怀敬畏。从微小的种子到参天巨树,所有大自然的奇迹都浓缩在这上帝赐予的伟大礼物——树木之中。

笔者在五月下旬写下这篇文章,灵感来自于周围生机勃勃的绿色生命。为了庆祝光合作用的季节,笔者特此推出一篇以树木为主题的像素博客。具体来说,本期教程重点介绍俯视角的设计方法,并运用了笔者早在第二期像素博客中首次探索的高效模块化方法。在本次更新中,笔者改进并扩展了这项技术,增加了多种叶子样式,并引入了针叶树的设计。

落叶树

先从一团树叶开始。

img

我们的目标是先绘制一团树叶。听起来很简单,但进行设计的时候需要格外注意:叶子的形状要做到多样化,且叶子团的整体形态应保持一致。保持一致性的最佳方法,是在基本几何形状的基础之上进行设计。上图例子中,基础形状为梯形,具体来说是一个菱形,对其进行细微修改来增加一些波浪感,让它看起来更自然。

重复使用相似的形状,是最大程度提高纹理辨识度的关键。同时,形状分布的均匀平衡有助于隐藏重复使用叶子组合时可能产生的图案。也就是说,任何形状或大小独特的叶子团都比较抓眼,使叶子组合的重复更加明显。形状、大小和空间分布一致的叶子团组合叶子时获得满意的的整体叶子纹理的关键。此外,要避免叶子组合的形状怪异。即使是球形叶子组合,效果也不错。

首先,制作一束中等色调的树叶。这束树叶可以用不同形状的叶子在不同的图层上构建。这样可以灵活地移动并调整图层顺序,直到满意。设计完成后,笔者会在共用的渐变色板上将所有色调向上或向下调整一格,分别创建一种较暗和一种较亮的变体。有了这三种颜色变体,笔者就可以根据假定的光源,以自然的方式将这些树叶束分层叠加,从而形成具有逼真三维形状和深度的茂密树叶。注意,要处理由于树叶束重叠而产生的难看的团块和杂散像素。树叶束的放置位置和图层顺序需要大量的尝试才能找到最佳排列,并最大限度地减少噪点。最终,核心的树叶束对于最终树木的外观至关重要。如果无法找到满意的排列,很可能是树叶团的设计有问题。如果树叶团设计得当,应该可以创建出完美的茂密树叶,而无需进行额外的修饰。

之后,最后一步是添加树干和阴影。树干的绘制比较简单,不过如果想象不出,可以先从一个基本的圆柱体开始,然后添加树皮纹理。树皮纹理应在树干中心最宽,向两侧逐渐变窄。在某些地方打断线条,添加树结或突出的树根,以增加自然的细节。阴影的大小和方向由光源决定。在游戏设计中,最实用的做法是将阴影直接放在树下,这样它就不会与其他物体重叠,但笔者喜欢将阴影投射到一侧,以获得更生动的效果。由此引起的任何问题都可以通过调整图层顺序轻松解决。

树叶的风格

现在,让我们来看看模块化方法的原理,并看看它在不同叶片类型下的适用性。

img

上面的第一个示例使用了一个小的 2x2 像素的正方形作为基本几何单元。笔者允许这些正方形在某些地方接触,但避免重叠,这样即使形成新的簇状结构,正方形单元的特征仍然得以保留。尽管与基本正方形相比变化不大,但由于形状小巧简洁,这种纹理不会让人感到单调乏味。这种纹理非常适合表现叶片较小的植物,或者根据颜色不同,也可以呈现出花朵的效果。

中间的示例是更纯粹的版本,使用了类似于教程 123 中的梯形,但这里没有应用细微的波浪形修改,因此形成了更锐利的几何纹理。这些锐利的形状清晰地展现了叶片的朝向,因此应该以自然的方式排列,使它们在叶束顶部向上倾斜,并向下旋转至叶束底部。

上面最后一个例子使用圆形作为基本几何单元来表示圆形叶片。与梯形叶片相比,这里叶片的朝向略微不那么重要。然而,要保持漂亮的圆形形状,同时使叶片簇看起来呈球形,这有点棘手。在所有情况下,着色对于突出深度都至关重要,尤其是在仅凭叶片簇本身无法清晰地看出朝向的情况下。

至于着色,笔者采用的方法与给圆形着色使其看起来像球体的方法相同。在上面所有示例中,首先在叶片簇的左下方创建一个月牙形选区,并使用非连续填充,每种颜色都比原色深一个色阶。然后,笔者在叶片簇的右上角创建一个较小的圆形选区,并用较浅的颜色填充。完成这些颜色填充后,可能需要进行一些清理和手动添加高光,以更好地突出叶片并减少噪点。每个叶片簇使用 4 或 5 种颜色就足够了。

针叶树

现在要稍微麻烦一些了。

img

从技术上讲,也可以称之为模块化方法,但它与之前的例子有很大不同,因为每个模块独一无二,并且位置固定。另外,笔者不能说这是一种绘制针叶树的捷径,但如果难以从零开始一次性画出整棵树,这种方法可以很好地分解绘制过程。就笔者个人而言,笔者并不擅长写实绘画,对笔者来说,最简单的方法是将主体分解成不同的部分,然后分层绘制。虽然这种方法有些繁琐,但仔细绘制每一根可见的树枝可以确保最终效果逼真。

首先,画一个简单的树干作为引导,然后从上到下绘制树枝,因为较低的树枝会被较高的树枝遮挡。在笔者实际绘制的过程中,笔者是从较低的树枝开始画的,结果很多细节最终都被覆盖住了。所以,要使巧劲。

树枝的方向对于画出自然形态的树木至关重要。首先,用一种填充色和一种轮廓色绘制所有树枝。中心附近的树枝是独特的,但在着色之前,所有侧枝都可以镜像复制到另一侧。

所有简单的平面树枝都绘制完成后,就可以根据所需的光源进行着色。着色过程可以从区分亮部、中间调和暗部的树枝开始。最终的着色细节比绘制叶簇要复杂一些,因为有些树枝会在下方相邻的树枝上投下阴影。最终,观察和练习是最好的学习方法,所以笔者不多说了,你们自己看图吧。

img

以下是我在游戏项目《Beast Planet》中运用模块化方法的更多示例。

最终感想

从上面的介绍可以看出,笔者对树木充满热情。这或许是人类的本能,因为自古以来,人类就与树木保持着互惠互利的关系。然而,笔者对树木的喜爱很大程度上源于我成长在一个树木稀少的地方。毋庸置疑,撰写这篇博客让我感到非常开心,但这并非出于自我陶醉。我们都喜欢树木,它们也经常出现在游戏和艺术作品中。此外,笔者最近一直在为我的游戏《Beast Planet》设计俯视视角的树木,我想分享模块化方法的演变过程以及我从实际应用中获得的其他一些心得。虽然基本方法与我在 Pixelblog 2 中的首次尝试大致相同,但这次的结果看起来要好得多。这证明了核心像素艺术技能的重要性,我认为这些技能主要体现在颜色选择和像素排列上。我不想这么说,但无论我的教程多么易于理解,这些核心技能的提升只能通过持续的练习才能获得。也许是时候在未来的 Pixelblog 中回归基础了。