Jump to content
Synthpopalooza

Character flipping for extra colors - a primer

Recommended Posts

While working on my Sky Scraper game, I decided to try a technique to try to get extra colors in an attempt to save on DMA cycles.  This technique is known as Super IRG on the Atari 8-bit, but the concept is that you double buffer a font, and switch out the fonts every screen redraw.  The resultant effect blends the colors together, and increases the color resolution per character while not eating up DMA time.

 

Thus far, I have found the following Atari display modes useful:

160A:  When interlaced, you can get 9 colors plus BG per character, with the option to use 8 total palettes.

 

160B:  This one allows 90 colors plus background, with the option for a second 90 color palette.  Because it's 160B, it will use a lot of DMA render.

320B:  This one allows 9 colors plus BG, requiring Kangaroo mode to be turned on.  A second 9 color palette is also available.  Also uses DMA time.  However, using the techniques in the recent Rikki and Vikki game, this is a useable mode for games if done properly.

 

To do this, both fonts have to be stored in the same graphics block.  Each screen redraw you change the character pointer.  A technique called checkerboarding has to be used, where when using fields of one color, you blend the colors on alternating pixels.  Each color is created by blending two colors from the mode's base palette.

 

The colors created in these modes are new colors which are not in the standard Atari 256 color palette.

 

As an example in 160B, here is a sample palette I cobbled together.  The colors in here are approximations, but each of the 90 colors are freely usable in 160B mode using this blending technique.

 

I am getting some help putting together a demo which will show what this display mode is capable of.

 

 

160B interlace color table example.png

Edited by Synthpopalooza
  • Like 4

Share this post


Link to post
Share on other sites

In addition:

 

This post details the process I used in designing the logo screen for my Sky Scraper demo, using interlaced 320B at 10 colors per character.

 

 

It gives a fairly good explanation of how to design characters in this mode, and the process works fairly well when doing 160A mode as well.

  • Like 2

Share this post


Link to post
Share on other sites

The other mode I am going to experiment with is 320D, the icky certain colors in certain columns mode.  Using this technique, I believe it may be possible to recreate the standard 320B mode (4 colors per character at 320 pixel resolution and 2 palettes) but without the DMA costs involved.  320D uses the same DMA time as 320A.

How 320D arranges pixels ... well, in one setting, in the first columns, you get the Background plus a color (BG plus C2).  In the second columns, you get C1 plus C3.  To use this interlace, set C1 equal to the background color.  Next, when you swap out the fonts each cycle, you also swap C1 and C3 palette values as well, so that all the colors are visible in all columns.

 

So in effect, you get 4 colors per character:  BG, C2+BG, C3+BG, C2+C3.  A second palette is available with three extra colors possible.  The colors will interlace over vertical 320 pixel stripes which should not be horrible on the eyes.

 

 

  • Like 1

Share this post


Link to post
Share on other sites

My next project:  write a color palette tool for the 7800 which will be executable from the emulator that will let you actively select the 12 colors of 160B and see the interlacing results on a full 90 color palette.  With this, it might then be possible to do a frame blended screenshot and use that to design characters and screens.

  • Like 1

Share this post


Link to post
Share on other sites

A preliminary palette test of 160B.

 

This DOES NOT have all the colors in yet.  I have done about the first 45 colors of the palette only.  But it gives you a sample of what is possible.

 

The interlace effect will look better on an actual NTSC TV.  PAL systems tend not to display this as well.

 

The goal is to have an interactive display where you can adjust each of the 12 color registers to arrive at your desired palette settings.

 

Also inserted the source code in 7800basic, and the source font images. 

 

To do still is, design the rest of the color blocks, then put in an interactive color editing function.

 

 

palette160B_tileset1.png

palette160B_tileset2.png

palette-tool.bas.a78 palette-tool.bas

  • Like 1

Share this post


Link to post
Share on other sites

a Screenshot ... does not accurately represent what is being displayed because it only does one frame at a time.

 

