AuthorTopic: Geometry Dash style graphics (dev need help)  (Read 538 times)

Offline Paul whoknows

  • 0001
  • *
  • Posts: 4
  • Karma: +0/-0
    • View Profile

Geometry Dash style graphics (dev need help)

on: April 26, 2020, 07:13:42 pm
I'm an indie developer currently working in a rhythm game. I want to imitate GD's graphic style for this project.

At first glance I thought GD graphics were just ordinary/average vector graphics, but after putting some GD's .PNG files under the magnifier this is what I found:





Pixel art! or rendered vector graphics with some sort of dithering pattern filter, I can smell some wizardy there.

What graphic tool and/or what technique should I use to create art for my game in the same GD style?

Thank you.

Offline eishiya

  • 0100
  • ***
  • Posts: 1226
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Webcomic: Black Dram

Re: Geometry Dash style graphics (dev need help)

Reply #1 on: April 26, 2020, 07:59:38 pm
This isn't pixel art, it's just got a reduced palette, probably to reduce file size rather than for any specific artistic effect. The dithering looks like diffusion dithering, the default you get in most graphics editors.

From the uneven softness of some of the lines, it looks like this was first drawn larger, then scaled down. This is definitely automatic anti-aliasing with no manual polish. Effects like this and the cropping of sprites are easiest to do in raster, and I'm guessing this was done that way.

Offline Paul whoknows

  • 0001
  • *
  • Posts: 4
  • Karma: +0/-0
    • View Profile

Re: Geometry Dash style graphics (dev need help)

Reply #2 on: April 27, 2020, 02:04:19 am
This isn't pixel art, it's just got a reduced palette, probably to reduce file size rather than for any specific artistic effect. The dithering looks like diffusion dithering, the default you get in most graphics editors.

From the uneven softness of some of the lines, it looks like this was first drawn larger, then scaled down. This is definitely automatic anti-aliasing with no manual polish. Effects like this and the cropping of sprites are easiest to do in raster, and I'm guessing this was done that way.

Thank you for your reply. Sorry for calling this generics graphics "pixel art", I didn't mean to insult true pixel artists.

I tried exporting some vector graphics to a huge PNG file and then downscaling 4X in PS and I got some "nice" AA result, but nothing really close to the effect you can see in the GD graphics I posted.

If you zoom-in in the following images you will see some "dithering pattern/noise" but it is not ordinary noise or pattern, it looks really nice, not really sure how to obtain this effect, not even sure if this is handmade or automatic, and this technique is used in all GD graphics.






Offline Rydin

  • 0011
  • **
  • Posts: 915
  • Karma: +0/-0
  • ...zzzt...
    • @thickDumps
    • View Profile
    • thickDumps

Re: Geometry Dash style graphics (dev need help)

Reply #3 on: April 27, 2020, 07:22:33 am
I know how to recreate this effect but I'd have to charge ya  ;) :y:
Or at least trade for something cool...
...see it is an old tradition passed down from generation to generation.
An exclusive technique that requires specialized tools.
It is an alchemical process for which I will be ostracized if I make known to the public, so you must understand that I have to be careful about how I describe it...  :sry:

...but hypothetically if I was to do this look, I would start in the current version of Illustrator. Theoretically.
I would "hypothetically" make the primary shapes and add a glow.
This "asset substrate" would then be hypothetically transferred to a specialized tool called "Jasc Paint Shop Pro 7" (circa 2003) where upon "evaporating" a 256% color concentrated solution in graphics interchange format, these bizarre dither patterns and random dots will appear.
This "feature" can be found in much of my very first attempts at "pixel art" which one could theoretically see specimens of if they were so inclined...


2003!  :'(
A-hem... these are not mine... ...they... ...these must be from somebody else's hard drive... I don't know how they got on my hard drive I swear... I don't know what you're talking about...
...I was holding these for a friend...
But for sake of science...

Exhibit A:

(notice the similar color blend gradient to the white glow of the shapes)

Exhibit B:

(compare the "additional" dithering patterns on the concrete to your grey tiles)

Any more than this I am not at liberty to discuss, sadly.
 :lala:




« Last Edit: April 27, 2020, 08:02:26 am by Rydin »
Man cannot remake himself without suffering for he is both the marble and the sculptor.

Offline Paul whoknows

  • 0001
  • *
  • Posts: 4
  • Karma: +0/-0
    • View Profile

Re: Geometry Dash style graphics (dev need help)

Reply #4 on: April 27, 2020, 07:20:32 pm
Rydin, thank you! I followed your steps and it worked!

It was really easy, I tried to recreate this aesthetic look in my sprites using other tools like Photoshop but I couldn't get decent results, with PSP7 was so easy! I just reduced color count using error diffusion method and it worked flawlessly! I can say PSP7's error diffusion algorithm is the nicest one.

See it in action:

From this lifeless flat boring image:

To this crunchier and crispier image:




It reduces color count but doubles file size! definitely it's adding visual complexity!


Offline Rydin

  • 0011
  • **
  • Posts: 915
  • Karma: +0/-0
  • ...zzzt...
    • @thickDumps
    • View Profile
    • thickDumps

Re: Geometry Dash style graphics (dev need help)

Reply #5 on: April 28, 2020, 03:48:34 am
 ;)
For additional visual complexity consider .jpg on quality 1
Man cannot remake himself without suffering for he is both the marble and the sculptor.

Offline eishiya

  • 0100
  • ***
  • Posts: 1226
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Webcomic: Black Dram

Re: Geometry Dash style graphics (dev need help)

Reply #6 on: April 28, 2020, 04:31:10 am
TBH if I saw your "improved" image in an actual game, I'd assume the devs had no idea what they were doing re: compression. If you want to add subtle texture to otherwise boring flat areas, then add intentional, controlled texture using a texture overlay or a texture brush. In a game, you could even do it as an in-engine overlay on top of clean art for a more consistent look and to keep the assets compressing well.