Please help - HUGE problem with exporting pages and tones
Hello - I bought Clip Studio some years back although I found it somewhat difficult to use (I mostly use Paint Tool SAI for comics) - but have been forcing myself to use it because I know it will be worth it in the end to make good pages. However, it seems that everyone else can do it except me. For the past two -months- I have been trying to figure out why I can't export pages with this program. As far as I can tell, no one else has the issue I have, although its hard to explain so maybe others do.
Basically, what I see in clip studio doesnt look anything like what I export. When I export it, the tones and sometimes the lineart freaks out and goes absolutely hideous. Depending on how I adjust the settings, they either go extremely low quality and look like something from MS Paint, they do a weird thing where they look like they're suddenly on -top- of the lineart and obscuring it (which looks terrible and ruins the lineart - it kind of looks like when you select an area of lineart to colour and then accidentally colour on the same layer as the lines or above the lines). I have no idea how I'm -supposed- to export the page, and when I look at tutorials no one really mentions it, they all say 'export' as though its that simple. I had finished a comic page and wanted to upload it like I had promised (I dont have many readers but they do still exist), but was literally incapable of doing so because I couldn't export anything that actually looked like what I drew in the program no matter what.
I assumed the problem was due to my usual habit of drawing at a very large size - it struck me as weird that this would be an issue because I had selected to draw a manga page and I assumed that the settings would be optimised for that rather than detrimental, or require you to have to change things to this extent that I cant figure out. So I decided to do the lineart first, then resize that to the upload size, then add tones. For reference, in order to fit into the page template where I upload my comic pages, they are 650 pixels wide (length doesn't matter). Well, that didnt work because I can't resize the dots on the tones, so that way I get -giant tones- which I dont want either. (if I make the tone dots smaller I can only make the colours much lighter, which didnt work for the dark shade I wanted) So I assume that's not it, either.
I'm at my wits end trying to figure this out and I really dont know why other people dont have these problems according to the tutorials i've watched. Is it possible that I've accidentally toggled some weird setting that is doing this? Does -anybody- have any idea what could be going on here? All I want to do is export a page. Last time I got so fed up I ended up just taking a screenshots of what I could see in the program and splicing them together in SAI, which was less than ideal either.
I've also noticed that the tones look kind of bad in the program too - very jagged and the dots seem too big. When I zoom in they arent perfectly round either and are more like houndstooth.
The dpi is at 600.
If you're seeing houndstooth it's because the resolution of your page is too low. There isn't enough pixels on the canvas to make a round dot. A pixel is square. If there's only enough resolution to afford four pixels to one halftone dot, the dot can only be a square and it can only change sizes four times giving you 100%, 50%, 25%, and 0% black. In this extreme example, you would only get two gray tones; 50% and 25%. This is a pretty extreme example but from your description it sounds like your canvas is 650 pixels wide at 600 dpi. If printed at 300 dpi, that would only make your canvas a little over two inches wide. If printed at six inches wide, your resolution would only be about 108 dpi. That's pretty low. Halftones are measured in lines per inch (lpi). If you're using a 30 lpi for your halftones, your dot will be made up of around 9 pixels and that's at 100% black (hello houndstooth). I realize I'm giving you examples using print and your intended output is for the web but I doubt any of your readers are reading your comic on a very tiny screen. Even at 72 dpi the computer would have to output the low resolution dots as houndstooth to try and simulate a grey represented as halftone dots.
So how to fix your problem: There's no need to use halftone dots for a webcomic to display grey tones (you can just use grey pixels for that) so you must be using the dots aesthetically which means you want bigger dots (big enough for your readers to see). Create your canvas at 600 dpi at print size. Do all of your line art and halftone work at this size. Don't add the halftone after reducing your pixel dimensions. Use a fairly low lpi for your halftone dots so they can be seen as dots to your readers. When you export, reduce your pixel dimensions (in the export dialog box - not before exporting) and make sure Follow Layer Settings is chosen for Number of Screen Frequency and Enable Tone Effect.
I think you might have misunderstood - my canvas is huge. It's the final size that needs to be 650. I'm literally drawing at the dimensions it gives me for drawing a comic page, and the dpi is set to 600. The fact that it screwed up after I did it this way is what made me think I had to resize it before I did the toning, but that didn't work either. Anyway the tones don't look right, the dots seem far too big even when I try to chage the size of them, and when I export the page, regardless of whether I change the size of the page or not it looks terrible. I'm not sure how I'm actually suppose to export a page to look right in this program because nothing seems to work properly for me...not for the past two months, anyway. I did manage to export a page last year that looked mostly normal - I exported it at full size and then resized that exported file in another program. The only issue was the moire pattern on some of the tones but I couldnt figure out how to fix that.
I have seen webcomics use a tone effect that looks like the way manga typically does for aesthetic purposes and they have all been done using clip studio, so I know it's not just that it doesn't work for web images.
Even when I follow your instructions, I still get a hideous page I can't do anything with, which is why I'm wondering if there's some setting that's been flipped somewhere. After I tried again just now, no matter what I get an extremely low quality page with lines that look like they were drawn in MS paint and a ridiculously enlarged tone (that looks like someone just covered it with large dots). It doesn't look anything like what it does in Clip Studio. It's just so annoying to spend ages drawing a page and be incapable of actually uploading it anywhere because this pixelated mess is all I can get.
I do want to stress this isnt an issue with the tones alone - the lineart suffers as well. I tried taking away all the tones and exporting it just as lineart but it still turns pixelly and MS-paintesque.
I would have to see an example of the page' maybe a close up. But not an example where you added halftones after resizing (I already know that will give bad results).
You can try to rasterize your image at full size with the halftones added, then export. This would bypass the settings that handle the halftones for export. When your page is finished at full size, go to Layer and select Merge Copy. That will create a single layer of your image, rasterizing things like the halftones and text. Now try exporting at the reduced size.
The reason your halftones become huge when you resize your page is that halftone size is determined by the print size. In CSP I think they call it frequency but it's LPI in print (lines per inch). A halftone that is 30 lpi has 30 halftone dots per inch. As an example, if your canvas is 6 inches wide there would be 180 halftone dots across your canvas. If your canvas is only 650 ppi wide at 600 ppi then your canvas is only 2 inches wide if printed at 300 ppi. That gives you only 60 halftone dots across the canvas.
If you add the halftone at full size and then rasterize, CSP won't alter the size (or frequency) of the halftone dot when you resize, but lowering the resolution will give you the problems discussed above; fewer pixels to make the rounded dots. When you reduce though, anti-aliased pixels will be added to the dots to make them appear smooth on screen (but zooming in will reveal houndstooth).
Thank you for being so patient with this weird problem. (An interesting point that I also should have mentioned before now: I use two separate versions of this program, at home and at work. My home one is a personal one I purchased in English a few years back and have since updated. The one at work is the Japanese version which my workplace purchased for me because drawing a bilingual newsletter for english learning is part of my job. I do not have the problems that I have in my home version in the Japanese version. Which is pretty ironic and annoying considering I put a great deal more effort into personal stuff than the more simple stuff I draw for work (it has to be simple or I'd never get it done in time) Also, I can only use this version at work and can only use my personal version at home, so unfortunately I havent been able to test my personal stuff in the work version and see if these problems still occur. This is why I'm wondering if it's some setting I've toggled on my home version, or else something weird that happened when it updated)
Anyway, I took some pictures to try and explain what's going on a little better (which I probably should've done to begin with I agree)
Let's start with what I can see in CSP with the canvas at 50%. This is as far out as I can go before I can actually see the tones.
So if I press zoom one more time, which goes to 66.7%, the dots of the tones become visible.
and...hmm, I dunno. This already looks slightly off to me somehow. The dots already look too big - bigger than they do in my Work version of the program. Note that they are at the maximum screen frequency of 85 (if I bring it -any- lower they start getting huge). The suit especially looks odd to me. But no amount of tinkering can produce anything else with a tone so I thought maybe it just looks odd in the program and will look fine once it's exported.
Here's what happens when I export with the following settings:
rasterize 'prefer quality'
advanced: follow layer settings
enable tone affect
yikes. Obviously not what I'm going for. This is actually a less extreme example - I'm not sure what I've done differently while I was taking screencaps but the lineart exported intact this time and its stopped giving me the mspaint effect. But you can see those dots are even bigger than they were before, although not as big as they appeared under a different setting I tried.
The other method I tried: exporting it at the same size and then resizing it in another program (SAI). When I do that, I get the checkerboard moir pattern, which I also don't want.
This effect also happens when I rasterize the page first and export it. (both methods of exporting: at 650x and at original size)
When I tried the rasterization on another page, all the shading either disappeared (as though it had combined with the layer undearneath it) or turned into moir. It was kind of annoying to put so much effort into shading on this page only to have it all disappear.
I'm not sure if that makes things any clearer or just even more confusing.
So, here's how halftones work: Most offset printers have a resolution of 2400 printer dots per inch. Offset printers can print up to 256 levels of grey. This is done using halftones dots. A halftone dot that can print 256 levels of grey has 256 printer dots in the halftone cell (16 dots by 16 dots square). This halftone dot can change its size 256 times. In order to find the resolution needed to print 256 levels of gray you divide the printer resolution by the square root of the levels of gray (2400 ÷ 16) and you get 150. That is the line screen; the lpi. The resolution of your document is 2 times that of the lpi (because it takes the average value of 4 pixels to make one half tone dot). So to get 256 levels of grey in a document, you need to have a resolution of 300 ppi. Those halftone dots are super small and not easy for the eye to see so a field of 50% density would look like a field of gray but they are made up of halftone dots that are made up of 128 printer dots.
Now let's take a look at what's happening with your work. You're using a line screen of 85 lpi. At print size at 300 ppi this would mean your halftone dot is 3.5 pixels wide (the math here gets a little wonky so let's just round up to 4 pixels). At 4 pixels wide your halftone dot is made up of 16 pixels (4X4) making an 85 lpi halftone dot 4 times larger than an offset printer's halftone dot (or 0.016 of an inch wide - less than half a millimeter for those using metric). This is still pretty tiny and that's if your art is being viewed at print size. At this size, a 50% density field of dots would be teetering on the edge between gray tone and halftone.
You're not exporting at print size and resolution though. You're exporting at 650 pixels wide at 600 ppi. Print size makes this 2 inches wide at 300 ppi. If you export 85 lpi halftones at this size without first rasterizing the halftone you would have 170 dots across your entire canvas. Compare that to a canvas that is 6 inches wide at 300 ppi. with an lpi of 85 (510 dots across the canvas). That's what's making your dots huge - not fixing the size of the dot first before reducing the canvas size. The houdstooth is another matter. Even if you fix the size of the dot, you only have a halftone dot that is 2.5 pixels wide (again, the math gets wonky. Let's round up to 3). That's a halftone dot that is made up of 9 pixels. That's 9 levels of gray. To simulate more levels of gray, the computer makes odd patterns in the halftone.
You have to decide why you're using halftone. If you're publishing online, you can just use gray pixels to make gray tone, you don't need halftone dots to achieve gray. If you're going for an old style manga look, then you need to increase the size of your halftone dots. I would increase the pixel width of your canvas and use 300 ppi resolution.
I noticed that my math was off in an earlier explanation. With the same canvas (650pixels wide at 600ppi) a 30 lpi halftone would have around 49 pixels in it (180 dots across the canvas).
you mention you are not running into the same issue while running Japanese version of CSP (which, I suppose, is the most recent version)?
their release notes mention upgrades to the screen-tone rendering in ver. 1.6.4
which is not yet out in English; could it be that they also handle printing/export different in the newer release?
(I have to rely on google translate when reading release notes, so I might be wrong here tho.)
That update has to do with how the tones are rendered on the display as you work in CSP, not with how the tones are generated for export. Currently, when you view the tones at a certain magnification, you see flat gray tone. Zoom in a little more and you see the halftone. This update gives you the option of seeing the halftones when you reduce magnification or seeing gray tone.
So, after fiddling more and taking what has been said here into account, I can now manage to export a page that isnt perfect but is better than what I had before.
My question then is, since there -are- plenty of people who use this program in a way that I would like to, with webcomics etc that have that kind of manga tone effect I'm after as well as having their pages resized to fit the layout of the site they're uploading to - what exactly are they doing differently to me?
I can't help but feel like any technical, important change that has to be taken into account when exporting (ie rasterizing etc) would be something brought up in a tutorial - any tutorial, any yet I've never seen it in any of the ones I've read around the internet, either japanese or english. That's the main thing that's confusing me here. It's like other people's programs are doing something for them automatically, as though its already optimised for what they want, whereas I have to fiddle around for ages manually, and i'm still not entirely sure why this is.
Is there a way to stop the checkerboard/moire pattern? I've seen people say you have to rotate the angle of the dots, but that seems like it'd be a lot of trial and error.
Halftones are tricky. There isn't any secret to getting around the limitations of the number of pixels available to you. To illustrate what happens, here's an image that is one inch wide at 600 ppi (or 600 pixels wide).
The line screen used on this image is 85 lpi, so there are 85 lines of halftone dots across the image giving me around 49 pixels per halftone dot (7X7). There are 15 pixels making up the bigger dots you see below making it about 34% density or 34% gray.
If I change the resolution of the image to 600 pixels wide at 300 ppi and leave the lpi at 85 I get a much different halftone dot.
You would think that since 600 ppi at one inch equals 600 pixels wide and this document above is 600 pixels wide there would be no difference but at 300 ppi I've changed the print size from 1 inch to 2 inches. If the canvas above is 2 inches then there is now 170 lines of halftone dots across the image instead of 85. The pixels have remained the same but I've added twice as many dots. Now instead of having a halftone dot that is 7X7 I have one that is around 4X4. But how do you get 34% gray from a dot that can only change its size 4 times? Notice the odd pattern? At this resolution and with so few pixels to work with, the pattern is just starting to go a little off.
Now if I lower the lpi to 32, I get this:
The pixels are the same and because the canvas is 2 inches at 300 ppi a 32 lpi I get a halftone dot that is almost 10X10 pixels. It's a little closer to the original image now but at 32 lpi and 2 inches of canvas the number of halftones across the image is 64. I would need a halftone line screen of 43 lpi to get it to where I want it.
Moire patterns are a different animal onscreen than in print. In print, turning the halftone pattern can reduce moire but not so much onscreen. We have a tendency to see patterns and having halftone dots at a 45 degree angle reduces the noticeability of the halftone pattern a little. Moire can happen for a number of reasons and can be reduced a little by turning the pattern. But with computers moire happens when there isn't enough pixels on a monitor to reproduce the image onscreen. You could have moire on one monitor and a nice halftone pattern on another. If a half tone dot is 4X4 pixels but the monitor viewing the image can only reproduce the dot with 3X3 pixels, weird things happen.
Oops. I made a math mistake above (and this is why these halftone things are so tricky). The 85 lpi halftone dot at 300 ppi would change its size between 9 and 16 times (4X4) not 4 times. The number of pixels across the halftone dot would be 3.5 but you can't have half a pixel. Dealing with halftones is a balancing act. There are so many variables involved it's hard to have a one size fits all type of tutorial but if you know how they work you have a better shot of dealing with the give and take involved in getting the image you want.
Tones always seemed easier in Manga Studio 4 ... Can't think logically why...except perhaps that it was easier to work at very high definition.
My coping strategies
- Don't use them and just use grayscale ... Printer can dot them up if they wish.
- If I really want Dots then I want to clearly see dots and I set the Lines setting to make them really big dots ( Lichtenstein style) ... really big has less problems.
- I am more likely to use the Noise pattern and this is less likely to give any Moire issues.... and has no issue about odd shaped dots
- I am more likely to use the Noise pattern and this is less likely to give any Moire issues.... and has no issue about odd shaped dots
I do like the noise option in place of a very high lpi for webcomics. It's one of those compromises that can give you that old printed manga look. If you go this route, remember that there is no lpi. Instead, you're dealing with size.