The unique blended colors so far are evident in the first four rows of the display.

palette capture.PNG

  • Like 1

Share this post


Link to post
Share on other sites

Keeping in mind this is just the first palette.  There still exist 90 more colors waiting to be unlocked in the second palette.  😁

 

The other thing to keep in mind:  The blended colors created do not exist in the standard Atari 256 palette and are in fact entirely new colors!  It is also possible to create false greys or off-greys by blending from opposite sides of the color wheel (red-cyan, blue-yellow, green-magenta).  And any of the 90 colors created are freely placeable anywhere in the character.  

 

 

Edited by Synthpopalooza
  • Like 2

Share this post


Link to post
Share on other sites

Be very, very careful testing out advanced graphics techniques using MAME/MESS or any other emulator as it may not be the same as actual hardware.

  • Like 2

Share this post


Link to post
Share on other sites

Yes ... this is especially true when it comes to the 320 pixel stuff.  The 320D experiment I mentioned earlier, for example, should work in theory.  But in practice, pixel artifacts on a CRT can cause unpredictable results.

  • Like 1

Share this post


Link to post
Share on other sites

The other cautions:

 

Color combinations where the luminances vary by more than a few steps will show more shimmering.

 

The effect will not be as nice on a PAL console because of the slower refresh rate.  The colors will be off as well.

 

If you are doing a scrolling animation, the scrolling has to be done every 2 frames.  Artifacts may also show when sprites move atop the graphics.

  • Like 1

Share this post


Link to post
Share on other sites

This effect can effect can also be done on sprites as well as characters, but at these costs:

 

You will need 2x the sprite memory because you will have to double buffer any sprite animations that use the extra colors.

 

You can only move or animate such sprites every 2 frames, meaning your sprite will move and animate at 30 cycles per second (25 PAL).

Share this post


Link to post
Share on other sites

320D interlace test.

 

An explanation first ... 320D uses a funky setup.  Firstly, to properly use the interlace, you have to set P0C1 and P4C1 to the same value as the BG color.

 

Secondly, when you flip character fonts, you also have to swap P0C2 with P0C3 and P4C2 with P4C3 so that the colors get spread across the whole screen.

 

I have done a crude palette test.  The four palettes are laid out as follows:

 

Palette 1:  BG, P0C2+BG, P0C3+BG, P0C2+P0C3

Palette 2:  BG, P0C3+BG, P0C2+BG, P0C3+P0C2

Palette 5:  BG, P4C2+BG, P4C3+BG, P4C2+P4C3

Palette 6:  BG, P4C3+BG, P4C2+BG, P4C3+P4C2

 

The interlacing happens on vertical 320 pixel strips, and each color is freely placeable in an 8x8 character grid.  This is the equivalent of 320B, but without the DMA costs incurred.

 

Screenshot on real hardware, please.  I want to see how this looks, and if the artifacting comes into play.

 

The other palette settings may be of use, but require different register settings and swaps.

 

 

 

mode320D_1a.png

mode320D_2a.png

320Dtest.bas 320Dtest.bas.a78 320Dtest.bas.asm 320Dtest.bas.bin

Share this post


Link to post
Share on other sites

A font test in 320D interlace.

 

Three colors of the letter A, in each of the four palettes, plus some graphic characters which show all three colors in each character.

 

Again, some screenshots on real hardware would be appreciated to see how this looks.

 

 

mode320Dfont_1.png

mode320Dfont_2.png

320Dfont.bas 320Dfont.bas.a78 320Dfont.bas.asm 320Dfont.bas.bin

Share this post


Link to post
Share on other sites

A differing effect is had if you use the other four palettes without color flipping.  In this case we set P0C1 and P4C1 to a different color than the background.

 

Palettes 0 and 4 have only 2 colors plus BG, but palettes 3 and 7 appear to have 5 colors plus the BG!  It remains to be seen if these are independently programmable.

 

