Matt Powell - Home

This is how Spring starts

2008-09-04T01:47:00Z

This is how Spring starts.

First, the rain stops. Abruptly, and without warning, you wake up one day in September to the feeling that you could survive the day without a jacket and a scarf. Always a feeling, though, never a certainty: Christchurch will always leave you guessing until about four minutes after you’ve definitely and irrevocably left the house.

This is how Spring starts.

And there are daffodils everywhere. They spring up overnight, in little rectangles along the banks of the Avon, golden and optimistic. There are other flowers, naturally, but the daffodils are like a snowflake, a red-brown maple leaf, or a little stylised sun: they are Spring.

Next, the dust. Also without warning, you find your car, your driveway, your outdoor furniture covered in a very fine, very pale green powder. This is Christchurch: the “Garden City” (even officially so, apart from a brief period a few years ago when the City Council went mad and changed the city’s motto to something ridiculous and forgettable). The trees, which have been holding their breath since March, finally let go a sigh of relief and shower the city in pollen. In Spring, at least, Christchurch can always bring a tear to your eye, even if that tear is the precursor of two months of itching and sneezing.

And then, once the mild weather and lengthening evenings have lulled you into a false sense of security, the rain starts again. And so, once again, you wake up, and Spring has changed the city. The rain has found the pollen, and the tiles and cracks in the footpaths are limned with a luminous green paste that eddies sluggishly in the gutters but refuses to wash away.

Spring is suddenly, obstinately, damply here.

A tale of two brothers

2008-06-25T02:01:00Z

Two brothers, both princes, had an argument.

Two beautiful maidens had been presented to their father, the Sultan, by the ruler of a neighbouring land (a custom which is, naturally, abhorrent to us now, but was certainly acceptable to the princes, and, as it happened, the maidens in question). The argument, then, was over to which prince (or princes), the maidens should be wed.

Two brothers, both princes, had an argument.

Two beautiful maidens had been presented to their father, the Sultan, by the ruler of a neighbouring land (a custom which is, naturally, abhorrent to us now, but was certainly acceptable to the princes, and, as it happened, to the maidens in question). The argument, then, was over to which prince (or princes), the maidens should be wed.

“As I am the elder,” began the elder brother, “my claim to the throne is twice as great as yours, and thus I am twice as worthy of this honour. It is only fitting that I marry both maidens.”

“Ah,” replied the younger, “but that leaves me with no maidens. And if your claim is indeed twice as great as mine, with which I have not the slightest quarrel, then twice nothing is still nothing.”

This puzzled the elder brother, but he hid it well. Clearly, he would make an excellent Sultan.

“What do you propose, brother?” he asked.

“I propose,” replied the other, “that each of us have a share of the maidens, according to our rightful position. I, as the lesser, shall have one share, and you, twice as worthy as I, shall have two shares.”

“But that makes three shares, and there are only two maidens,” countered the elder brother, after only a moment’s consideration.

“Well, naturally, some calculations must be performed,” said the younger brother. “There are now a total of three shares, of which you, honoured brother, claim two, and I claim one. The maidens, then, must be apportioned equally: two thirds to you, and the remaining third to me.”

Here, his brother started to object, but he raised a hand and continued: “I see you have spotted a potential problem with the division of the maidens. After all, of what use to a man is one third of a maiden (for any third, without the others, is clearly without worth)? But the answer is simple. Here, let each maiden be represented by three stones in each of two piles, thusly:”

••• •••

“Put together, we have six stones, of which you take two thirds — that is, four stones — and I take the remainder.”

•••• ••

“Now, the question is: how can we move the fewest stones so that each pile has either three stones (one maiden), six stones (two maidens), or no stones (no maidens)?”

The elder brother contemplated this at length. He scratched his head and rubbed his beard. His brow furrowed, his nose twitched, and his eyes flashed. Finally, with a triumphant flourish, he moved a single stone from the larger pile into the smaller, sat back, and awaited his brother’s response.

••• •••

The younger brother applauded vigourously.

“A wise choice, Highness,” he said. “Now your pile has three stones — one maiden — and mine has three also. And no blood need be shed this day.”

The elder brother rose to his feet and, drawing his curved scimitar, neatly sliced off his brother’s head. Then, placing all the stones neatly in a single pile, he left the palace and went riding.

Tutorial: Children's Illustration

2008-04-26T06:00:00Z

For a couple of years now, I’ve been doing the posters for all the kids’ shows at The Court Theatre (about four a year). It’s a fun little illustration job that brings with it its own challenges, and over time I’d like to think I’ve got pretty good at it, so I thought I’d detail a bit of my process in case anyone was interested in that sort of thing.

