Why So Many Animals In Picture Books?

why so many animals in picture books

An astonishing number of the characters depicted in picture books are not people at all, but animals–or rather, humans who look like animals, for Horton the elephant of Horton Hatches the Egg and Pearl the pig heroine of The Amazing Bone are certainly more human than animal in their interests and motivations. In many picture books, indeed, only the pictures inform us that the characters are animals; to give just one example, Russell Hoban’s Frances is a badger only in Lillian Hoban’s illustrations of her; in the text, she talks and acts like an ordinary human child.

– Perry Nodelman, Words About Pictures

Continue reading “Why So Many Animals In Picture Books?”

How To Design A Poster

EXAMPLES OF ACTUAL POSTERS, FOR YOUR INSPIRATION

FREE RESOURCES TO USE AS ELEMENTS OF YOUR POSTER

Steal Like An Artist, but don’t forget to credit.

WEB TOOLS, ESPECIALLY FOR THE PHOTOSHOP-LESS AMONG YOU

(Tip: You don’t really need high-end software worth thousands of dollars to create something cool.)

ARTICLES AND TUTORIALS

IPAD APPS

PRINTING POSTERS

TYPOGRAPHY

OTHER

200+ Pinterest Boards For Designers To Follow from Design Shack

And, here’s how not to design a poster. Movie Posters Recreated Using Only Clipart, from The Mary Sue. Avoid clip-art and comic sans and you’re doing just great.

Will you buy a Nexus?

It’s interesting that the advertisement for Google’s new Nexus 7 tablet features a storybook app (Curious George). The comments which have been left on the YouTube version are an interesting insight into some typical worries and concerns regarding storybooks as apps.

 

QUOTES FROM THE COMMENTARY:

“I can’t help feeling that when that kid grows up she’s not going to have access to her Curious George ebook to read to her own kids because of format problems, digital ownership snafus and so on.”

“Buy books.”

“It’s sad see so many kids with iPads or iPhones, but not playing around anymore.”

“When your kids grow up they’ll be in virtual reality [anyway].”

“Spend $0.99 to buy a new book.”

 

 

 

The View From Bed

Not interesting.
Slightly more interesting.

What’s the worst thing you’ve ever seen from your bed?

For me it would have to be the spider I woke up to one morning. It was dangling at the end of a thread, right in front of my nose. It wasn’t exactly a Huntsman, but still not pleasant!

Breakdown of an App… what makes an app?

Have you ever wondered what goes into an app? Here is a detailed breakdown of “The Artifacts”, perhaps shining some light on how much work it is to create an app like this.

Sound Effects:
202 different sound effects.
10 MB.

Here are the sounds effects for page 6 (click to play):
wind03
wind02
wind01
crash-of-bin
chimes02
chimes03
chimes04

Graphics:
Over 1000 separate graphics frames, on 240 individual files. Many frames are combined into one graphics file to make it faster.
68.7 MB.
Here is one of our graphics sheets, from the Caterpillar page (page 6).

Music:
2 Music tracks.
6.9 MB.
You can download the music from The Artifacts (it’s free) here.

Code:
Around 12,000 lines of code, not counting framework.
Around 5 MB.
Here is a sample from the Fireflies page (Page 20), this piece of code adds a new firefly.

-(void) addFireFlies: (int) count: (CGPoint) loc
{
    NSString *fireflyname = getRelevantFile(@"firefly-%02d", @"png");

    for( int x = 0; x < count; x++ )
    {
        firefly[fireflypoint] = [CCSprite spriteWithSpriteFrameName: 
                         [NSString stringWithFormat:fireflyname, 1]];
        scaleToDevice( firefly[fireflypoint] );
        [p24sheet addChild: firefly[fireflypoint]];

        [firefly[fireflypoint] setPosition:loc];

        [self stopAnimWings:firefly[fireflypoint] data:fireflypoint];

        fireflystatus[fireflypoint] = FF_NOTMOVING;

        fireflypoint++;
    }
}

Hopefully you’ve found this enlightening, we had a lot of fun creating it! If you have any questions on the development of an App, I’d be happy to answer them for you.

A Scene From Midnight Feast: Roya’s Bedroom

I decided to put the full workings of this first page up because it illustrates how I changed my mind about the colour scheme. As you can see, I proceeded to create a bluish sort of colour scheme, avoiding the black outline with a colour wash that appears in many children’s books. This is fairly quick to draw, but doesn’t look as attractive to me.