Edit:  6 colors plus background.  It's all due to a 320D quirk in palettes 3 and 7, to where a bitpair of 00 returns the BG color, but in bit pair combinations of 01 or 10, the 0 will return P0C1/P4C1 instead!  This increases the number of blended colors to 6 per character, though these aren't independently programmable.

 

Again, a screenshot from real hardware will tell the tale.

320Dfont2.bas 320Dfont2.bas.a78 320Dfont2.bas.asm 320Dfont2.bas.bin

Edited by Synthpopalooza

Share this post


Link to post
Share on other sites

A slight update on the 160B interlaced palette ... all 91 color combinations are in!

 

I haven't yet organized the two grids yet, but now you can see both palettes of colors.  Each palette has 90 colors freely usable.  At the bottom, for each palette, is a sequential listing of the 90 colors on each palette.

 

For palette 1:  red, green, blue, yellow, 3 lumas each

For palette 2:  cyan, magenta, orange, grey, 3 lumas each

 

Next steps:  Ability to change each of the 12 color registers plus BG to see exactly how color changes affect the 90 colors.

 

 

palette160B_tileset1.png

palette160B_tileset2.png

palette-tool.A78 palette-tool.bas palette-tool.bas.a78 palette-tool.bas.bin

Edited by Synthpopalooza
  • Like 1

Share this post


Link to post
Share on other sites

All 91 colors are in and arranged, across both palettes.  Below is a screenshot, although it doesn't do the blending.  Real hardware (NTSC) does a better job.

 

Below the palette display, are the 12 base colors from which the remaining additional colors are mixed.

 

Next step is to allow the colors to be altered to see the effects.  In the meantime, you can play with the code to see what color combinations can be had.

 

Trebor:  screenshot for this please, and also the 320D demos ... very keen to see how they work on real hardware.

 

Remember:  Any of the 91 colors per palette are freely placeable within a character or sprite.  When using moving sprites or scrolling backgrounds, you have to animate, move, or scroll at 30 fps (25 PAL) or the effect will not work.

 

 

palette-tool.png

palette-tool.bas palette-tool.bas.a78 palette-tool.bas.bin

  • Like 1

Share this post


Link to post
Share on other sites

Best I can do for now.  All captures are from under a CRT courtesy of CPUWIZ's MCPDev cart - but look much better - and more saturated - in person:

 

160B:

 

IMG_1080.thumb.JPG.819969f11dc869a3eb5ea6a61fdcc763.JPGIMG_1079.thumb.JPG.dbd91ba8a3ecab37198dbfc7f926fb6d.JPGIMG_1078.thumb.JPG.d2d37c48415687e2b8c98e641895365b.JPG

 

 

 

320D:

 

IMG_1092.thumb.JPG.89b1ca8b78ba1d8d73f89574157a2e13.JPGIMG_1090.thumb.JPG.51534fd48e3fe3a583cdb66b9a7e1e5a.JPGIMG_1086.thumb.JPG.2979079b1aae102eeff2b57ef70af1dc.JPG

 

 

 

320Dv2:

 

 IMG_1102.thumb.JPG.02060889d9c2d68628746600f5117652.JPGIMG_1100.thumb.JPG.c403deafef436fa1a53c4dedc4e8dd6a.JPGIMG_1098.thumb.JPG.44501817cfa99cdaec9d8cd53e5823a8.JPG

 

 

Comments:  Under a CRT, 160B test in real time has the fourth row, and then every third row after that, with flickering that is very noticeable.  All other rows appear solid.  Under an LCD, it appears just like the screen captures you posted earlier.  I can post 160B test pictures sometime tomorrow taken from the LCD, if desired.  Colors are vibrant regardless if CRT or LCD.

 

However, the 320D fonts appear very dark under my Panasonic LCD.  Version 1 is not even usable, IMHO.  Version 2 is better, but it is still a struggle.  Again, I can get up some (potato quality) photos tomorrow from the LCD, if desired.

  • Like 2
  • Thanks 2