The most obvious challenge is that I’m limited to an A4 poster: that’s 210 x 297mm, which isn’t very big at all, and it’s still got to be clear and have impact from a distance, so detail is at a premium. Big, bold shapes work well. Also, I’m limited to two colours plus black, and one of those colours has to be a particular shade of deep red so that the Court’s logo is the right colour. I usually make the other colour either green or blue, and use overprinting to get browns or purples or whatever (although for Badjelly the Witch I used purple and red, and made heavy use of silhouette).

What might not be so obvious, if you’re unfamiliar with the plays in question, is that at least half the time they’re adaptations of fairy tales, which usually means Disney got there first, and have camped out on that particular part of the artistic landscape. In this case, the play is Beauty and the Beast, and it’s hard to imagine anything other than their iconic, leonine creation. Nevertheless, I wanted to steer away from that as much as possible.

When I start out, I usually spend a few days thinking about what angle I want to take (the advantage of this job is that the seasons are planned out a year at a time, so I have plenty of lead time). I think about the crucial aspects of the story – the main characters, the mood, any key events, that sort of stuff – and think about how I can get the most ‘flavour’ across in that one little page (and remember, I have to fit dates, times, ticket prices, sponsors’ logos and everything in as well). Then I start sketching.

I immediately went for a more trollish, reptilian Beast than I’d seen before. I wanted him to look genuinely ugly, not cuddly like the Disney version. I had this sense that he should look really out of place in his fancy clothes. In early sketches I had Beauty standing behind him (and before that, it was her looking at the Beast in the mirror), but that all just got too complicated, and I realised that having her there was actually detracting from the mood of the piece, because if she’s right there, you don’t get any of Beast’s sadness. So instead, I had him holding a rose, which kind of signifies the part of the story where Beauty’s gone back to her father and left him all alone, which to me is kind of the crux.

So here’s my sketch. I kept this pretty rough, because I do all my drawing in Illustrator. Sometimes I scan the sketch in and draw over the top of it, and other times not. It depends how complicated it is. You can see I sketch in blue pencil, which probably wasn’t necessary here, but I like it if I’m inking a drawing because it’s easy to remove. One thing, though: the blue pencil tends to rub off on the scanner, so make sure you clean the plate regularly or you get unsightly smudges.

In Illustrator, I set up my spot colours (Pantone 1807 and 368 and some black) and a palette of graphic styles for the different colours I’ll be using. I used to do all the colouring at the end, but it made printing a hassle because I’d always miss something and some process colours would end up in the final document and the printers would yell at me. So now I make a few tones to use as a palette before I start. (Actually, the colours I used here are mostly from the last poster I did.) If you open up the Appearance palette, you can add multiple fills; if you give those fills varying opacity and set their mode to ‘Multiply’, you can blend the colours quite easily. For example, a mid-brown might have a base colour of 60% red, then a layer of green with 100% opacity, then a layer of black with 35% opacity. I used to do all this with extra shapes and clipping masks, but it just made editing such a pain. Now I start out with maybe three or four tones of each colour I know I’ll be using (red, green, brown and so on) as separate graphic styles.

Next, I assemble the rough shapes of the drawing. I add detail at this stage only if it’s necessary to get an idea of how the piece will look (for example, faces are big). I keep limbs pretty blocky, and group anything it makes sense to group (again, like faces) so that they can be moved and resized easily (because I always need to move stuff around to get proportions and perspectives right). In this case, I drew the body first, but when I’d drawn the face, it looked completely unnatural, so I had to tweak all the points on the body to ‘turn’ it so it was more side-on (the details in the back of the coat helped a lot with this, as I was able to suggest the curve of his back much more strongly).

Some people might use a tablet for drawing these shapes. I could never get used to it, so I draw each shape point by point. It keeps the lines nice and smooth, and means editing is much easier (since each shape has maybe a couple of dozen points at the most), but it does mean you need a lot of practice with the Pen and Direct Select tools. However, I would say that you need that skill anyway for cleanup, so it’s a great way to learn! If in doubt, keep your shapes simple and angular: you can always add detail and refine curves later on.

Here is my secret: there is no such thing as cheating (unless you mean straight tracing). Take all the reference shots you want. Here, I am holding an incense box, of all things, and standing on my chair so I can photograph my own hand in PhotoBooth. Once, when I was working on a Cinderella poster, I got really stuck trying to draw her dress, so I called my sister and asked if I could come round and take some photos of her in a skirt so I could get the fabric falling exactly the right way. Google image search helps immensely, as do stock photo sites: as long as you’re only using the pictures for a general reminder of how a particular object looks at a certain angle, it’s not really copying. I don’t have any real roses to take a picture of.