In the end, to overcome the feeling that this project will never get done, I decided to make the ‘A’ version of each page the line-drawing and wash sort of illustration which can take about half the number of hours for me to crank out. This is because instead of rendering form tonally, I can just plonk down an outline and colour it in with a block colour. This makes drawing the characters a lot quicker. Since some pages have multiple touch and fade ‘animations’, drawing each character tonally proved too time consuming. If we spent a month on each page, this app wouldn’t get done before I got sick of it. But it’s not just about time. The ‘A’ version of each page has to look different in mood, and I was wondering how to achieve this at the beginning of the story, before Roya has fully entered her imaginative world.

As you can see, I begin to change the colour scheme back to the colour of the original canvas. In keeping with a more sketchy style, I’ve decided to hand-write the text.

I made Roya’s arms shorter so that she looks a LITTLE bit younger. I think she can pass for 12-14 now so I’m happy with that.

I had to send a whole bunch of preview screens to Dan so that he knows where to position the elements.

That probably gives some idea of the number of elements in this page, and how difficult it will be for Dan to get this page loading quickly and playing nicely. So there are no guarantees that he’s going to fit all of them in. He tells me that Apple are vague about upper memory limits, which means coding an app for Apple is a matter of trial and error to some extent.

Anyway, it would be nice to think that mobile devices were completely free of the constraints of print publishing — the need for a 32 or 24 pages, the need for approximate rather than precise colour and so on. But there are limitations on what we can do in a storybook app, even in an app designed for the best mobile hardware out there: Apple’s.

 

And here’s the next version. I’d like to say it’s the ‘final’ one, but you never know! I figure the first few pages need mucking around with the most. After I’ve got a mood down, I can remember how I did it, then recreate it on all the following pages.

 

 

 

Unlikely Influences

This week we started watching Season Three of The Wire. I was struck by how much my transition page for Midnight Feast resembled the housing depicted in that series. Then I realised that I drew this just after watching seasons one and two, and that I’d no doubt been influenced by the rather depressing backdrop of The Wire as I drew.

I’ve been thinking a lot lately about how everything you do/see/read/watch/hear during a long-term creative project has an influence, subconscious or not, on your final product. It’s important to keep surrounding yourself with good art, good books and, in my case, good TV. Um, okay!

Midnight Feast: Roya’s Scary Bedroom

wireframing

Since I am intimidated by a white page, the first thing I do is fill the page with a midtone colour. Later, after the page is no longer blank, I’ll delete that layer of brown.

Next, using the default pencil in Artrage, I sketch the bedroom. These lines are actually as straight as I could get them without making use of the ruler stencil, but the wobbliness is the look I’m going for. In other words, if I aim for straight, I get pleasantly wobbly. If I’m too careful, the picture will end up looking like an off-kilter photograph rather than an illustration. Besides, this pencil sketch will only serve as a guide and, like the ugly brown layer, the lines will be deleted after I no longer need them. On second thoughts, I never delete these ‘wireframe’ sketches — I just hide them. Who knows when I’m going to need them again later, perhaps for a different page. Although this whole book has been storyboarded, and I know I probably won’t need them… you just never never know.

As you can see, this room is sketched in one point perspective, looking down onto the beds. I’ll need the viewer to be able to see Roya tossing and turning later, because she won’t be able to sleep.

By the way, the outlines for the beds are each on their own layers. By keeping objects in their own layers I can easily change the size and positioning of one thing without affecting the other things. I’m not yet sure about the positioning of those two mattresses, because they’re meant to look lower than the bed. These things will become more clear as the painting progresses, I hope.

 

laying down colour

Above is a screenshot of Artrage.

Since I’m working on the large canvas (iPad size = 2048 x 1536), which won’t be scaled down this time (to make use of Apple’s beautiful new retina screen), it can take ages to fill in large areas such as walls with the felt pen tool, so even though the felt pen strokes are what I’m after, first I use the roller to cover area fairly quickly. I’ve already sketched a different view of this room, so I’m keeping my eye on that as I look at the basic shadows. As you can see, I’ve imported a screenshot of that into Artrage to use as a reference. I am holding the Wacom pen in one hand. My other hand is hovering near the keyboard, pressing Alt to pick colours from that reference photo to use in this one.

