Showing posts with label Photoshop. Show all posts
Showing posts with label Photoshop. Show all posts

Saturday, September 04, 2010

Lowlife: Hostile Takeover Part Two

Aimee gives Frank a lift
Lowlife: Hostile Takeover part two, page four
© 2010 Rebellion Developments/2000AD 

Part two of Lowlife: Hostile Takeover was where my now well-documented dissatisfaction with Adobe Illustrator came to a head. While I'd been drawing part one I'd become more and more aware of how slow Illustrator was; it really was choking on all the little Carlos Ezquerra-style rendering lines I was putting into my pages. Illustrator stores every line as a separate, adjustable object, which means that rendering or hatching really does clog it up pretty quickly.

I hadn't got to grips with Manga Studio at this point, so I decided the try laying out and pencilling the pages in Illustrator, then see if inking them in Photoshop would be faster. Illustrator's various geometric vector tools allowed me to lay out panel borders, lettering and building perspective grids with much more flexibility than Photoshop permitted, but since I keep my roughs and pencils as simple as possible, Illustrator would still run pretty quickly for me.

Casino scene from page one of
Lowlife: Hostile Takeover part two
© 2010 Rebellion Developments/2000AD
 
So I jumped in at the deep end with this big panel - starting with the solid blacks and adding outlines afterwards. The solid black stage was already proven - I use Photoshop to add those when I'm drawing Stickleback - but inking the outlines proved trickier than I expected.

The problem was the pressure-sensitivity of the Photoshop brushes - with the default settings on my Wacom tablet, they tended to suffer from a "jump point" where the lines would suddenly jump from thin to thick when a certain level of pressure was reached, something that fiddling with the controls in both Photoshop and the Wacom preferences could improve but not fix.

Worse still was that all the brushes were what I call "heavy" - they'd produce their thickest line unless the stylus was held off the tablet all the time. I'd expect to have to do this for Photoshop brushes that were mimicking real-world brushes, but the effect prevented me from ever mimicking the feel of working with a dip-pen, which is springy but which can be allowed to rest on the paper. Again, fiddling with Wacom and Photoshop settings didn't solve the problem.

On the plus side, having a page rotate tool was a big relief, and being able to straightforwardly erase things was lovely (I know Illustrator now has an eraser tool, but using it on variably-stroked lines can cause some weird effects). Being able to subtract via selection was handy, and having layer masks which allow me to reversibly erase into black areas was superb - something I wish Manga Studio could emulate.

But, in the end, it came down to this; the "heaviness" of the brushes meant I couldn't draw any quicker in  Photoshop than in Illustrator. For the next few episodes I hit on the compromise solution of doing the bulk of the inking in Illustrator and then adding rendering (and, as I always have, texture) in Photoshop afterwards.

I'll be interested to see if anyone can see a difference in the appearance of this episode.


A quick word about the bikes in this episode: for Aimee's bike I wanted something a bit different and futuristic. Inspired by the bodywork of a BMW prototype, I came up with the idea of a fly-by-wire racing bike with a saddle, fairing and control assembly that floated clear of the engine and wheels. This allows for computer controlled stabilization and steering override to help the rider cope with Mega-City One's 200mph+ traffic speeds.*

The Samurai assasins' monocycles were inspired by Ben Gulak's Uno bike.

*Source, Judge Dredd episode 1, 2000AD prog 2.

Finally, here are a couple of panels I was quite pleased with that mostly got covered in lettering. I knew they would too; I just have too much fun drawing backgrounds.

The back alleys of the Lowlife
Lowlife: Hostile Takeover part two, page four
© 2010 Rebellion Developments/2000AD 

Friday, August 13, 2010

D'Website of 'Israeli Go Bye-bye

The official D'Israeli website has lain neglected for several years since my web-based activity moved over to D'Blog, so this year I've decided to let the disraeli-demon.com domain expire.

Since I do still get emails from people saying they find information on the site useful (especially the stuff about colouring in Photoshop) I'm putting an archive of D'Website up on http://homepage.mac.com/matt_brooker/Sites/dizzy/index.html.

Be warned, the navigation on the site is a bit odd, and the mail link goes to a dead address. I can't fix any of this for the rather lame reason that I don't have an HTML editor right now, and my web-fu isn't up to editing pages without a WYSIWIG app.

Friday, July 31, 2009

MacFormat and the 25% Kirby Palette