There are also mechanical shortcuts. A great one in Illustrator is the ‘Roughen’ effect, which essentially adds a bunch of extra random points to a shape. I drew the stem of the rose as a straight line with a thick stroke, used Roughen to give it a gnarled appearance, and then outlined the stroke and tweaked the points by hand: much quicker than drawing it from scratch, and just as effective.

If you want to add detail to a particular line, like I have here with the fur on the back of his legs, you can just select that line with the Direct Select arrow, delete it, and then use the Pen to add new points where the old line was. You can see I’ve also started to tweak the colours a bit (still using Graphic Styles) to make his skin greyer and more repulsive.

As a last step I go in and add shadows. I’ve never been very good with light sources (despite taking technical drawing classes all through high school), so I just do what looks about right. Quick tip: copy and paste in front are your friends here. Make a duplicate of the shape, fill it with the next shade darker, and then delete the bits that shouldn’t be in shadow. You can also add larger shadows by making big black shapes and setting them to Multiply and about 25% opacity. (In this picture, you can also see the Appearance palette open, showing how I made that brown I was talking about).

And that’s it! The important thing is to know when to stop. It’s really easy to keep adding more detail and more shadows, but really, it ends up detracting from the impact of the design. So here’s the finished piece, complete with a title and everything (but without all the show stuff, which I’ll add later):

If anyone has any questions, feel free to leave them in the comments and I’ll answer as best I can.

What rolls down stairs, alone or in pairs?

2008-04-20T22:00:00Z

I lose count of the number of times I enter passwords every day. Sure, there are a few brave souls trying to fix that, but it’s a way off yet. I still think, though, that for all its ubiquity, login is broken.

I’m not necessarily talking about interfaces here (although I’ve seen some truly egregious specimens): I mean the word “login”.

I’m not necessarily talking about interfaces here (although I’ve seen some truly egregious specimens): I mean the word “login”. Log in is an example of a phrasal verb:

I log in	we log in
you log in	you log in
he logs in she logs in it logs in	they log in

Now, if you accept the convention that button text should be a verb phrase in the imperative form (“connect to server”, “launch torpedoes”, etc), you want the second person singular form: log in. Not login. You don’t login to a website any more than you goin to town, eatup your meal or shootdown spurious grammatical examples.

If you think about it, login is clearly not a verb:

I logged in
I logginned (?)
I logan (?)
I logun (?)

So where does “login” come from? Well, check this out:

He is so hung up on this phrasal verb thing.
That’s just one of his many grammatical hang-ups (or hangups, if you prefer).
I looked up her number.
The lookup algorithm on my phone is hideously inefficient.

See the pattern? Phrasal verbs get turned into nouns or adjectives, and the space between the verb and the preposition gets sublimated into a hyphen, or evaporates altogether. So, you can talk about “the login screen”, or “automatic login”, but not “please login to get started”.

A similar thing is happening with “every day” and “everyday”:

This shirt is great for everyday usage (adjective)
I wear this shirt every day (adverbial phrase)
I fail at grammar everyday (wrong)

…and there’s a worrying tendency to use “into” wherever the words “in” and “to” are adjacent, even if it makes no sense:

I finally gave into her demands.

Hey, wow! It’s another phrasal verb! Since in is part of the verb to give in, you can’t squish it up with to. Really, you should only use into when you’re crawling up inside something like a warm kitten. Which is not as often as you’d think.

It’s one of those weird grammatical tweaks that requires a bit of knowledge to get right, but I think that’s why it gets on my nerves so much. Still, a little bit of consistency would be nice.

...and the whole scene unfolds with a tedious inevitability.

2008-04-03T20:35:00Z

Three interface designers are sitting around trying to use a Blackberry.

Sounds like the start of a joke, right? Well, kind of.

Three interface designers are sitting around trying to use a Blackberry.

Sounds like the start of a joke, right? Well, kind of.

Let me rewind: In about September last year, I switched from having two phones (which actually saved me money, since what was killing me was the cross-network charges) to having one phone when Vodafone announced their new plans would include cross-network calling and texting. The oddities of Vodafone’s network meant that I couldn’t keep my Vodafone prepay number with my new phone, but I could keep my Telecom one, so I did. Meanwhile, my old phone has been sitting plugged into the wall at home in case I got any messages or calls to my old number.