Share this post


Link to post
Share on other sites

That would be helpful.  I am wondering if changing the brightness on the 320D letters would help.

 

Maybe not on scoring fonts, but I am wondering if it can be used on game elements that don't need to be legible. 

 

Regards 160B:  Some of the bright rows have luminances which vary by more than one step, and they tend to flicker more.  Those colors are probably best used minimally.  This is a limitation I came across before when experimenting on the Atari 8-bit computer.

Edited by Synthpopalooza

Share this post


Link to post
Share on other sites

I just noticed in the 160B demo ... Color number p7c1 very last column top row on the base color display at the bottom ... it should be a dark grey, but it does not seem to be showing up at all in your photos.

Share this post


Link to post
Share on other sites

A preview ...

 

I will detail the process later of designing graphics in 160A interlace.  This is a very useful mode, you get 9 colors plus BG across 8 palettes, without high DMA costs.

 

To design, you will need the Altirra 8-bit emulator, and an Atari 8-bit software called ICE.  I screenshotted it below.  You will also need GIMP to process the images for 7800basic.  More in the next post.

 

Meanwhile, you can see a background for the Arkanoid game being edited.  :)

arkanoid-hexbg-ice.png.5c234938815d7b00e3522ed466c4461d.png

  • Like 1

Share this post


Link to post
Share on other sites
On 7/14/2019 at 9:41 PM, Synthpopalooza said:

I just noticed in the 160B demo ... Color number p7c1 very last column top row on the base color display at the bottom ... it should be a dark grey, but it does not seem to be showing up at all in your photos.

It's there...just have to turn up brightness a bit.  The 'normal' grayscale via CRT typically shows Black $00 and next neighbor $01, nearly identical.  $02 is not that much brighter.  That dark grey is slightly more evident in the LCD pics below, but again, very dark.  Though too, some of the other color swatches are harder to see with an LCD compared to the previous posted CRT pics.  Regardless, it's a brightness issue which of course will vary across displays and preferences:

 

160B:

 

IMG_1075.thumb.JPG.779d4e9cd0e64e85143559d5a68ee8dc.JPGIMG_1074.thumb.JPG.d53d3af74efc830893ab0616c3a4a946.JPG

 

320D:

 

IMG_1083.thumb.JPG.b49673a928996bef7b19a0e2e43932e8.JPGIMG_1081.thumb.JPG.f70db0362c1f2d4672d2ab0176f85e6c.JPG

 

 

320Dv2:

 

 

IMG_1095.thumb.JPG.c76bac222654f4b81089ef4278008de5.JPGIMG_1094.thumb.JPG.10f6bae59233e7461a4a628c8afafd94.JPG

 

  • Thanks 1

Share this post


Link to post
Share on other sites

Designing graphics in 160A interlace.

 

You will need:

 

* An Atari 8-bit XL emulator (I recommend Altirra)

* ICE IRG editor (in this post)

* Gimp

* 7800basic

* Your favorite Atari 7800 emulator

 

As an example, I am going to detail the conversion of a background from the game Arkanoid.

 

arkanoid-hexbg.png.02efab41a6868e86202929706fdcaaf7.png

 

This is a very complex background, but fortunately it can be handled very well in 160A interlace.

 

The first step is to load the source PNG into GIMP.  You then set GIMP up with a grid, 4x8 pixels.  You should see this:

 

arkanoid-hexbg-gimp1.thumb.jpg.a1e4d55f527db9da290720237779fb5c.jpg

 

The next step is to load the Atari 8-bit Altirra emulator, and boot the .ATR below:

 

iceirg.atr

 

When the .atr boots, RUN "D:ICEIRG.TUR" ... after the program loads, hit "G" from the main menu, until SUPER IRG mode comes up.  Use CTRL-C to select the color tuner, and use the keyboard and joystick to set your color registers to match the colors of the source .PNG:

 

