Community
General and Everything Else => Everything-Else => Topic started by: troflip on July 23, 2015, 12:11:01 PM
-
Wow, how a look at what this artist can accomplish!
http://www.effectgames.com/effect/article-Old_School_Color_Cycling_with_HTML5.html
Does anyone know of any tutorials on how to accomplish stuff like this? I've been able to get some nice, but fairly basic, effects with SCI1.1, but nothing like this.
-
GrafX2 (http://pulkomandy.tk/projects/GrafX2), the modern pseudo-Deluxe Paint, has a gradient preview thing not unlike SCI Companion. I'm given to understand Deluxe Paint itself had a similar feature. I used it to design and preview a Sierra Logo-style cycle before I decided to go with a static image.
-
That's a great site. Beautiful work. It's definitely an artform in itself. I wouldn't know where to begin to develop dynamic artwork like that. Yes, Grafx 2 and Deluxe Paint both have palette cycle previewing. I like Grafx 2's ability to deal with modern formats, but Deluxe Paint actually has square/rectangular aspect ratio toggles for its tools (except for radial gradient fill, oddly) and a a few more features like gradient flood fills of a dozen or so different styles. Grafx 2 just has circle/rect gradient filled tools with a couple settings and that's it, but it does have capability to work in layers or GIF animation frames. I use both quite a bit for SCI work, though. They're the only good 8-bit image editors with palette tools out there that I've found.
Incidentally, Mark Ferrari, the one who created those cycling images, is the one who worked on some early LucasArts games (made with Deluxe Paint) and is currently working on Ron Gilbert's Thimbleweed old-school styled adventure game that was Kickstarter a little while ago.
-
I'd like to provide any functionality in SCI Companion that could help with producing/supporting artwork like that, but yeah, I don't know where to begin. There's some sample code to download on the page, but it doesn't work for me. It comes with a sample image (which presumably would be interesting to study), but it's in json.
Support for creating gradients and specifying palette ranges when importing images gets us partway there, but I'm sure there's more that can be done.
-
It comes with a sample image (which presumably would be interesting to study), but it's in json.
I actually once wrote a thing that turned cache-ripped json images into a more usable format.
-
At the very least, the idea behind his new "blend-shifting" palette cycling is to blend "frames" of the palette cycle together which utilizes 32-bit colour, really. I wonder if there's such a way to combine the functions of palANIMATE and palVARY to transition colour palettes while cycling at the same time to simulate the blend-shifting technique? I suppose it would require an awful lot of palettes for a single image and it may not look as smooth as the 32-bit examples, but it might be smoother than the regular 8-bit method....just thinking out loud.
-
It may be possible to emulate the BlendShift effect with PalVary if you generate the rotated palettes (all of them) manually. On each Room::doit, you'd check whether the current transition has ended and start the next one. It will probably be slow and it will stress the SCI resource system, but it just might work.
-
As far as implementing new features, one of the biggest ways Ferrari created these effects (especially dithered) was with stencil tools. That is, what I suspect he did (and he explains it a little in the Q&A on that site you linked to, troflip, I just haven't read all of it) was use single solid colours to represent different gradients and using the stencil tool to affect changes for only that colour so that when you use a gradient tool or any tool that one colour alone becomes the gradient canvas...am I making sense? Basically, the point is that to create images like this you'd have to duplicate the tools and functions of a major 8-bit image editor. Grafx 2 is free and Deluxe Paint II as well, it's easy to find around the net.
-
Yeah, that makes sense. I've been doing a similar thing in photoshop, basically.
- I use solid colors as a "stencil" to represent different palette cycling regions. This lets me easily select all pixels that correspond to that color
- Then I draw gradients across the selected pixels in a layer
- I export that layer as a png and import into SCI Companion, map it to a section of palette that has a gradient applied.
- Then I can replace the gradient with the actual colors I want cycled
I guess the rest is just artistry (lacking on my part).
-
Here's another example of palette shifting for more creative day/night cycling. Check it out.
http://www.effectgames.com/demos/worlds/
-
Nice. You can hover over the palette colors to see which index maps to which pixel. That's kind of useful.
I think one of the keys to the flexibility he's got going on in this pics is that he's using dithering extensively. If you have 32 colors, say, to define a smooth region in your image, that leaves you very few options for how to cycle that section of the image. But if you have just 6 dithered colors that cover the same range, you've got a lot more flexibility.
-
And here's a fresh take on converting these things. My tool takes scene.php output with the little bit of JS at the ends removed, and produces a BMP file which I then pass to PNGOUT with the /KP switch, resulting in...
-
Nice :-)
I was able to crop the png in photoshop and import it into SCI Companion with the palette intact :-)
-
I was able to crop the png in photoshop and import it into SCI Companion with the palette intact :-)
In that case:
cycles: [
{ reverse:2, rate:0, low:59, high:61 },
{ reverse:2, rate:0, low:62, high:64 },
{ reverse:2, rate:0, low:65, high:67 }
]
And about 25 time of day variations below the fold.
Edit: better picture.
http://i.imgur.com/U9hF4mN.png
cycles: [
{ reverse: 0, rate: 0, low: 232, high: 237 },
{ reverse: 0, rate: 0, low: 167, high: 174 },
{ reverse: 0, rate: 1536, low: 135, high: 143 },
{ reverse: 0, rate: 1380, low: 127, high: 134 },
{ reverse: 0, rate: 2304, low: 119, high: 126 },
{ reverse: 0, rate: 1536, low: 217, high: 223 },
{ reverse: 0, rate: 2841, low: 210, high: 216 },
{ reverse: 0, rate: 2841, low: 203, high: 209 },
{ reverse: 0, rate: 2841, low: 196, high: 202 },
{ reverse: 0, rate: 2841, low: 189, high: 195 },
{ reverse: 0, rate: 2841, low: 182, high: 188 },
{ reverse: 0, rate: 2841, low: 175, high: 181 }
]
-
Both of those sites have been around for years. It would be great if some kind of similar functionality could be added to Companion. Anyway, for the day night cycles it might be nice to track down where this was done in the QfG VGA games, those those only shifted by entering a screen, not while ego is already in that room.
-
I tried implementing this in SCI (see attached), but it doesn't look as convincing.
The palette colors are different than the ones that appear for this image on the website (edit: oh ok, these are for the cloudy waterfall scene, they look ok). I don't know if that's the issue, or perhaps the timing (not really sure how the SCI palette animation speeds tie into actual speeds).
Maybe someone else can poke around with it?
(note that the high index for palANIMATE is exclusive... I'm pretty sure I have the ranges right)
-
Anyway, for the day night cycles it might be nice to track down where this was done in the QfG VGA games, those those only shifted by entering a screen, not while ego is already in that room.
Do they just lighten/darken/tint the scene, or is there something more complicated going on? Like where different sides of objects get lit different amounts different times a day?
-
No, it just tints the whole palette red (for sunrise/sunset) and blue (for night) in QFG. That can already be done now with the recent addition of palette tinting to SCI Companion. This method doesn't have the advanced shadowing/colouring shifting that Ferrari's screens do.
One thing about dithering is it looks much better in hi-res 640x480 than it does in 320x190, which is probably why not many have tried dithering with palette shifting in low-res games before.
Kawa, do your conversions create 8-bit PNG files with the indexed palettes intact? When I try opening the PNGs you posted in PSP, it opens as a 32-bit colour image without a palette. It's obviously very important for indexed colour images (especially with colour cycling) to keep the palette entries exactly as they are originally in 8-bit.
EDIT: I see that they do. I need to stop thinking that copying and pasting an image copies it exactly in its format.
-
Kawa, do your conversions create 8-bit PNG files with the indexed palettes intact? When I try opening the PNGs you posted in PSP, it opens as a 32-bit colour image without a palette. It's obviously very important for indexed colour images (especially with colour cycling) to keep the palette entries exactly as they are originally in 8-bit.
Affirmative.
This is in fact what the /KP switch I mentioned is supposed to ensure: Keeping the Palette.
-
Ah, edited before I saw your post. Yeah, I realized that they do. I had copied the image and pasted into PSP, which loses all original data and creates a 32-bit image.
Would you release this tool? :D
-
Ferrari states that some gradients in his images' palettes are cycling at different speeds than others. This isn't possible in SCI is it? It has basically a forward and backward flag? I suppose you could delay it and make it slower, but you can't really speed it up beyond the game's cycle speed eh? That might be enough, I guess though.
8-bit art is so interesting! Working with indexed colours and stencils is almost like working with layers! That's the only way Ferrari could have had as much individual control over each section of an image as he did. I'm almost sad that we don't have a version of SCI that can compile SCI32 scripts for 640x480 games. It's like an untapped 8-bit dream. I'm sure there is much we can do with SCI1.1 as well, though.
-
Ah, edited before I saw your post. Yeah, I realized that they do. I had copied the image and pasted into PSP, which loses all original data and creates a 32-bit image.
Would you release this tool? :D
I'd rather not, but I'll gladly describe how I did it.
- Rip a scene.php file from cache.
- Remove the bits of JS at the ends -- CanvasCycle.initScene( ... );
- The program loads the resulting near-JSON (it has unquoted keys but my self-rolled library doesn't give a shit) and a 640?480 8bpp bitmap file prepared earlier.
- The palette data is taken from /base/colors, which is [R,G,B] and written to the bitmap's palette area (starting at 0x36) in BGRA order -- the A is zero. (Yes Milwaukee bitmap files can have alpha layers, just look at the Windows 7 Start button.)
- The pixel data is from /base/pixels, and is written to 0x436... upside down, because bitmaps are weird like that. The height is actually set to -480 and many readers may refuse a positive value.
- pngout v08.bmp /kp
- Color cycle information is in /base/cycles.
To do the time of day variants, use the values from /palettes/id/colors instead, where id is any of the entries in /timeline.
Edit: also, you can find out which scene.php file to grab by looking at scenes.js -- the name field for "Jungle Waterfall" is V08, so find a scene.php with "filename:'V08.LBM'" near the top.
-
Ferrari states that some gradients in his images' palettes are cycling at different speeds than others. This isn't possible in SCI is it? It has basically a forward and backward flag? I suppose you could delay it and make it slower, but you can't really speed it up beyond the game's cycle speed eh? That might be enough, I guess though.
Can't go beyond a certain speed, no, but you can definitely cycle different ranges at different speeds. So that part is possible.
8-bit art is so interesting! Working with indexed colours and stencils is almost like working with layers! That's the only way Ferrari could have had as much individual control over each section of an image as he did. I'm almost sad that we don't have a version of SCI that can compile SCI32 scripts for 640x480 games. It's like an untapped 8-bit dream. I'm sure there is much we can do with SCI1.1 as well, though.
Lol, if only I had infinite time, I would probably make SCI Companion support SCI32. I don't know how similar the resource formats are, so I have no idea how difficult a task it is.
-
It looks like I misinterpreted the "rate" in the original list of palette ranges and speeds. Lower rates are slower, which is the opposite of SCI.
In SCI, a palette animation speed of 8 will be twice as slow as 4, etc.... The only exception is 1 (i.e. 1 is not twice as fast as 2), probably because it's running right near the frame rate.
Anyway, if I can figure out what "rate" means for the original animations, I can see if I can get something better.
[edit:] Ok, it looks like the png kawa provided has some incorrect indices. For instance, there is no index 198 anywhere in the picture, but there is a cycling range range from 196 to 202 (of which 198 is a key part, if you look at the original "jungle waterfall afternoon" on the website).
I dunno if the data was pulled from the wrong file (the images look nearly exact, it's just a handful of indices here and there that are absent), or there's a problem with kawa's tool, or an issue with saving it as a png despite "keep the palette".
-
I dunno if the data was pulled from the wrong file (the images look nearly exact, it's just a handful of indices here and there that are absent), or there's a problem with kawa's tool, or an issue with saving it as a png despite "keep the palette".
Trust me, what you see there is the actual palette data as described. If you set the time on the site just right...
-
I don't doubt the palette ranges are correct. The image data is wrong though. Compared to the image on the site,
195 is absent and those pixels that were 195 in the original, are 192 in the png you provided.
198 is absent and those pixels that were 198 in the original, are 196 in the png you provided.
So 192 and 196 got "doubled up", so to speak.
-
If it weren't for the byte order, it'd be a straight copy. I don't see how my conversions can be "wrong".
-
I'm not sure what's up. It doesn't quite look like bytes were just "overlapped", but your image is definitely different than what's here for "jungle waterfall afternoon", based on hovering the mouse over the palette on the right:
http://www.effectgames.com/demos/canvascycle/?sound=0
The top one is index 192 highlighted on the site.
The bottom one is index 192 in your png.
And if you load your png into SCI Companion and look at the palette, you'll see there are missing indices in the middle of palette cycle ranges. In fact, for the main waterfall, there's a missing index every 7 palette entries (and the 5 cycling ranges for the waterfall are all 7 entries in length). So it's almost like the image was captured in mid-transition or something..
-
The missing entries could be a time of day thing.
-
Lol, if only I had infinite time, I would probably make SCI Companion support SCI32. I don't know how similar the resource formats are, so I have no idea how difficult a task it is.
Oh, I know. I wasn't requesting it. That would be far too much work and we've only started finally getting SCI1.1 together. There's no need. AGS can do colour cycling as well, after all.
-
I'm almost sad that we don't have a version of SCI that can compile SCI32 scripts for 640x480 games. It's like an untapped 8-bit dream.
Had a change of heart? ;)
-
And SCI32 is where ScummVM is hung.
-
No, I've always wanted to be able to reproduce all forms of SCI :). SCI32 IS much more intriguing to me now with these colour cycling possibilities. Especially since no SCI32 game Sierra made has ever taken advantage of palette shifting...to my knowledge. Certainly not to this degree. Of course, I've no where near the skill of Mr Ferrari anyway.
-
The "starfield" effect in the SQ6 startup menu is implemented with palette cycling. There are other uses of palette effects, some subtle, some not so subtle (QfG4 night palette for example). There are several new palette-related calls (PalCycle, RemapColors) and some extra subfunctions in PalVary that we haven't figured out yet. To find uses of RemapColors, you can scan the view resources for uses of a solid color (in GK1, it's usually bright red) with palette indices 236-254. When remapping is enabled, these colors overlaid on something else transform the underlying image in some way (gamma adjustment for sunbeams, transformation to greyscale, translucency and one or two others).
-
Mark Ferrari (the artist behind the webpage), recently gave a talk at GDC about 8-bit art and also talked in length about the pallette cycling techniques he developed/used:
http://www.gdcvault.com/play/1023586/8-Bit-8-Bitish-Graphics (http://www.gdcvault.com/play/1023586/8-Bit-8-Bitish-Graphics)
On a related note:
I recently had a chat with Richard Aronson (http://www.mobygames.com/developer/sheet/view/developerId,11811/) who worked as a programmer at Sierra and ImagiNation Networks (but most of you will likely recognise him as the voice of Cedric from King's Quest 5 :P). He told me the following story:
We planned our palettes in VGA (256 colors at any time from a total potential palette with 65536 choices to make the palette) with a base palette of colors available in every room of the game (64 colors, IIRC) and the other 192 colors were chosen depending on the room. For the scene with Robin and Marian behind the waterfall in ?Conquests of the Longbow?, almost all the 192 were shades of blue, as both Robin Hood and Marian were in the base palette. The lead artist and I created some shifting colors with different blues and translucency to make the water seem real, and it was the best water animation ever to that point. Most of the things I?m proud of at Sierra had more to do with story or programming cleverness, but that was the one art thingy that?s worth mentioning (I?m not an artist).
I think the scene he was talking about is this:
https://youtu.be/toT0mhXrKqM?t=399 (https://youtu.be/toT0mhXrKqM?t=399)
-
Hmm, in that scene the man and woman are mostly using the room's palette, not base palette. Not to mention that's about the most unimpressive water animation I've seen, lol!
Maybe he's mistaking it for another scene?
-
Maybe he's mistaking it for another scene?
Maybe I'm mistaking it for another scene.
Since he didn't specify the room number, I tried to find the one that seem to be the best match.
Can you find a better water pallette cycling animation in that game with Robin and Marian?
Some of his details can be wrong, since it's been more than a few years... :)
-
No, but there are some nice waterfall animations in other games (Quest for Glory series has some I think).
Or maybe he worked on that scene he mentioned, but then they canned it for the official release and went with a more colorful (less animatey) version?
-
I didn't even watch the whole presentation but holy shit did I learn a few things today.
-
Yeah - this guy knows his stuff! :)
-
Hmm, interesting video... and just so happens I met a game designer that works on Thimbleweed Park last Thursday, lol. Small world!
-
Will be watching this today! Thanks!
-
Really enjoying this video hearing about these things from the 8-bit master himself. I really wish I could download this video as it's full of valuable information. Everything he's talking about with colour cycling to feign animation and palette shifting to different hues (day/night) at the same time is all possible in SCI and that's what's really exciting. It would be especially impressive in SCI32 being in higher res where the dithering used to feign alpha transparency can be really effective. But it's still incredibly impressive in standard VGA as well.
EDIT: Wow, just getting to his explanation of how he did the colour cycling for the waterfall. It's surprising when you can only think of how complicated it must have been to see that he actually took some quite simple shortcuts. Only the very basic first iteration was done by hand, and little else. I mean, it's still a slightly complicated set of steps, but once you've got the mechanics of how that works down, the steps themselves are easy. Just brilliant.
-
When I have some more time to watch it all, I'll be curious how it compares to the steps I used in my demo for palette cycling...
-
Incidentally, Mark Ferrari, the one who created those cycling images, is the one who worked on some early LucasArts games (made with Deluxe Paint) and is currently working on Ron Gilbert's Thimbleweed old-school styled adventure game that was Kickstarter a little while ago.
Ron is in my co-working space today running playtests for Thimbleweed Park :P. Maybe I'll see if I can get in on future playtests...
-
Say what now? How's that?
-
I started going to a gamedev co-working space last week, and one of the designers on the game also happens to go there. Today Ron (and his little dog) came in and they ran some (very long) playtesting sessions.
I grew up with the Sierra games, not the Lucas Arts games, so I didn't really know who he was...
-
Wow!
-
WOW!
Tell him you loved his "Space Quest" series... ;)
-
Tell him you loved his "Space Quest" series... ;)
lol ;D
-
WOW!
Tell him you loved his "Space Quest" series... ;)
And Roberta Williams' "Monkey Island" series?