Rush Rover 中闪烁特效制作解析

作者:radio
2016-07-07
9 26 6

编者按

本文系会员 Radio 的日志,因发现原日志不便于查找所以特转成文章供需要的朋友收藏留存。

特效制作解析

大家好,我是 Rush Rover 的开发者Radio,我挑选了游戏开发过程中一些有价值的经验并记录下来与大家分享,希望对各位开发者也有所启发。这篇文章将向大家介绍 Rush Rover 中,闪烁特效的制作思路。因为我使用的开发工具是 Game Maker Stuido(以下简称GMS),这个工具好像在国内不是太主流,外加自己表述能力不是太好,所以具体代码我就不详细解释了。这里着重给大家讲解下效果制作的思路,相信大家也能够在自己的的引擎中找到制作方法。

Rush Rover

游戏页面 去看看

首先我们先来看下效果

124-1466143148124-1466143361

最初这个效果,我想用帧动画来实现,不过这样有个缺点就是闪烁残影的随机性不强,而且sprite数量一多,工作量还是不少的。所以还是交给代码来处理吧。

接下来分析下思路

为了表现闪烁残影的效果,视觉上一般都会带有些动态模糊,外加些亮光效果。而我这个游戏美术风格属于像素风格。所以动态模糊方面的表现也就相对的“栅格”化一些。

这里有使用了1张图片作为闪烁的素材,其他图片分别是正常状态和爆炸时黑白闪光的图片。

124-1466143412

这里以着陆特效为例,来分析下代码绘制的大体思路

1.分析特效,为表现快速着陆效果,一般都会在纵向上使用动态模糊特效,以体现速度感。使用最后一张带闪光的图片,横向(X轴)随机分割成若干部分。

2.将这些分割后的图片在纵向(Y轴)进行随机的缩放拉升。

3.调整图片的位置,使图片看起来向朝一个方向做运动的感觉,做一些随机抖动的效果。

4.加入一些粒子效果。

124-1466143442

在游戏中每一帧(GMS里游戏运行的每一帧叫做STEP)让代码绘制上述的特效。这个效果就实现了。

124-1466143511

扩展下思路,按照同样的方法,使用一张闪光图片配合其他的sprite,你就可以制作出喷射,能量护盾等更多的特效来。

124-1466143555124-1466143511

以下是GMS中的代码,如果你使用GMS开发游戏,也许能直接COPY使用,但是如果其他引擎,那就按照上面的介绍自己整个。

在GMS中有一个绘制函数draw_sprite_part_ext(sprite, subimg, left, top, width, height, x, y, xscale, yscale, colour, alpha);

我利用这个函数扩展写了个SCRPIT,用于绘制着陆效果。

///draw_body_flash(spr,ind,x,y,dir,ss);
var spr, ind, xx, yy, ss, ff, fd, dd, sw, sh, tw, th, nw;
spr = argument0; //绘制的精灵图片
ind = argument1; //需要绘制的帧
xx = argument2; //绘制的X坐标
yy = argument3; //绘制的Y坐标
dd = argument4; //绘制的方向
ss = argument5; //随机抖动种子

sw = sprite_get_width(spr);
sh = sprite_get_height(spr);

nw = 0;
tw = 0;
th = 0;

ff = image_xscale;
fd = 1;
if dd == 270{
fd = 1;
} else if dd == 90{
fd = -1;
}do {
tw = ceil(sw / 8) + irandom(8);
if tw + nw >= sw{
tw = sw - nw
};
th = random_range(1, ss);
    draw_sprite_part_ext(spr, ind, 0 + nw, 0, tw, sh, xx - sw / 2 * ff + nw * ff, yy + sh / 2 * fd - irandom_range(0, 32) * fd - th * sh * fd, ff, th, c_white, choose(0.9, 1));
nw += tw;
} until(nw >= sw)

近期点赞的会员

 分享这篇文章

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

参与此文章的讨论

  1. eastecho 2016-07-08

    这篇技巧很实用的,尤其后来看直播的时候,感觉效果很不错啊

  2. ZackZ 2016-07-12

    不错 实用

  3. LT21 2016-07-14

    不错

  4. ChristianTam 2016-07-16

    很好,多谢分享

  5. forxidian 2016-08-18

    这个效果好酷炫!
    感谢分享~

  6. tanruiqiang 2017-09-15

    非常感谢大神的分享

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

登录/注册