AuthorTopic: Rapid animation for palette saving?  (Read 9159 times)

Offline Dusty

  • 0100
  • ***
  • Posts: 1107
  • Karma: +0/-0
    • View Profile

Rapid animation for palette saving?

on: January 13, 2011, 07:27:33 am
I'm a bit curious about this but I couldn't manage to get Photoshop to save a gif that animated rapidly enough to achieve the effect(or maybe that I wasn't doing it right, or that it might not even be possible).

I've seen a few games with strict limitations use flickering to achieve a pseudo transparency. For example the Zelda games on the gameboy flicker the shadow so fast that it looked transparent. What I'm curious is could this be done to make new colors if you're stuck with a limited palette?

For example: http://www.pixeljoint.com/2011/01/10/3358/Pixel_Art_Challenge-_Unportraitable.htm
You have this contest that gives you a limited palette BUT allows you to use animation. Would you be able to have two frames that alternate say... one of the colors to black to create a new, darker color?

I tried saving it in Photoshop but it seemed to animated way too slow in any browser I used to achieve the effect. But I know it has to be somewhat possible since games that run at 60fps pulled off the fake transparency fairly well.

Offline r1k

  • 0010
  • *
  • Posts: 270
  • Karma: +0/-0
    • View Profile

Re: Rapid animation for palette saving?

Reply #1 on: January 13, 2011, 08:36:11 pm
thats an interesting idea.  Ill post my results even though when I saved the animation it went too slow also (and could be even worse in a browser).  I viewed it origanally in game makers image editor at a speed of 100 frames per seconds, and the results were good.  I took this image from this weeks challenge:
http://www.pixeljoint.com/files/icons/full/datdood.gif
and then found 2 tone dither patterns that approximated each color in the pallete and made a two frame animation with each from using the new pallete derived from the dither tones.  When animated fast enough it looked basically exactly the same as the origanal image (except that the colors didnt mix perfectly to get the original pallete colors).  This shows that the effect is atleast possible if it animates fast enough, but getting that to happen in a browser is another task I guess.  I guess you could use it in a game maker game using a limited pallete at least :)
anyways heres the actual images I used



and this one is supposed to animate

(gif made with unfreeze, with frame delay of 0)
If its actualy possible to display the effect in a browser it would be cool if it was actually implemented into a weekly challange at pixel joint, even though enforcing it as a challange rule might be impracticle.

Offline Jad

  • 0100
  • ***
  • Posts: 1048
  • Karma: +0/-0
    • View Profile

Re: Rapid animation for palette saving?

Reply #2 on: January 13, 2011, 09:31:48 pm
A frame delay of 0 would mean that the animation doesn't show at all, doesn't it? You'll have to go with 1, I think .. ?

Right now the animation seems to be set to some kind of standard rate, since it plays fairly slow in FF, which usually displays gifs well.
' _ '

Offline Dusty

  • 0100
  • ***
  • Posts: 1107
  • Karma: +0/-0
    • View Profile

Re: Rapid animation for palette saving?

Reply #3 on: January 13, 2011, 09:45:10 pm
Hmm, 0 usually just animates it at the fastest speed, from my recollection. Though I even tried 0.0167s(~60fps) and it looked the same.

Closest thing I can remember to something like this was one of Helm's pieces:


Though I can't say it has the effect I proposed.
« Last Edit: January 14, 2011, 03:26:19 am by Dusty »

Offline Argyle

  • 0010
  • *
  • Posts: 269
  • Karma: +1/-1
  • Futuristic beep boop.
    • argylebox
    • http://pixeljoint.com/p/13899.htm
    • valsaurus
    • View Profile
    • ArgyleBox | Designs by Valouria Saurus (VERY OUTDATED)

Re: Rapid animation for palette saving?

Reply #4 on: January 14, 2011, 03:22:10 am


For the above listed gif, the speed that yielded the closest result without it either being a slower-than-intended looking flicker, and without as much random flicker gaps as the other speeds was within the range of 20-30 milliseconds (timing measure used by default in ProMotion). Ended up going with 21 in the end on a 60hz LCD laptop monitor using Firefox. Had to keep changing the timing because the way that it displayed in ProMotion's animation previewer was much more smooth and less delayed than it ultimately was displaying on Firefox - in ProMotion the timing I thought I was going to leave it at was 3ms  :lol:

