The Daily Click ::. Forums ::. Digital Works ::. My Game Engine
 

Post Reply  Post Oekaki 
 

Posted By Message

Sketchy

Cornwall UK

Registered
  06/11/2004
Points
  1960

VIP MemberWeekly Picture Me This Round 43 Winner!Weekly Picture Me This Round 47 WinnerPicture Me This Round 49 Winner!
13th February, 2020 at 13/02/2020 11:03:08 -

A while back, I was working on my own small Javascript/WebGL2 "game engine" (technically, it's more of a rendering engine, with a few extra game-related features bolted on).

I managed to get everything working, but just recently I've been thinking about making it more "retro", by forcing indexed-color and allowing palette swapping and cycling effects, and replacing 8-bit alpha channels with dithering.

Here you can see a tilemap, some animated sprites and alpha-dithering in action:
Image

Unfortunately, the alpha-dithering effect has quite a big effect on performance at the moment, but there's probably room for optimisation. The current version is using a 4x4 Bayer matrix ( https://en.wikipedia.org/wiki/Ordered_dithering ), and can manage about 12,000 sprites at 60fps on my laptop; the previous version used an 8x8 matrix, which did look a lot smoother, but limited the sprite count to an unacceptable 1500 sprites at 60fps.

The next step is to try and implement indexed color, which first means finding a way to load palette-based images. PNG would be ideal, and GIF would be alright too, but they're both far too hard to work with because of the way in which they compress the image data (the price you pay for a very small file size).
Happily, I've found another option - Truevision TGA or TARGA files ( https://en.wikipedia.org/wiki/Truevision_TGA ), and already written a tool to load them.
Next I just need to generate a texture where the index of each pixel is stored in its red channel, and then the fragment shader can use that to look up a color from another texture containing the palette(s). And hope it doesn't hurt performance too much...

 
n/a

Entura



Registered
  26/08/2017 19:47:58
Points
  336
13th February, 2020 at 13/02/2020 20:50:42 -

If you want me to test this, feel free to ask away, as I'm currently duty-free

 
Self taught artist | FL Studio junior | JRPG enthusiast | Creator of Dunyne | Obsolete ScottGames hunter

Twitter - https://twitter.com/Convert2Double
Reddit - https://www.reddit.com/user/Convert2Double
Tumblr - https://convert2double.tumblr.com/

Personal enquiries: fergusonbucky91@gmail.com

With the equation of a thousand splendid suns, everything nowadays goes faster than it should.

Strike a smile and never run a sad mile.


Sketchy

Cornwall UK

Registered
  06/11/2004
Points
  1960

VIP MemberWeekly Picture Me This Round 43 Winner!Weekly Picture Me This Round 47 WinnerPicture Me This Round 49 Winner!
14th February, 2020 at 14/02/2020 14:21:33 -


Originally Posted by Entura
If you want me to test this, feel free to ask away, as I'm currently duty-free



Thanks I don't think it's quite at that stage yet though - not least because it requires Javascript coding (it's not a visual game editor like CF2.5), and I haven't documented any of the objects and functions yet.

On the plus side, loading of .TGA files is now pretty much working!
Image

The red component of each pixel is actually its palette index - so the next step will be to modify the sprite shaders to look up an actual RGB color from a palette image (and the same for tilemaps).

The only awkward issue is that .TGA files (or at least the ones saved by PaintShop Pro) save the pixel data in one continuous stream, but using the order left-to-right and bottom-to-top(!), so for now I've had to flip the spriteset image!

 
n/a

Sketchy

Cornwall UK

Registered
  06/11/2004
Points
  1960

VIP MemberWeekly Picture Me This Round 43 Winner!Weekly Picture Me This Round 47 WinnerPicture Me This Round 49 Winner!
15th February, 2020 at 15/02/2020 18:40:25 -

Indexed color display mode and dithered alpha are now fully working for sprites

One sprite, many palettes:
Image

Next is to add the same features to tilemaps, and then try to fix a bug with scrolling...

Edited by Sketchy

 
n/a
   

Post Reply



 



Advertisement

Worth A Click