The Three Little Pigs. Two-sided art. Can you guess what's on the back?

Godzilla Lose Ice Cream

Hanging the show.

Last Saturday I had the pleasure of showing off some art during the Ballard Art Walk. The good folks at Stoke Strategy hosted the event, and have generously provided their presentation wall as a temporary gallery for the next few weeks. If you’re in the neighborhood, stop by and check it out.

The poster set the look and feel for the 2010 Seattle Restaurant Week marketing materials.

Last week I received a few samples of the poster LookatLao and I designed for Seattle Restaurant Week. My partner-in-design Geoffrey Smith first spied it a few weeks ago posted up in the window of Anchovies & Olives, one of the over 100 restaurants participating the upcoming event.

This poster provided a jumping-off point for the folks at The Seattle Times, who have been busy rolling out the design in all manner of marketing materials and social media outlets. It’s been great to see the concept at work and to hear excitement building for the event. It sounds like it’s going to be a success for restaurants and patrons alike, and will hopefully be the first of many Seattle Restaurant Weeks to come.

A new logo for a new Seattle restaurant event.

In lieu of repeating such a well-written blog post, I offer a link to LookatLao’s account of our recent team effort in designing the Seattle Restaurant Week logo. A fancy poster is nearing completion, which will hopefully grace every storefront window in Seattle by mid-March. Stay tuned!

Close-up showing the linework close to actual size.

Full illustration. Click on the image view it large.

Here’s an example of an illustration style I’m trying on. I drew the outlines with one No. 2 pencil and many sheets of tracing and layout paper. To get the detail in the face and bicycle parts I worked large, breaking the drawing into parts. I then scanned the parts in, reassembled them in Photoshop and brought in a few textures from a texture library I’ve been building over time. After I added the color blocks, I spent a good while tweaking the color palette and finessing the layer transparencies.

Color-wise, this could easily have been a springtime or fall scene (or a winter one if not for the flowers and sundress) but I ended going with a warm, golden, end-of-summer look. Which is nice to reminisce about when the frost on our deck is barely melting during the day.

I also incorporated transparency and ink effects to mimic glazing techniques often used in oil and water color paintings. The resulting illustration is somewhat complex and would likely need to be converted to a different file format for printing. But I think the visual effect is interesting, and I plan to explore simplified combinations of textures and gradients in some upcoming illustrations. And as always, if you have any thoughts or suggestions, feel free to comment!

Fortunately, Illustrator also provides tools that help you turn your napkin sketch into vector art without digitizing the life out of it. I sketched this spot illustration with a marker brush, creating large-stroke drawing for the bird plus a batch of pencil outlines for the color blocks. I then scanned the pieces and outlined them with Illustrator’s Live Trace tool, using different settings for the thick brush strokes versus the thin color outlines.

After combining the resulting vector outlines, I was able to play with color until I developed a palette I liked. To me this is one of the major benefits of vector art. I can explore and change color quickly, testing ideas and keeping multiple copies of variations I can go back to later. And if a client needs a change, I can work more quickly and efficiently with a vector file, without having to go back to the napkin.

A cleaned-up version of the brush drawing.

Final spot illustration.

Outlines for the color blocks.

The Submarines poster on display at the "Sasquatch! Posters!" show.

A few months back I was among the lucky designers invited to create a poster for an artist playing at the 2009 Sasquatch! Music Festival. Through a controlled lottery I ended up with The Submarines, an indie-pop group with female vocalist and a lighthearted, sunshiny sound. Because this was a labor of love (read: no compensation) and I was paying for the printing, I pretty much had total creative control. Which was somewhat intimidating at first, but I’m really happy with the result.

Although the show organizer requested only 12 posters from each designer, I printed a total of fifty, with a few extras thrown in by the printer. The remaining posters are now for sale at gigposters.com.

My paperback classroom.

Back in 2003 I designed and produced a pair of personal web sites: one for my artwork and another showing my design work. I maintained both of them for a couple of years, then refreshed my art site in 2005 while my design site languished, becoming one of those places showing a perpetual “under construction, come back soon” notice. I built all of these sites in the now hopelessly outdated table-style, slice-and-dice method.

Fast forward to 2009. While my art site is old, it’s easy to maintain, still works pretty well visually and the browsers still like it (for the most part). My design site, on the other hand, just needed to be replaced. Time to start from scratch. Doing so would allow me to breath some life into the design while learning XHTML and CSS, the (not-so-newfangled) way of separating content from presentation.

So after a couple months of asset gathering, book reading, typing and tweaking, I have a working web site to show the world. The learning process has been interesting and pretty fun and — from what I can remember — a lot less painful than it was in 2003. With CSS controlling the appearance, you can tweak a style and have the change automatically apply to every page — extremely handy when dealing with changes on 20 to 30 separate pages. And having the HTML free from styling makes for more readable markup and a speedier development process. In the interest of learning I chose to hand-code the site rather than using an application that generates the markup for you, such as Adobe Dreamweaver. Not that I won’t use Dreamweaver in the future, but because I typed everything myself I have a better knowledge of the syntax and how to tweak the markup of an existing document.

I wanted to show multiple images for a few portfolio items, so I added a gallery-style subnavigation using JavaScript rollovers.

In addition to CSS I’ve ventured into previously uncharted territories of PHP and JavaScript (my dear husband coded my art site in case you are sleuthing). Many of the navigation blocks exist in a separate PHP file which is “included” with the page when the document loads — a pretty neat trick and a great way to easily manage navigation updates. The JavaScript rollovers used on the portfolio page thumbnails were somewhat tricky, involving testing the states of all the thumbnails on page. The resulting code works, though I’m certain it could be more elegant, which is what I’ll tackle in the next phase — or the part where I can continue to tweak and add functionality while having a real live site too.

Phase two includes tweaking the markup and code to make the site as lean and perfect as possible, as well as integrating WordPress or similar blog software so this page works like an actual blog, instead of just looking like one. I also I have my eye on some fancy jQuery extensions that I’d like to try out for a video I have yet to post.

My goal behind building this site on my own was to learn as much as possible about the nuts and bolts of current web site development, with an added bonus of having complete control over my design vision. Now, because I know the basics behind building a site, I can more confidently design one that takes advantage of current technologies, while also avoiding the pitfalls that come with any particular media. And after a little more practice, I can confidently take a site from design through development on my own. And I think that’s pretty cool.

Resources and Credits