Which, it turns out, happens quite a bit: even though I’ve told my boss my new number numerous times, his Blackberry seems to magically switch back to the old one whenever he’s not looking. So this morning, when he was in a meeting, I decided to sneak in there and see if I couldn’t figure out what was going on, because Alan has enough on his plate as it is.

I couldn’t even get into the address book.

Simone found the address book, and found my old number, but couldn’t edit it.

Toby suggested pressing the side button, because that usually means ‘edit’ on his girlfriend’s older Blackberry. That opened the camera and took a photo of her leg. When she asked Toby how to get out of the camera, all we could figure out was turning it off.

Seriously. Nothing is labelled. Nothing did what we expected. And we design interfaces for a living. How does something like this happen?

I know, it’s been a while since I posted anything, but I’ve been collecting things to complain about, which is pretty much what the internet is for, right? Expect more of the same, hopefully tempered by something a little less jaded and cynical.

@fauxparse confused o_O

2008-02-27T09:41:00Z

One thing I did for Webstock was I started Twittering again. Basically, it was a pretty sweet deal, because I felt like I was part of the elite Webstock underground, getting @replies from people I’d never met. But in the days since, I think I’ve picked up on why I left Twitter in the first place, and replaced it (essentially) with updates to my Facebook status:

Twitter can’t grammar.

Basically, the crux of the problem is this: Twitter’s central premise, the form label that became a tagline (or vice versa), asks a question. Twitter’s homepage phrases it like this:

Twitter is a service for friends, family, and co-workers to communicate and stay connected through the exchange of quick, frequent answers to one simple question: What are you doing?

Which is fine. But say I answer that question, sensibly enough, with “ranting about Twitter on my blog”. My status is subsequently displayed as follows:

@fauxparse ranting about Twitter on my blog less than 20 seconds ago from web

If I change it, accordingly, to ”is ranting about Twitter on his blog”, then my brain balks, because I’m not answering the question. Also, though, and more pressingly, if I am looking at my status when I am not logged in (which, of course, is the natural state for the overwhelming majority of the world’s population), I get an endless string of:

is ranting about Twitter on his blog
is eating a delicious bagel
is trying to resist the urge to include the phrase “chunky bacon” in a spurious example
…

…all without the username attached. Which, I’m sure you’ll agree, just looks silly; and that’s before you start adding @replies and the like.

Now, there are a lot of things that are similarly wrong with Facebook (and that’s just at an interface level, but whatever); compare, however, their approach to status updates:

Matt Powell is ranting about Twitter on his blog.

There is (well, there used to be) a compulsory verb, ‘is’, which sets (set) the voice of the whole piece. My name is always displayed. All the updates from my friends follow a similar structure, in the third-person present continuous.

Facebook recently caved to pressure and removed the compulsory ‘is’, but it’s still clearly the preferred option, at least officially. If your last status started with ‘is’, and you click to change it, the ‘is’ isn’t deleted when you start typing, and is thus kind of a default for your new status (this is perhaps one of the interface things they’re not so great at). But hey, they could make that change because status updates aren’t their entire concept.

So, uh, solutions? Just looking at my recent ‘friends’ timeline, the people I follow on Twitter fall into a few distinct categories:

‘answering the question’ style
‘third person’ style
posting complete sentences, irrespective of the presence or otherwise of the username

I guess I am going to try going with the ‘third person’ style for a while. Try it on, see how it fits, you know. It’s just frustrating that there isn’t a clear, consistent solution.

Edit: Nope, tried it. Too weird.

The path to mastery

2008-02-22T17:15:00Z

I’m a sucker for a good kung fu movie, and one that sticks in my head (although it’s not actually necessarily a good kung fu movie) is Jackie Chan’s Half a Loaf of Kung Fu. In it, Jackie Chan starts off as a wandering kung fu wannabe, with no actual moves. He meets a flatulent beggar (!) who teaches him a move called the ‘Iron Finger’ in return for some bread; but then, when he tries to use the Iron Finger in a fight, he’s bested by another move known as the ‘Concubine’. So he learns the Concubine, only to be beaten by ‘Bow to the King’, and so on. Each time the moves get trickier and trickier, and each time the next person he fights is able to trump him with a move he can’t block.

In some ways, that’s what design feels like to me sometimes…

In some ways, that’s what design feels like to me sometimes: I learn a trick, then I use it wherever I can, until inevitably I come up against a problem I can’t solve with it. For example, I’m big on tabs in my interface designs, but recently I did a large project where the navigation was so complex that it would have required about four or five levels of tabs if that was all I used. I had to think my way around it. The same is true of software development, and probably in more obvious ways.