walls filled in

Now the walls have been covered with a roller.

The room has to look the same from one page to the other. This poses a dilemma — not from an art point of view but from a storytelling point of view. For this story, each page has two versions: the version that happens in the real world of the main character (Roya), and the world which happens inside her head. For the majority of this story, Roya’s imagination has transformed her shabby, drab apartment into a luscious, brightly coloured interior. Yet she hasn’t quite gone there yet. Instead, she’s still using her imagination but not to good effect. The reader needs to realise that she is still in her bedroom, too, and it’s early in the story, so I’m caught between deciding whether to make use of the drab colour palette or the new one. I’m going to have to experiment with that. At this stage I’m thinking I’ll probably export the final background into GIMP and fiddle with the levels of blue. Then again, I may have to do something inside Artrage itself. As you can see, for the meantime I’m painting exactly the same room as before.

the concrete floor

I have put the floor on a layer of its own because I wanted to use a concrete overlay. This is just a photo of some concrete, which I imported as a tracing image, converted to paint (in a layer above my gray flooring), then adjusted the blend mode to overlay. This is exactly the look I was going for. The good thing about skirting boards (in life as in paintings) is that they exist to cover up messy edges. So I don’t need to bother cleaning those up too much.

 

curtains

In the story, Roya has trouble sleeping partly because it’s too light outside. For this reason the curtains will have to be substandard. I’ll make them a bit raggedy at the bottom. This will come in handy because Roya will imagine monsters coming under these curtains. I’ve heard a few people say they had this fear as children. I’m yet to find out (via user testing!) whether this is TOO scary for a middle grade audience, but I’ve found that worrying too much about the end experience is counterproductive, so I’ll stick to illustrating the story as I would enjoy it.

I have chosen blue for the curtains from the bright colour palette reserved for the b-version of pages, even though I know this is going to be too bright for the otherwise drab room. I’ll desaturate it later. I’m doing the curtains in two layers – first, the opaque layer, where the curtains overlap the wall. No light can shine through here.

opaque curtains

I continued to fill in the rest of the curtains in the same colour (and at 100%) opacity on a new layer, then dropped the opacity of the diaphanous layer (the part of the curtains which cover the window itself) to 75%. I can rarely guess the right transparency of a layer. I started by guessing 50%, but that was too much, so next tried 70. I couldn’t decide whether 70 or 80 percent opacity looked the better but life is too short to spend too much time worrying about such things, so 75 it is!

I then merged the layers and blended around the joins with the ‘instant blur’ tool in Artrage. Next, the spotty overlay, which I had in my library of overlays. I was really pleased at how the whiteness of this overlay meant that the world outside is also bright white. I haven’t yet painted the outside scene, so I don’t really want to show any of it! I’ve also added to the opacity by using the eraser at very high softness and about 20% pressure. Also, I desaturated the blue by -44, which looks better to me.

Sure enough, I had to move both beds over a smidge, so I was glad I put them on their own layers. I have also put a texture over the bedroom wall, but I’m not sure whether I’ll keep it yet, as the entire picture might look too ‘digital’ and not ‘handdrawn’ enough. Textures, like anything, need to be used sparingly. I have also put a poster on the wall above Roya’s bed. This serves two purposes: it tells the reader (at a subliminal level, I’m sure) that this is Roya, in the bed beside the window, and that there are four people in her family. I coloured the mattresses with grey and white, and I chose a grey portion of the yellow range so that when the white and grey mix together, I get a nice yellow colour. I’ve learnt it pays to be mindful of which grey I choose, for that very reason. Even in digital painting, blacks and greys are slightly complicated. There’s more to these colours than meet the eye!

After a few months’ break, I came back to the story and decided that Roya was older than about seven — as a foodie she can be about 12 or 13. This meant that the poster above her bed seemed too juvenile, unless it was something she’d done years ago, in which case she probably would’ve taken it down by now anyway.

Since Roya is a true foodie, it made sense for her to paint a roasted chicken. In my mind her full name is ‘Roya Gourmand’, though this won’t come up in the story. Room 13 sounds appropriately ominous since 13 is an unlucky number in some cultures. It’s fitting that Roya has an interest in painting because she has an excellent imagination. It’s likely she’d want to express herself somehow, with paints or whatever.

