【风农翻译】像素宝典 #1

作者:风农
2019-10-17
68 67 9

像素宝典

这是来自佩德罗・梅代鲁斯(Pedro Medeiros,@saint11)授权的一系列像素美术教程,由风农翻译整理。

佩德罗・梅代鲁斯最为知名的作品莫过于《塞莱斯特山(蔚蓝,Celeste)》,不过他持续在网络上发布的像素美术教程也同样相当知名。这里选择的教程就是经过风农翻译整理内容。

相关链接:

简单的闪光效果

这是个简单的闪光动画,最重要的就是时机的掌握。第三帧可以掠过大部分你想闪的区域。

可以只用左边的简单效果,或者插入一个空白帧后,再加上右边的额外闪光效果。甚至是只用这个额外的部分,取决于实际的效果。

简单的攻击动画

这个稍微复杂点,如何画个最简洁的攻击动画

做攻击动画最重要的一点就是让玩家输入后瞬间得到反馈。所以第一帧就要立即覆盖攻击判定区域,不要加预判动作,啥都别加。

整个动作非常的快,还要确保他返回到空闲状态。我通常会额外加一点回弹(第八帧),让动作更有趣一点。

风农:大家要注意这里说的是个简单的动画,如果你的目的是做出某种带有硬直的,或者有起手动作的动画,那肯定要加入一些预备动作的帧。

其实这里的重点是给反馈,无论是视觉上的还是听觉上的,要迅速的给玩家一个输入的反馈。

烟雾

每次处理烟雾,水花,火焰这种复杂系统的动画时,我会把这个系统分解成零件,再把这些部分分别画出来。

考虑一整团烟雾是如何运动的太复杂了,但是一个小的部分的运动相对来说简单一些。

最后那个例子是个循环烟雾的效果,跟另外几个的区别在于,我差不多每 4 帧就多生成一些烟雾。并且在第一帧延续最后一帧的粒子效果。以后我会对这个循环动画做一期教程讲解。

风农:最后那个循环动画,大家注意看,就是当烟雾快没了的时候,就再生成几个新的大块,同时最后一帧没有消散的粒子,在第一帧里延续下来。这样就循环起来了。拆开看更清楚。

攻击动画 tips

这个小 tip 是为了回答来自 Cam 的提问:

“如果剑在角色身前,该怎么画剑的动画?有什么区别吗?剑停在身后的时候那个弧线比较好懂,我想知道在身前的话该怎么画。”

好问题,如果剑在身前,直接把它往下移动看起来没什么力。有时候,剑,拳头,或者别的什么东西不在你想要的位置,你可能觉得要加个准备帧。这没错,但是这可以做个假。我通常会用个”风斩“,或者其他的模糊效果来模拟它。假装攻击是从你想要的位置发起的,而且极大的夸张了整个动作。玩家不会察觉到缺少了准备帧。另外一个技巧就是用长点的返回动画。

还有,声明一下,上个教程虽然没提,但是我们做的是”玩家的动画“。敌人的动画是应该有准备帧的。有些游戏里玩家也有准备帧,(像恶魔城 Castlevania)。后面我会在进阶一点的攻击动画教程里详细讲,但一般是需要遵守这条法则的,除非你想让玩家感到无力,或者让敌人不好预测,这类东西。

风农:教程里频繁出现 anticipation frame 这个词,我通常翻译为准备帧。这个概念可以在网上搜到,比如维基百科有个动画的 12 项基本法则,里面有这么一条:

预期动作(Anticipation)

物体从静止到开始动作前会有所谓的预期动作,可让观众能预知下个动作。例如从高空往下跳跃时会先弯曲膝盖再跳、正在跑步的人要停止跑步前会逐渐变慢步伐等等。在动画中适当加入预期动作不仅可增添生动性,亦可给予观众惊喜性。

感兴趣的可以去看看另外一些法则,如果你需要示例比对,可以去看猫和老鼠,这些东西基本都是美式动漫的风格。

下边中文的链接可能需要翻墙。

简单跑步循环

大家好像非常想要个走/跑的教程,这就来了。走/跑的动画还是很复杂的,我尽力做出了我能做到的最简洁的动作。我计划对这个主题再做几个教程,关注不同的部位,比如手臂,腿,头部运动,倾斜度等等。

对学习走/跑动画的同学,我最大的建议是注意头部的运动。即使手和腿的动作不太好,但只要头部动作够好,就可以让人信服。

现在我解释下为什么选这个跑步循环。可能很多人不会喜欢这个“跳起”帧,更想用“过渡位置”帧,像这种:

这种也完全 ok。这里只是我能想到的最简单的方式,来做出适合 platformer 类型的跑步动作。走/跑的动画很能体现角色的个性,所以会有无数种方式来做。

我倾向于“跳起”帧的原因是它非常容易复制,往下拉一两个像素,再稍微动动手和腿,就能得到个“下落”帧。我觉得这种方法做快跑动画非常高效。

另一个原因是,如果第一帧是个跳跃,就感觉角色瞬间扎进了动作里,让动画更有活力。

近期点赞的会员

 分享这篇文章

您可能还会对这些文章感兴趣

参与此文章的讨论

  1. Yosmos 2019-10-17

    woc!这系列!牛逼!

  2. 玉轮爱玩 2019-10-17

    舒服了

  3. vethenc 2019-10-17

    火钳刘明

  4. 牛得惊动党 2019-10-17

    这个教程的英文链接呢?

    • virmint 2019-10-18

      @牛得惊动党:发布在Pedro的推特和Patreon上

  5. 流贾君 2019-10-18

    他这一系列的教程真的非常优秀。持续学习。

  6. 虎山行 2019-10-20

    啊,好给力,每个都要学习一阵子

  7. lykyyy 2019-10-23

    兄弟,牛逼格拉斯,学习一哈

  8. 惠临神明的文学青年 2019-10-23 新浪微博会员

    这个系列的翻译太棒了,而且比起原版多了很多注释,期待接下来的更新

您需要登录或者注册后才能发表评论

登录/注册