How to convert a photo to NES format

How to import realistic graphics into an NES game

I couldn't find a good tutorial on this, so I'm going to write it myself

I use Photoshop 5.5 (sorry, it's old)
-hold control, and click (=delete) all the swatches
-create 4 new swatches, white/lt gray/dk gray/black
-click the little arrow, save swatches as "4color.aco"

http://dl.dropboxusercontent.com/s/gtzh ... howto1.jpg

Open your photo
-select the part you want, and crop it.
-click image/image size, change to a realistic NES size...32x32, 16x16
-click image/adjust/curves, and draw 4 flat lines - this is the tricky part,
because final result will depend on exactly how you draw those lines.

http://dl.dropboxusercontent.com/s/ebue ... howto2.jpg

-at this point I touched it up slightly with the pencil tool
-click image/mode/indexed color
-click palette "custom", table "custom", load...
then find your 4color.aco file

http://dl.dropboxusercontent.com/s/2jh4 ... howto3.jpg

-click select/all, edit/copy

Open YY-CHR, New File...
-click edit/paste
-then touch up the picture, and save it.

http://dl.dropboxusercontent.com/s/9y75 ... howto4.jpg

You may have to adjust brightness after the "curves" step to get better
results with the index color step. All these examples are 32 pixels wide.

Here's a soccer ball (football), for another example.

http://dl.dropboxusercontent.com/s/zpfh ... howto5.jpg

Thefox wrote a nice tool for this years ago: viewtopic.php?t=7363

I've got a different technique for portraits.

The only advice I have regarding photos on the NES is... don't do it. 99% of the time it looks like crap. I can think of a few examples from movie-based games where actors have been redrawn that look nice, but that's very rare. 3 or 4 colors are far from being enough to represent real world lighting, so unless you use a lot of tricks to make it look like there are more colors (dithering alone won't cut it), don't expect good results.

EDIT: While I do think photos don't go well in actual games, I don't want to discourage experimentation. It's always fun to see how the NES handles things it wasn't supposed to, like photos, 3D, videos, and such. I just think it's important to know what belongs in a game and what doesn't.

I looked at some of the examples from thefox, and they look great! How did he get enough unique tiles to fill the entire name table? Bank swapping mid-frame?

Here's how this method looks at 128x128, and in an actual NES file. The only thing I touched up was the eyes and the beard. Slight dithering setting on the "indexed color" step.

I need to refine the process a little, I'm not 100% happy with the results yet.

The only satisfactory way I've had for doing this is just to load up the photo in an image editor, put it on a layer underneath and draw the NES image on top of it by hand. It's not an instant process, but it isn't extremely time consuming either. You can do a lot better with your human brain and experiences than any automated process.

Making decisions about what lines are important, what things to highlight, where to concentrate detail, where to leave it out, where to smooth over an unimportant detail, etc. this is something that takes understanding of the image, recognition of the things in it, and an aesthetic appreciation of them. Simple computerized processes are just going to treat the image as a signal, every pixel is equal. More advanced ones might try to find edges or shapes and emphasize them. Really advanced ones might try to identify eyes or other areas that should have a different process of detail applies to them.

I'm reminded of the film A Scanner Darkly, where they used a processing tool to assist and start the process, but utlimately every frame gets adjusted and finished by an artist. https://www.youtube.com/watch?v=eke5VnpNcNk

You just gave me an idea. You could use this kind of automated process (because it's actually fast - minus the coding it took like 5 minutes) and make a series of picture banks, and swap them every 8-10 frames, and you'd have a detailed movie file, in an NES game. you could have about 20-30 frames - that would be about 3-4 seconds of video. Combine that with a DMC sample and you could have audio and video in sync.

It would look something like this: viewtopic.php?f=2&t=11290

Uncompressed video isn't really practical to use in a game, as even a very short clip would consume nearly your entire CHR chip (unless you came up with a new mapper that could stream tiles from an SD card or something, but many would consider that cheating). But if you use a little compression, then yeah, I think NES can have little video clips here and there... maybe an opening sequence similar to that of Sonic 3D Blast on the Genesis.

I was thinking more like this...10 images on a loop. Done with bank swapping.

Could be nice for a title screen. Mario 2 had uncompressed video at the very end (Mario sleeping).

By the way. I need to find a forum with less intelligent people. Every time I come up with (what I think is) something clever and interesting I get a "here's an example that's 1000x better and more complicated". Man, you guys never cease to amaze me.

That's a compliment by the way.

Remember, some of us here have been doing this since last century.

There are people here that have been around since the dawn of emulation... most ideas have already been thought of, and out of those, many have been actually executed. I can see how that can be frustrating for newcomers... on the other hand, they have years and years of interesting stuff to catch up with.

First thought: posterize it to seven shades. Four shades map directly to solid colors, the other three map to 50% checkerboard dithering between two colors. This will reduce the amount of detail, but has a high chance to look stylized enough to look like it was intentionally drawn like that. After this the amount of cleaning needed should be minimal hopefully (or even get away without doing it).

The biggest issue is that if I recall correctly checkerboard patterns don't play well with the way the NES encodes the video signal...

I actually have been visiting this forum for 6-7 years, I joined this year because I finally got around to programming a game.

Yeah it does mid-screen bank switches and also switches the nametable to get an 8x16 color attribute area.

Here's another try. This time I resized to 128 high, boosted saturation to +75%, boosted constrast +40%, lightened the eyes and nose, made a special 4 color swatch set by eyedropping on 4 places on the canvas (note, these are not the final colors), mode/indexed color, use the custom swatch as the palette, dither 40%. touched up the eyes again with pencil tool.

copy. paste into YY-CHR. It looks nicer with at least 1 complementary color.

I also made this. An attempt at full color by rotating between red, green, and blue quickly. However, it's flickery as hell. And the color quality is lacking. Done by bank swapping and palette changes every frame. I can't post a still frame because it would only show 1 color.

Thanks for responding. I may try to reverse engineer this technique, it looks great.

One of the best ways to display full color pictures on the NES I have ever seen is tepples' rgb121. It uses flickering to alternate between the green channel (2 bits) and the red/blue channels (1 bit each). Flickering is a sensitive topic though, since HDTVs can't agree on a standard way to handle it. The variant that alternates channels every scanline should look decent in most cases, I guess.

tepples: The link (http://pics.pineight.com/nes/rgb121.zip) you posted at that thread is broken.

Actually, the rgb121 method works quite well even without the flicker. Just by alternating the green channel with the red/blue channels every scanline you can get a pretty colorful image. I tried one of the most colorful pictures I could think of, which is a Super Sentai team:

And here are the individual rgb121 frames generated from that picture:

In both pictures the colors of the rangers are represented accurately enough, so even without the flicker the results are pretty decent compared to approaches that use a single name table.

And here's the animated GIF:

It'll probably look better in a TV running at a proper 60Hz, unlike browsers do with GIF animations.

Flicker or no flicker, I'd say this is up to par with most FMV sequences found in Sega CD games.

BTW dougeff, if you can, don't use JPG for images with flat colors or retro game art in general. Not only is the final size usually bigger than that of a PNG or a GIF, but the lossy compression algorithm introduces a lot of artifacts all throughout the images.

It does look good. Makes me want to play around with this technique for a bit. Was there ever a ROM made that does the per-scanline nametable switch?

Yes. I just found tepples' demo on my hard drive:

BTW, the forum logged me out when I tried uploading the .zip... is this normal?

Not anymore. Thank you for reporting it.

(If your monitor doesn't sync up right, compare the original pics.)

This is probably the one situation where forced deinterlacing would actually be useful.

A much bigger problem would be people with epillepsy, honestly =P

Here's a full screen example using MMC3 scanline IRQs to bankswap 3 times per frame. Not as impressive as thefox because I'm only using 1 palette for everything. I was getting glitches on my first few tries, when I simply counted the right number of lines and switched, so I had to subtract 1 from the scanline count, and then wait about 110 cycles so that the swap happened during h_blank.

I don't seem to be able to use scanline counting to switch nametables at every scanline, I think I'll try again with a big wait loop. Is the timing something like this...wait for v_blank, wait till not v_blank, 114 cycles switch / 114 cycles switch / 113 cycles switch / repeat. ?

Looks nice. 4 colours is not so bad... reminds me of what I did back when on my old page. Mine used the CNROM mapper with cycle-timed code and/or sprite 0 hit.

Ooh, Moby 'everything is wrong'...that takes me back. Did you ever hear the DJ remix album of that, some of Moby's best work.

Yeah, 4 colors can do a lot. I like those.

Yes, Mixed...Remixed...Mixed...Remixed... it was hard to find.

I made a simple ROM some time ago that bankswitched both nametables and CHR ROM (and emphasis...) on every scanline to get 16x1 pixel attribute zones: viewtopic.php?p=113253#p113253

Never got around to making the analyzer to actually produce palette data for it, though...

IIRC, the MMC3 can only generate IRQs every 2 scanlines.


Yeah. But don't poll PPU_STATUS ($2002) for waiting for VBlank, always use NMIs. Detecting the end of VBlank isn't trivial either: one way is to use timed code from the start of VBlank, the other is to wait for the sprite 0 hit or sprite overflow flags (intentionally set during the previous frame) to be cleared.

This is true of MMC3A and MMC3B. MMC3B S and MMC3C can do IRQs every line, but I wouldn't recommend it because latency.


A third, if you are using the MMC3 and not using forced blanking at the top, is when the MMC3 starts counting lines.

Thanks for the suggestions. I think I'll try Tepples idea first. Won't have time till Monday, but I have in mind to do some more full color tests that switch nametables every scanline.

I was only able to get every 2 scanlines on my earlier tests with MMC3 counting irqs.

What's the soonest an MMC3 IRQ can fire in the frame? I assume that memory fetches during the pre-render scanline clock it normally, right?

If I remember correctly, Kick Master needs the MMC3 PIT to be clocked 241 times per frame: once on the pre-render line and once on each picture line.

On my full name table test, I had to have the first count 1 more than the last two, which implies that it was counting the prerender line as a scanline. Of course this is on an emulator (FCEUX), not real hardware.

I gave it a good try, but mixing 2 nametables scanline by scanline does not make it more colorfull, as I hoped. Rather it blends the 2 colors, making the color more gray or just wrong. I think a better approach would be to layer sprites on top of the background, which actually would have the effect of adding more colors. The final product would be a max 64x64 pixels, though.

Here's some of my attempts at full color.

Here's my favorite, done by switching between 4 shades of gray and red, yellow, and green. Colors are a bit dull, but at least the right color.

And the NES file, which switches nametables every scanline.

Just one more try. I started by seperating green on one palette and red/blue on another, but it looked wrong, and I just edited each palette color until it looked ok. Now the colors are almost right. And it only took 11 tries.

I started this thread with the complaint that I couldn't find a good tutorial on NES graphics...well, I found one today.

http://www.atelier-betoux.com/2015/07/1 ... hic-tools/

This guy lives in France, and is getting into NES homebrewing...and he's a web designer.

Yes, this is about the bare basics of tile editing... it's not really about photo conversion or colour reduction.