One of my illustrations for the article "Macs of the Future" in this month's MacFormat magazine.

I'm pleased to announce that I've got some illustrations in this month's MacFormat magazine (Issue 210, July 2009). I have a real soft spot for MacFormat, as it was through their reviews section that I picked all the gear for my original Mac set-up back in 1997. The illustrations, for an article called "Macs of the Future," are intended as a pastiche of all those great old Jack Kirby "cosmic" comics, with a mix of retro 50's-style design and stuff made of Mac components (the spaceship top left of the illustration above is made of iPods, Mighty Mice and one of the old dreaded "hockey puck" mice from the late 90's (hated by many but which which I personally loved).

To help enhance the retro feel I used a home-made Photoshop swatch set based on 25% increments of yellow, cyan and magenta - for the non-technically minded, this gives you 125 colours to play with, the same ones that were available to the colourists at Marvel in the 1960's and 70's. I set myself the rule of only using colours from this palette, no mixing allowed (though I may have cheated with the "colour hold" (coloured outlines) on the astronaut's helmet.)

125 sounds like a lot, but actually, if you want, say three different pale greens, your choices are strictly limited. The funny thing is, the smaller number of options was liberating; without eight different pale greens to dither amongst, you just have to get on with what you've got. The result is, I'm going to try using this palette as the basis for my next colouring job (though I will allow myself to mix colours where necessary.) That may be a while though; at the moment I'm firmly rooted in black & white-ville, working on Stickleback.

Meantime, for anyone who fancies trying it, I'm making the 25% palette available for download. All the colours in the palette are print-safe, and, except for the set of greys on the first line, contain no black, so they will leave the black channel clear if used in a CMYK document.

Mac have withdrawn the option to make or edit download pages, so to download use the following link:

25% Palette.aco download

If you don't know how to install Photoshop swatch files, follow these instructions:


1) In Photoshop go to the Swatches Palette (use Window: Swatches if it's not visible). Click on the drop-down list icon at the top-right of the palette.

2) From the drop-down list, pick Load Swatches... and navigate to the 25_Comics_Swatches.aco file on your hard drive. Pick it and click OK.

This will add the new swatches to the end of your existing swatch set (you may have to scroll down to find them). If you want the new swatches only, you can use Replace Swatches... but note that THIS WILL OVER-WRITE YOUR EXISTING SWATCH SET. If you're using Replace Swatches I thoroughly recommend saving your old swatch set first (using Save Swatches... naturally.)

Finally, if you want to get rid of individual swatch tiles, or move them around, try using the Preset Manager (visible in the list just above Reset Swatches...). Don't forget to save your swatches after you've made any changes - otherwise you'll lose the work you've put in if Photoshop crashes.

Monday, April 06, 2009

Lowlife: Creation Part Six: They'll Need A Crane

Lowlife: Creation part six page one. This panel contained a couple of tricky compositional problems.
Lowlife © 2009 Rebellion Developments/2000AD
Lowlife created by Rob Williams and Henry Flint

One of the best compliments I've ever received was when Rob Williams told me that he'd ramped up the scale of the action in Lowlife: Creation once he knew I was onboard as artist. A tribute to my mighty powers, I preened to myself, before it dawned on me this actually meant Drawing Lots Of Difficult Stuff.
Now, before I get too far into the business of bitching about the difficulties of drawing, I want to make a couple of things clear; first, I do appreciate how mind-buggeringly lucky I am to make a living doing the thing I love, so I'm not in any way trying to plead that I have a hard life being made to do drawy stuff of any kind.
The second thing is that a good comics writer will play to an artist's strengths and push them farther. In some ways it's like the relationship between coach and athlete - the coach can push the athlete to heights he'd never reach on his own. Given my interest in world-building, that usually means that a good script will involve drawing something very complex - a whole cityscape, say - or present a technical challenge in terms of perspective or storytelling (or both). Some the best-remembered pages in my career have come from pages of script that made me say "Merde alors!* How the hootin' heck am I going to draw that?" on first reading.

*Yes, I really do say "Merde alors."

Pencils for panel one showing duplicated angels
Lowlife © 2009 Rebellion Developments/2000AD
Lowlife created by Rob Williams and Henry Flint

With panel one of part six, the problem was the host of angels in the sky. Rob's script had them hanging there "spaced out evenly," which is a bit trickier than having them in flocks. It did sort out the question of viewpoint, though. If the angels are all floating up on roughly the same plane, we have to be up there near them, otherwise you won't be able to tell what they are (the scale of Mega-City architecture is so great that they'd just look like glowing pinpricks from close to the surface of the water).
I decided to have one big panel where you get a really good look at the angels. That would be the reference shot, and after that I could exploit the scale of the city and just show them as a grid of squiggly dots in the sky. The first drawing decodes the later ones.


Drawing Multiple Angels in Adobe Illustrator

1) Pencil an angel
2) Duplicate and scale to make smaller background figure
3) Duplicate background figure
4) Use Free Transform tool to add perspective
5) Use Blend tool to create intermediate figures
(To make this work at home, before using the blend tool you must first select the two outer figures individually and group the lines within each of them (but don't group the two outer figures together!). If the angels aren't grouped, the Blend Tool will just blend between a single line in each angel (or fail to work at all). You must also click on exactly the same point on both angels when using the Blend tool - picking a wingtip or other prominent point is the best bet.


To speed up the process of drawing multiple angels, I "pencilled" the closest one in detail on a layer in Illustrator. I put two copies of this figure onto an underlying layer and scaled them down a little, positioning them on opposite sides of the page. Then I used Illustrator's Free Transform tool to distort them slightly to obey the perspective grid for the panel (see illustration above). I repeated this process several times, generating five layers of angels, each one smaller than the one above, each one with two figures at the far left and right of the page. I made sure they all lined up to the perspective grid (for the technically minded, they all cross the eye-line at mid-thigh) so they all look like they're occupying right positions in 3D space.
The next bit was a massive cheaty cheat; using Illustrator's Blend tool, I generated multiple copies between the two angels on each layer. I made more copies of the distant angels and fewer of the closer ones. You can tweak the number of copies generated by the blend, so I played about a bit until the lines of Angels looked right.
Then I gritted my teeth and inked them all by hand, adding little individual variations and tweaking the drawing where the Free Transform distortion didn't look quite right. Technology can only do so much.

The finished version of page four panel two. The poses of the figures on the raft were borrowed from Gericault's painting The Raft of the Medusa (below left).
Lowlife © 2009 Rebellion Developments/2000AD
Lowlife created by Rob Williams and Henry Flint

The "enormo-crane" on page three was a different challenge; although it's a relatively simple shape, it's made up of complex girder-work, and I wanted that to look spot-on in perspective. The simplest solution was to build a 3D model to trace from.

Left: Gericault's Raft of the Medusa, used as reference for the figures on the raft (above)

After combing Google for picture reference, I did a few preparatory sketches, opting for a beefed-up design that was like two current-day cranes strapped side-to-side. If I'd been drawing a Mega-City construction scene I'd have gone for some sort of robot arm arrangement for lifting materials, but as we were seeing the crane without a context I opted for a recognizable design.


The "enormo-crane" modelled in Carrara 3D. I was able to quickly assemble the girder-work by drawing it in Illustrator and importing it into Carrara.
Lowlife © 2009 Rebellion Developments/2000AD
Lowlife created by Rob Williams and Henry Flint

Building such a structure wasn't as difficult as it might seem; my 3D program, Carrara, lets me import Illustrator files, so I drew the base, top, side and end of the girder-work in Illustrator and then imported them into Carrara to extrude them into 3D objects. Once I'd made one girder-work object, I just duplicated it as many times as needed (the front arms, rear arms and supporting column are all made of copies of the same girder-section at different scales). If I'd been building the model to be used in its own right, I'd have taken a more subtle approach, but since it was just for picture reference I didn't need to be too precious.
The most difficult bit for me was making the curvy counterbalancing arms on the sides. I tried using a 3D application called Hexagon for that, and it took me ages, with lots of false starts. I don't think Hexagon is that hard to use, but it was my first try, and 3D programs are notorious for their steep learning curves.

Pencils showing the placed crane render and the various perspective grids, including a special one for the angels in the sky.
Lowlife © 2009 Rebellion Developments/2000AD
Lowlife created by Rob Williams and Henry Flint

In the end, I spent most of a day on the thing. I don't think it made the drawing any quicker, but I do think it made the crane look more convincing. As with all this sort of reference, I screen-grabbed a shot from the Carrara interface, imported it into Illustrator, and used it to establish the perspective for the rest of the drawing. A tip for anyone trying this technique: when you're setting up your camera in the 3D program, have your page roughs to hand and set up the angles according to those. It saves an awful lot of false starts.
In the end, the 3D approach also turned out to be very helpful with my next problem...

The finished article. With such distorted perspective and so much detail, it was a struggle to make the storytelling clear.
Lowlife © 2009 Rebellion Developments/2000AD
Lowlife created by Rob Williams and Henry Flint

The last three panels of the strip were a particular challenge. Superficially simple-sounding (three repeat panels mean less work, right?), the problem was one of angle and point of view. The panels descriptions required being able to see straight out along the crane arm and straight down at the same time. An extreme wide-angle perspective was needed.
This isn't too difficult to construct; for three-point perspective you place the vanishing points very close to (or even inside) the panel borders, then follow the rules of perspective. This will produce massive distortions towards the corners of the frame, so the trick is to hold your nerve when the drawing starts looking weird. About half-way through, you'll be convinced the drawing has gone horribly wrong, but if you keep following the perspective, the final distortion will look believable.
Of course, I had to fit my 3D model into the composition. I was a bit worried, as I remembered that Carrara only supported cameras with a wide-angle up to 24mm (not nearly enough for what I had in mind). Happily, it turned out I was remembering a old version of the application; a recent upgrade allowed cameras down to an extreme wide-angle of 6mm. After a little experimenting, I found 15mm gave me the perspective I was looking for.


Pencils for the last three panels of page five. The complex perspective was based on a render from the crane model in Carrara (placed into panel 1 & 2 and also below left). Panel 3 is left empty at this stage as the background from panel two will be copied into it.
Lowlife © 2009 Rebellion Developments/2000AD
Lowlife created by Rob Williams and Henry Flint

I rendered the scene in two versions, both containing a deformed plane to represent the broken billboard and round-ended cylinder as a placeholder for the building supporting the billboard. The first render also had a plane representing the water-level. The plane was covered in a chequer pattern, to help me work out the perspective of the scene.

Left: 3D renders for panels 1 & 2


I placed the renders into Illustrator and built perspective grids from them. The grids were all on separate layers so I could show and hide them as needed. From these I did rough pencils of the cityscape and the figure of Frank (see above). I didn't bother filling in the background to panel 3, as I was just going to copy panel 2 into it.


Left: The last panel as it appeared in Illustrator. Frank's silhouette is actually in there, but you have to look closely.
Right: Post-processing in Photoshop included a lot of work to pull forward the figures of Frank and the guys on the raft (the small dots down on the vanishing point).
Lowlife © 2009 Rebellion Developments/2000AD
Lowlife created by Rob Williams and Henry Flint

I drew the backgrounds and the foreground figures of Frank and the guys on the raft separately. This has one big disadvantage - when I draw a figure and a background together, I automatically "thin out" the backgrounds around foreground figures, making them stand out. When the foregrounds are done separately, the backgrounds can easily overwhelm them - especially in this case, when the foreground figures are tiny and the backgrounds are very detailed.
In Lowlife, I do a fair amount of post-processing to the drawings on Photoshop, adding textures and grime. In these panels I also spent a fair amount of effort putting haloes round the figures and otherwise fading down the backgrounds so as to make the figures stand out (you can see the difference in the two panels above). A technical problem had become a storytelling one.

In the end I'm not sure about the clarity of these panels. It's one of the few cases where I've felt constrained by the low page-count of 2000AD episodes; in a 20-page US comic we'd have been able to devote a page or maybe two to the sequence and make it all much clearer.

Thursday, August 30, 2007

Video Try-out

To celebrate Blogger's introduction of video uploading, I decided to try making a demo video showing a quick way of setting up a scanned image for colouring in Photoshop or Photoshop Elements. I've had some step-by-step stuff on my site for a good few years now, but writing textbooks online is a very time-consuming business; these demos are quicker to do and let the viewer see the process in action.

I'd be grateful for feedback on this process; whether it's worth me doing more of these; whether you prefer written tutorials; whether the fidelity of the streaming video is good enough or whether it would be better to make high-resolution copies available for download.

This demo works with Photoshop Elements, full Photoshop and Corel Painter. I'd welcome feedback as to whether it works with other programs such as Paint Shop Pro.

The demo starts with a scanned image. If you're going to try this yourself, make sure your image is in RGB colour mode (look under Image: Mode in both full Photoshop and Elements).



Demo © 2007 Me.
Created using Ambrosia Software's excellent Snapz Pro X.