I had to desaturate the painting somewhat from the one above because in dim light, everything tends towards black and white.

For several reasons, I decided the little sister should have a poster above her bed, too. First, it’s likely that she’d look up to her older sister, who is a good few years older, and emulate what she does. Second, I’ve been wrestling with whether to give her a name. There are several reasons not to: it emphasises the familial relationship (even though it’s probably clear enough that these two are sisters), and makes the character more universal.

So I decided in the end to keep referring to her as ‘Little Sister’. In many languages, this is perfectly normal, but I’ve noticed from critiques in writing groups that some English speakers consider failure to give a character a name of their own is almost disrespectful. So if anyone feels like this and really wants to know what the little sister’s name is, here it is: I called her Afya, which in Arabic means ‘shadows’. Afya has only a supporting role in this story, so in a sense she’s in the shadows.

I considered getting the resident four-year-old to do me an authentic juvenile portrait but unfortunately she’s going through a pink phase, where every single thing she draws has to be pink. She also likes playing with all the different Artrage tools, like airbrushes, sticker sprays and gloop pens, whereas I wanted this to look as if it’d been done by hand with splatters of actual paint. So yes, I did that myself, taking cues from typical four-year-old paintings that I’ve admired of late.

 

This is pretty much the final version of this page, though I’m experimenting with a drop shadow on the text. I’m not a fan of drop shadows because I think they’re overdone, but when I minimised the picture on my computer monitor to 25% I got a vague idea of what it will look like on the iPod and iPhone screens. I couldn’t easily read the text without drop shadows. But the PC monitor isn’t a great gauge of readability because Apple mobile devices have screens a lot better than my cheapo computer monitors.

Also, when the four-year-old woke up screaming because of a hand moving in the shadows across her bedroom wall I strengthened my resolve to keep the ‘scary on-or-off’ functionality. I’m pretty sure it was this picture which gave her nightmares. Not recommended for under middle-graders, though I noticed that Monster House has a scene in it where a hand comes in through the window, so I’m confident enough that older children can cope with it! Monster House, too, is for middle-graders.

Dan is having problems with memory, because the precursor to this page already has so many assets, so I’ve been advised to err on the side of minimalism. For that reason, I decided not to have Roya tossing and turning in her bed, and I also decided not to have Little Sister’s blanket moving gently up and down with her breathing.

I’m not sure yet, until Dan tries to cut the code, whether we’ll be able to leave both hands coming in towards Roya, because each animation has about 30 frames. I look forward to seeing how the animations look. I’m not at all experienced with animation, so even basic animations such as these are plain old guesswork. I never know how it’s going to look until I see it in action.

The Non-Intuitive Rules Of Design

I’ve been blogging with WordPress for about 3 years and only just noticed the text at the bottom of this screen which says, ‘Thank you for creating with WordPress.

Maybe I’m just not that observant. Actually, I know I’m not that observant, but is it also possible that there is a space on every page which is almost guaranteed not to be noticed?

I’m reminded of a staff ‘de-stress’ sheet which the assistant principal used to distribute into everyone’s pigeon hole on a Friday. High schools are some of the most complex organisations that exist, management wise, and this de-stress sheet was vital in that it told everyone what was happening over the coming week. It was an A5 sheet of paper, folded in two (usually with a lewd cartoon on the front, which we were reminded to keep away from students), and the text inside was surrounded by a black border.

It took me about three years to work out that the MOST IMPORTANT THING of to the week existed OUTSIDE that border, right at the top of the page. It was even in a different font, 16 point instead of 10. It had been designed to be noticed. Yet when I asked around, I wasn’t the only staff member to have missed it.

I had never, ever seen it. Once you knew it was there it was impossible to miss. And I’m sure the assistant principal, who’d designed that template, couldn’t believe someone might fail to see it. I can’t begin to imagine how much trouble I would’ve kept out of had I noticed that particular line of text.

I wonder if there are any ‘rules’ of layout that my boss would’ve lead to a better de-stress sheet. If I can take anything away from that:

  • Just because the designer thinks she’s highlighting something, doesn’t mean the end-users will consider it so.
  • The very act of trying to make something obvious may have the opposite effect.
  • There ARE rules of layout, and an experienced designer no doubt knows them intuitively. I don’t know the rules per se, but I’ve learnt from that one example not to position important things too close to the edge.