I guess the point I’m trying to make is that it doesn’t really make sense to just wait until you meet a move you can’t block: it’s really our job as designers to be constantly stretching ourselves, looking for new techniques, new inspiration, and new ideas. I know I’m quite bad at this, though: if I see something new and different, my reaction is usually ‘ooh, pretty!’ – but then I close the browser tab and forget about it.

I’ve yet to come up with a system that really works for me for cataloguing and tagging all this wealth of ideas. I’ve tried del.icio.us, ma.gnolia and the like, but I think the problem with those systems is that they make reading and writing easy, but they lack what I can only really describe as immersion.

What I mean is, there should be some way of soaking up all that beautiful, nutritious design goodness without having to consciously remember ‘oh, there was that blog article I read back in August that might work here’, or ‘what did I tag that flickr photo with again?’

Recently I read Malcolm Gladwell’s Blink: The Power of Thinking Without Thinking. Among other things (it’s a really excellent book, and I highly recommend it to pretty much everyone), it impressed on me the value of becoming an expert at whatever it is you do by surrounding yourself with examples. It really is like absorbing design by osmosis: and my hunch is that if I worked out a good way to do that, I’d be a much better designer.

By the end of the film, of course, Jackie Chan has become a kung fu master. He knows so many techniques that he’s basically unstoppable in a fight – and his ability to learn new tricks has increased as well. In the final fight scene, he’s fighting with one hand while following instructional diagrams in a small handbook. Then, suddenly, he’s fighting on his head.

“What’s going on?” asks the Winsome Princess (you knew there had to be one).

“He’s holding the book upside down,” replies the Old Master.

OK, so it’s not a great film, and it’s a pretty crappy analogy. But it’s something to think about.

Everyone has a Webstock Story

2008-02-17T04:00:00Z

When I was 16 or 17, I remember smuggling books into class and reading them under the desk in boring classes: usually the ones I was ‘forced’ into doing because my school didn’t have enough people who wanted to do final-year drama as a subject to justify a drama class, so the two of us got to do ‘Art Design’ instead. We didn’t actually get put in a design class, either, just stuck in the back of Miss Boyd’s print-making room and left to our own devices, which probably explains how I ended up getting a C in design.

Anyway. One of the books I remember reading in such a clandestine fashion was Molly Holzschlag’s Guide to Designing with Stylesheets, Tables, and Frames, which must have been very new out then, and was really my introduction to the crazy new world of web design. Back then, we didn’t even have an internet connection at home, but that didn’t stop me fantasising about, and endlessly redesigning, my own personal web page.

This is mostly relevant to this post in two ways. Firstly, that I haven’t stopped fantasising about, and endlessly redesigning, my own personal web page. I think I’ve had three or four designs that have actually made it live, and probably ten times that many that maybe made it to the templating stage before being abandoned. This site has consisted of a ‘coming soon’ page for a good three or four years; before that, an older version (which I won’t link to here) is still floating around the tubes somewhere, despite my having ceased subscription to the hosting provider at least five or six years ago.

I think the main reason I haven’t just got something up there has been that I have been looking for a way to package every aspect of my (rather complicated) life into one neat little box, including anything and everything I’ve ever done on the Internet. One thing I realised at Webstock this week, though, was that nobody cares about the past: at least, not in the way I mean it here. Little bits of code I wrote for long-dead computers, cartoons referencing student politicians from bygone eras, ‘news’ articles about a toothache I had this one time: they’re all completely irrelevant to anyone who isn’t me, so why am I wasting my time archiving when I could be creating and contributing?

I’m not sure how this bold ‘do something NOW’ approach will work out. For example, I’m using a theme for this blog I haven’t customised at all, and for the first time since I realised you could use software to run a web site, I am using somebody else’s software out of the box, which scares me a little (although I did make sure I could customise it first). I just wanted to start doing something, and worry about the details later.

The other reason my little anecdote is relevant is that Molly was one of the speakers at Webstock. I was really excited about hearing her speak (along with some of my other Web heroes like Dan Cederholm and Kathy Sierra), given what an influence she and her books had had on my formative web years; what I never expected was that I’d get a chance to tell her in person at a Wellington Bar after the closing dinner.

She seemed really touched. Unfortunately, she also seemed really drunk, and so now my Webstock Story™ is about exactly how many of my shirt buttons Molly Holzschlag thought should be undone. Which, I guess, is just proof that we’re all human. But she did leave me with one piece of advice: “Have a beautiful, beautiful life”.

I’ll do my best.