arkanoid-ice-colortuner.png.11ee307fb0223c708fb0a73db91e3c06.png

 

The only color registers you need concern yourself with are 0 through 3, with 0 being the background color.

 

160A interlace allows you a 6 level blue shading through color mixing, plus the background.  An examination of the color palette explains everything:

 

arkanoid-hexbg-ice.png.a3e9cbc1d6ed3e583d2919ea3e9d2d81.png

 

Look closely at the color palette bar on the left side:

 

arkanoid-hexbg-ice-palettebar.jpg.c3c715687e30dee13c90acdfd137897d.jpg

 

There are 10 color palette combinations in this mode, listed as follows:

 

0 - Black/BG

1 and 4 - Black plus dark blue

5 - dark blue

2 and 8 - black + mid blue

A - mid blue

3 and C - black plus bright blue

6 and 9 - dark blue plus mid blue

7 and D - dark blue plus bright blue

B and E - mid blue plus bright blue

F - Bright blue

 

Of these colors, 0, 5, A, and F are non flicker base colors corresponding to BG, P0C1, P0C2, and P0C3.  The remainder are the component colors.  Each one has two settings, which blend the colors on alternate frames.  To properly interlace these, you have to checkerboard the colors, as so:

 

1414

4141

 

To avoid flicker, it is best to not blend by more than one or two luminance steps.  In this case, color settings 1/4, 6/9, and B/E are the best and should be used.  This gets you a 6 level blue plus background.

 

Next step is to edit the characters, starting at the top left of the character bar.  Copy by hand the colors from the GIMP source.  In this case, I had to alter the color layout some.  The resulting background is evidenced in the left side of the character set bar of the above picture.

 

Next, turn off frame blending in altirra, and screenshot each frame.  You will get these:

 

arkanoid-ice-frame1.png.df8603958eac3b2e31f4e95d170c9dbf.png arkanoid-ice-frame2.png.a387c5df8c8b16cfc741319849699717.png

 

You will then load these into GIMP, change the horizontal aspect ration by half, and crop down to the background in the character bar.  After some editing, I got down to these component images:

 

arkanoid_hex1.png.1da2e26aa9fa64a024742ffcb38baa12.png arkanoid_hex2.png.b7aa78f69a1b56a69134511a62d7bb58.png

 

You will then take these, and convert image to indexed, setting your max colors to 4.  These become the incgraphics you will use when inserting into 7800basic.

 

Here is the source code for displaying these:

 

arkanoid-hexbg.bas

 

To properly interlace these, each graphic must be placed in a seperate block, as such:

 

  incgraphic arkanoid_hex1.png 160A
 
 newblock
 
 incgraphic arkanoid_hex2.png 160A

The code for flipping the screen:

 

 main 
 
  savescreen
  
  

  
  
  cflip=1-cflip
  if cflip=1 then characterset arkanoid_hex1
  if cflip=0 then characterset arkanoid_hex2

  drawscreen
  
  
 goto main 

 

Here are the resultant binaries:

 

arkanoid-hexbg.bas.binarkanoid-hexbg.bas.a78

 

A screenshot is here.  Keep in mind it looks a lot better on real hardware, especially NTSC

 

arkanoid-hexbg-emulator.thumb.jpg.a4eaa71eeeb16b64fa970e18797127d3.jpg

 

This method also works well in 320B mode.

 

  • Like 1

Share this post


Link to post
Share on other sites

An addendum to the above:

 

For proper interlacing, I recommend making a dithering chart for the colors you use, like so:

 

blackblue1:     blue1blue2:     blue2blue3:

 

1414              6969              BEBE

4141              9696              EBEB

1414              6969              BEBE

4141              9696              EBEB

1414              6969              BEBE

4141              9696              EBEB

1414              6969              BEBE

4141              9696              EBEB

 

This will keep your graphics looking consistent, if you use this as a reference.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...