What's kind of this technology such as moving pixels?

Take a look at this game

https://butcher.thd.vg/

I have no idea what's technology is using as blood splatters, lava, logo, screen transition, etc. It can handle million of moving pixels.

Do you have an idea what's using this?

Holy crap. That was fun! For splatter? It could be sprites for the gore and particles for the blood splatter. Particles for the small lava pixels as well, I'm guessing. How the bits of body parts go flying everywhere when the player kill an enemy, it seems to be physics.

Anyways, these are assumptions. I found it fun.

Its just pixels, there are no sprites. No individual objects other than the pixel.

My guess is the html5 canvas array with lots of tricks, and work, and math.

Sadly, C2 is probably a bit too bloated to do this.

Liero had a similar technology for blood and projectiles. Good times. My bet is that it's particles bound by physics.

Looking at the source it uses a pixel array of the canvas and set's pixels individually for all drawing. It doesn't use any of the higher level stuff such as drawImage like most other games in html5 uses. In that regard it's very different than C2. The advantage is it can do those oldschool pixel effects like old dos games, for example the level transition and the dripping blood. Also do to it being low res without any scaling or rotation, per-pixel collisions can be used everywhere. The disadvantage is it has to be low res to keep up the performance, and there is no rotations or scaling of the sprites. Also no doubt they do a lot of tricks to keep things as fast as possible.

What I got out of it that we might be able to use in C2 is a way to access pixels individually. The canvas kind of does this but things are inefficient. Basically reading pixels is pretty slow but it's much faster to write pixels, although it's probably not compatible with html5's other drawing methods. So maybe a plugin that allows you to manipulate an array of pixels that you can then copy to a texture. Only if events had zero overhead would it perform as well.

A shader could do the drawing maybe, but how to get the collisions?

Point by point in events?

Effects could probably do some of the pixel effects. The collisions would still need the pixels read from the image, effects are of no use for that. You can read the pixels now using the canvas. It's kind of slow as it is but if you read it ahead of time into arrays (this doesn't even need to be done in game) and just compare all overlapping pixels from the arrays.

So maybe a plugin that allows you to manipulate an array of pixels that you can then copy to a texture. Only if events had zero overhead would it perform as well.

If only there was someone who could create such a plugin

playable.

Looking at the source it uses a pixel array of the canvas and set's pixels individually for all drawing. It doesn't use any of the higher level stuff such as drawImage like most other games in html5 uses. In that regard it's very different than C2. The advantage is it can do those oldschool pixel effects like old dos games, for example the level transition and the dripping blood. Also do to it being low res without any scaling or rotation, per-pixel collisions can be used everywhere. The disadvantage is it has to be low res to keep up the performance, and there is no rotations or scaling of the sprites. Also no doubt they do a lot of tricks to keep things as fast as possible.

What I got out of it that we might be able to use in C2 is a way to access pixels individually. The canvas kind of does this but things are inefficient. Basically reading pixels is pretty slow but it's much faster to write pixels, although it's probably not compatible with html5's other drawing methods. So maybe a plugin that allows you to manipulate an array of pixels that you can then copy to a texture. Only if events had zero overhead would it perform as well.

After of reading this post, it was useful information, it makes me wonder you're capable to write a plugin to access pixel array, based from canvas plugin.

Do you think are you able to do it? sorry if it's too impolite to ask you to make a plugin.

The loading bar reminds me of the akihabara engine.

http://www.kesiev.com/akihabara/

Looking at the source it uses a pixel array of the canvas and set's pixels individually for all drawing. It doesn't use any of the higher level stuff such as drawImage like most other games in html5 uses. In that regard it's very different than C2. The advantage is it can do those oldschool pixel effects like old dos games, for example the level transition and the dripping blood. Also do to it being low res without any scaling or rotation, per-pixel collisions can be used everywhere. The disadvantage is it has to be low res to keep up the performance, and there is no rotations or scaling of the sprites. Also no doubt they do a lot of tricks to keep things as fast as possible.

What I got out of it that we might be able to use in C2 is a way to access pixels individually. The canvas kind of does this but things are inefficient. Basically reading pixels is pretty slow but it's much faster to write pixels, although it's probably not compatible with html5's other drawing methods. So maybe a plugin that allows you to manipulate an array of pixels that you can then copy to a texture. Only if events had zero overhead would it perform as well.

I've always loved the colour cycling effect http://www.effectgames.com/effect/artic ... HTML5.html

The author talks about accessing a pixel array, so I guess the implementation is similar to this game?

It's possible to do something similar with construct 2, for example when bullet hit the ennemies, it spawn red square sprites with physics behavior and apply "impulse toward angle" with parameter "bullet.angle-(180-random(your values))".

When this blood sprite hit the ground, you can keep it physics and being able to see the blood move under your feets, or it automatically spawn none physics red sprite on collision, and finally for the blood flow effects, this sprite check if he is overlapping with another instance, if it does it move down on vertical axis till condition become untrue.

I don't know if i was very clear but i could do a .capx example if you like. It's still an unperfect alternative, but it's quite effective if you're not looking for the exact same pixel technology.

BlueSkies

Yeah it's the same way to access pixels.

Logomachine

Physics would work in concept, but in practice it would be much too slow. A manual per-pixel motion as you describe would be a bit faster, but you'd need to implement most of it in js to get a useable speed.

BlueSkies

Yeah it's the same way to access pixels.

Logomachine

Physics would work in concept, but in practice it would be much too slow. A manual per-pixel motion as you describe would be a bit faster, but you'd need to implement most of it in js to get a useable speed.

You're right, it's CPU expensive, I tryed and i fall to 20FPS with ~500 sprite sized to 8x8 pixels on ground and wall.

Do you think get the position of the overlapping blood sprite, write his color to the ground/wall sprite, then destroy his instance would be effective?

Or does in engine like construct 2, run a plugin is the only way to get this result without killing the framerate?