[jason_watkins]

It's been a number of years since I set out to do any art... and the wacom is long gone as well

Anyhow, the project is a friend's anime site. After some thought, the visual motif I decided on was for it to resemble pages of a japanese manga.

For those who don't know, japanese manga use an interesting style of dot patterns somewhat like half-tone dots (many different variations) along with simple shading to produce rendering of texture. It's really a quite unique style.
http://www.geocities.com/Tokyo/Dojo/6592/GunSmithCats/Scans_3.htm

has some decent example images, tho the patterns tend to moire when scanned, but you should at least get an idea of the physical technique (which actually uses rub on or patterend friscit).

Anyhow, any ideas for how to do a similar effect in photoshop? I can produce some simple halftone patterns, and then brush/gradient on top of them (masking to each form), but it doesn't come out looking right.

And other than intense manual labor, I can't figure out any way to do the sort of action lines in
http://www.geocities.com/Tokyo/Dojo/6592/GunSmithCats/GC_15.jpg

Any ideas? I'm going to keep expiramenting, and since I don't recall anyone doing anything like this before, I'll post anything decent if I should figure it out .

[jzero]

First thing you should remember is that most manga artists, like the ones who probably did the example panels you reference, have help. They usually have a number of lackeys who do their zipatone work for them, and that's what makes exsquisite stuff like this seem like a horrendous labor.

But I do have some Photoshop ideas for you. One thing you could try is creating several different alpha channels that are solid halftone patterns. Make several of different densities, even different angles, and when you've got your shading done (on a separate layer from your art), load one of those channels and use it as a mask or a selection to delete. Use the Multiply mode to make sure all the layers show each other.

What you're probably trying to simulate is a number of different layers of zip screens, so try using a number of different layers in PShop. As an example, image 'GC_16.jpg' would include a layer for the background gradient, a layer for the car surface, and a layer for the foreground character. Her pants could be a dark screen layer with the highlights added on top in another layer (in Normal mode).

I wish I had time to try this thing out, it sounds cool. Make sure and post your results, 'cause I'm sure we can come up with a solution if there are still problems.

Excelsior!

/jzero


[This message has been edited by jzero (edited February 06, 2001).]

[Pat]

Yeah, Photoshop can do what you're looking for, but it's pretty memory/hard drive intensive --even moreso than color work-- due to the excessive resolutions you need to use to prevent moire patterns during professional printing. I highly recommend using 800 dpi as a minimum --I commonly do my work at 1200.

Here's what I do:

Tone your linework in the method you're most comfortable with. Personally, I put the linework on a second channel and tone underneath it, but you can use layers too. Whichever method you use, once you're happy with the general tones, I flatten the image. The secret is the comversion. Convert the grayscale image to bitmap. Photoshop defaults to 50% threshold, but in the conversion dialog you should see an option for halftone screen. Select it. From there you can indicate the Lines Per Inch --aka the dot size-- (most manga artists use 65 lpi) the angle of the screen and style of dot. Presto, all your tones have been converted to screens.

Most manga artists today prefer the "all the same dot size" look. If you want to mix and match tone sizes and angles "old school style" it's the same basic principle but a lot more cutting and pasting. Instead, tone in patches, select the area you're happy with and cut (command X) it to a new doc. Leave the selection active though. Convert the new doc to bitmap as indicated above. Now, RECONVERT the doc to grayscale and use the "select color range" command to select all the dots. Copy 'em, go back to your original image and paste into (shift command C). Should fit like a glove.

The reason I'm having you convert and reconvert all those times is because you can layer and offset the screen tones several times that way, which is how most of the complex manga tones are generated.

Two BIG issues to watch:

Resizing the image is not a good idea --whether done in PS or a page layout program. Resizing will create moire patterns. It's a math thing --some ratios will look ok, but others will look awful.

Photoshop is not the bug free Uberprogram we all like to believe. There are 2 glaring bugs which have been around since version 3 of the program (and are still in 5.5!) which can crop up using this technique:

1) There is an error in the calculation of screen angles which prevents PS from rendering minute changes accurately. I haven't screwed around with this much, but a screen angle of 5 degrees looks the same as one at 6 degrees. Oops. Try larger increments if you're getting the same result.

2) Cutting/Pasting and Copying/Moving LARGE bitmap selections can sometimes cause only a partial result. You'll know this when you see it --it looks like someone cubed or checkerboard patterned your selection. At first I thought this was a funky hard drive issue, but nope --it's a glorified bug. I've done it on 3 different macs using versions 3, 4 and 5.5 of Photoshop. The good news is it happens rarely. When it does though, you're going to have to start over with the selection --and I usually quit and restart PS to zero out the scratch disk.

For those interested, I'm going to be writing a tutorial on just this technique and it's variations in an upcoming issue of Mangaphile. If there's enough interest, it'd only take a few minutes to convert it to a .pdf file. Lemme know.

-Pat

[jason_watkins]

Pat, by god, I do believe you've given me the silver bullet.

I *totally* forgot about the bitmap conversion halftone options. I haven't used those since like 3.0 or something.

I'm not actually going for print, just for web, so I won't have to work at insane dpi. That said, my typical test of new ran chips is to open a couple gig file in photoshop and then draw some diagonal line patterns and run a filter or 4. It wasn't quick, but it handled a 2gig file just fine, so I'm not particularly worried about running into that nasty bug.

I'm at work at the moment, I'll try it out when I get home. I'd be totally interested in any more depth you'd like to provide, but don't go to the work unless more people show interest or you just feel like it. I'm quite sure I can do something that will look right now.

[jason_watkins]

jzero: I'm glad someone got what I was asking instead of trying to help me layout anime style faces

That's exactly the approach I've been trying... I use a seperate layer for each form, then use a gradient or airbrushing for the simple shading, and a layer mask to define the edges of the form... the part where things go wrong is that when I then apply a pattern on top of that, it just doesn't look right.. it may just be that my patterns are lame... or that I need to go ahead and use what I've developed and do some decent line work on top of that to make it look good.

Thanks for the ideas.. I'd forgotten that manga artists have a whole group of lackies... now I don't feel so much that I'm on the wrong track... I just need to deal with that it's going to take a considerable bit of effort.

Actually, I should look at using painter instead... IIRC, it's floaters should be more suited to this sort of thing.

more as I figure it out

jason

[Pat]

Heh, don't feel too bad. Most people seem to pass right over that dialog box.

Since you're working for the web, you can actually change up the way you use the technique. I generally cut and paste between 2 docs.... but the main image is a bitmap to conserve memory. Sometime my images reach colossal sizes with those resolutions and even on a rocking G3/450 and 256 megs of RAM I end up waiting 30 seconds while I scratch. You, on the other hand, can leave it as grayscale and layer it as much as ya want. That's going to give you some amazing flexability.

There's also a few interesting variations on the technique. You can inverse the dot pattern to produce white zip. This is useful for muting or eroding line work. It's not used too often, but it's a fantastic effect!

Don't forget that you can also define your own halftone pattern using PS! I sometimes make a seamless tile, define it as a pattern and use that as the halfone. This works great for those "funky" zip patterns you sometimes see.

-Pat

[jason_watkins]

Yeah

I've found a resource for some patterns commonly used in manga, working on putting those into custom patterws in PS

jason