It's still not a perfect flicker, and I'm sure it looks different for everybody looking at it. Between everybody using widely different sorts of monitors that have different refresh rates, operating systems, browsers... it'd be hard to achieve the effect successfully for every person that is going to look at it.  That's the end-all problem, and I think it is used successfully in some games, and this is purely speculation from a technologically ignorant person as far as where this is concerned, is because the makers of the games knew the exact hardware they were going to be displaying the graphics on..  If they knew that a delay of 1ms was going to display the shadow as a solid, semi-opaque shadow on the handheld display with 120hz refresh rate that (nearly) every person that was going to play the game would be using,  they could go that route to cheat the restrictions. But there are too many variables to nail down a formula for straight up images that you're just displaying on a browser.

I think it's still a neat idea and I hope you do end up making the portrait and uploading it to the challenge.  Even if it strobes a bit, and the people using IE just see slow palette swapping pictures, and the people using chrome turn into frog princes, I still think it will be received in a favorable manner.

Offline Dusty

  • 0100
  • ***
  • Posts: 1107
  • Karma: +0/-0
    • View Profile

Re: Rapid animation for palette saving?

Reply #5 on: January 14, 2011, 03:46:47 am
Ya I can definitely see the flicker, and it seems to be unsteady(sometimes it will appear smoothly other times it seems to slow down for a split second). Still interesting :)

Offline Helm

  • Moderator
  • 0110
  • *
  • Posts: 5159
  • Karma: +0/-0
    • View Profile
    • Asides-Bsides

Re: Rapid animation for palette saving?

Reply #6 on: January 14, 2011, 04:45:04 am
commodore 64 scene has been doing this since the dawn of time.

If you want my opinion, that way madness lies. I use flicker as a mood-setting thing, not to fake new colors. Making people squint to look at flix0r hell to see what colors you wanted to make is murder for the eyes, I think. The less notable the flicker, the more classy it is. And if you have free palette control (no matter how few colors you have to work with) then there HAS to be a better hand-picked color to use than a flicker-mode based compromise.

Offline Jeremy

  • 0010
  • *
  • Posts: 139
  • Karma: +0/-0
  • howdy
    • pixellerjeremy
    • http://pixeljoint.com/p/19218.htm
    • pixellerjeremy
    • View Profile

Re: Rapid animation for palette saving?

Reply #7 on: January 14, 2011, 05:50:09 am
From memory, a frame rate of 0.01 gets defaulted back to 0.10 in many browsers. I know I've seen a guide comparing different browsers...
Fake edit: Found it It has graphs and stuff  ;D

Basically, depending on the browser you can "safely" set delay to about 0.06 fps without it getting defaulted on most common browsers (Opera sux)

I can only guess that on the gameboy there weren't these limitations so they could trompe-l'oeil with a frame rate of 1/100 of a second everything on this line is pure conjecture
That set of dither interlaced-environments that was floating around a while back, with weather and other water effects, was flash-based wasn't it  ???

EDIT: @Dusty's actual question: Perhaps a dither animation could work, esp. with the peach tone, light green and light purple 'cos they're fairly similar in value.
« Last Edit: January 14, 2011, 06:05:03 am by Jeremy »

Offline Dusty

  • 0100
  • ***
  • Posts: 1107
  • Karma: +0/-0
    • View Profile

Re: Rapid animation for palette saving?

Reply #8 on: January 14, 2011, 06:04:36 am
That set of environments that was floating around a while back, with weather and other water effects, was flash-based wasn't it  ???
It was a method of palette swapping done via HTML5 :)

http://www.effectgames.com/effect/article.psp.html/joe/Old_School_Color_Cycling_with_HTML5

Offline ptoing

  • 0101
  • ****
  • Posts: 3063
  • Karma: +0/-0
  • variegated quadrangle arranger
    • the_ptoing
    • http://pixeljoint.com/p/2191.htm
    • View Profile
    • Perpetually inactive website

Re: Rapid animation for palette saving?

Reply #9 on: January 14, 2011, 06:56:43 am
I can only guess that on the gameboy there weren't these limitations so they could trompe-l'oeil with a frame rate of 1/100 of a second everything on this line is pure conjecture

I doubt that on the gb you will get more than 60 fps if even that. One of the features that helps on the GB to make the colour making via flicker work is how shit the screen is, it ghosts quite a bit, meaning the colours kinda stay there for a while and thus blend better.
There are no ugly colours, only ugly combinations of colours.