Reid Beels

I’ve been using sIFR for a while to get pretty typography for my headers on this site. As part of my latest design refresh, I upgraded to the beta of sIFR 3 and discovered something cool in the process. It’s possible to embed an image within the flash movie used by sIFR and use the dynamic text to mask the image, creating some nifty effects. The gradienty text in the header (which displays my current Twitter status) is done using this technique and I’m exploring how it can be used for other fun things. The drawbacks to this is that you have to create a separate flash file for every image you want to mask and that file is also separate from any other sIFR stuff that you happen to be doing. The same effect could be acheived by using server-side tech to generate images (which would be a bit smaller than the flash file), but the ease-of-use and ability to modify the text at runtime makes sIFR masking interesting. If you’re curious as to how to pull it off (even if you’ve never touched flash before), read on.

(more…)

Subway Speed 2 on Vimeo

With 468 stations, more than 700 miles of track, and over 6,400 cars, the New York subway is one of the largest and most complex transportation systems in the world. As someone who has long been fascinated with railroads, maps, and public transportation in general, interacting with the subway on a daily basis has been a highlight of my stay here.

Time has worn heavily on the subway but even in the deteriorating spaces created by years of lacking maintenance, the iconic simplicity of Massimo Vignelli’s wayfinding system shines through. Each line is represented by a letter or number in a circle or diamond. Lines that share a route are grouped by a common color.

This color coding is arguably the system’s most powerful component. By breaking the network down into chunks that serve a similar function, the colors place the incredibly complex network within the paradigm of The Magical Number Seven, Plus or Minus Two.

I assumed people would refer to these lines by their color codes, but they don’t. It’s not “the blue line”, but always “the A-C-E.” I don’t know where this naming convention originated, it actually ends up increases the usability of the system greatly by providing a nemonic device for the contents of each group.

All of this wayfinding is great on its own, but is tied together by the ubiquitous subway map. The map has taken many forms over the years, which I’ll be discussing in my next post.

This post was originally written as part of a blogging project for PNCA about my time in New York.

I stopped by the Greenwich Village Halloween Parade earlier this evening and caught these amazing pumpkin-headed puppets before the crowds got so thick that I couldn’t see anything. At school, the Halloween celebration came early with a costume contest sponsored by the Communication Design department. A pair of students with wheeled hands and feet, representing “The Spirit of the G Train” (the notoriously-late subway that runs near campus), won the grand prize.

The design department’s sponsorship of this event got me thinking about just how much a well-conceived costume can communicate. While many are archetypes of the season (zombies, witches, etc) or distinct fictional characters, I find costumes that are based on more abstract concepts or on unexpected physical objects to be the most interesting.

Outside of the holiday, a living representation of an idea can sometimes be the most effective way to communicate, yet designers are often hesitant to move away from the ‘flat’ world in which they work. Only rarely, in select advertising campaigns and theme parks do we see companies taking their brands off the page and into the real world. While I’m not saying that costumes are necessarily the best way to solve most problems, they are often overlooked.

For more conceptual (and incredibly witty) costume ideas, I’d recommend taking a look at Jane Asher’s Fancy Dress (especially the later pages).

Yesterday I got the chance to head out to the New York Hall of Science hoping to gain inspiration from their signage for a museum project I’m working on. Their wayfinding system was effective, but didn’t provide too much enlightenment. The museum offered a nice assortment of hand-on exhibits, many that I had seen elswhere (I think I was spoiled by OMSI and the Exploratorium as a child).

By far the thing that stood out most to me was an exhibition called ‘Connections: The Nature of Networks‘. It deals with many kinds of networks that exist in the world, from rivers to the internet, and the theories behind them. A bit of research shows that it was designed by Jeff Kennedy Associates who has a fascinating (and probably internal) site on the early development of the project.

I was quite impressed with the variety of networks that the exhibit managed to cover. You could see what happened when a break occurred in a power grid, scrub through video showing social interaction of various creatures, and visualize node interaction in a network of ropes and pulleys. Among the other geeky wonders showcased were a giant version of Conway’s Game of Life, Internet Arm Wrestling, and a touchscreen GIS viewer turned exhibit showing the paths of subway, telephone, major roads and cable TV throughout Queens.

My personal favorite installation was a video processor that tracked the paths of visitors through the exhibition space (shown above). It wasn’t the most accurate, but it did a pretty good job and definitely had that “wow, this is cool” factor. You could scrub through about 5 minutes of path history with a trackball and switch between the path-only view and a live video feed from the cameras above the space.

The first thing that came to mind after seeing this exhibition was a session at barcamp that I didn’t get to go to but wish I had entitled “Spreading the Meme: How people get into hacking. How can we get get more to start?“. Connections: The Nature of Networks seemed that it could be quite effective as a step towards this goal of getting kids interested in technology and networking.

Continuing with the critique of television advertising, I just finished watching the playlist of super bowl advertising on Google Video. Overall, I think that I’ve been more impressed in years past, but there were definately a few high points. Some things that I noticed:

1. Jerome Bettis for asthma control test
   (okay, admittedly, this is nit-picky and nerdy, but it stood out and I’m posting it) This ad is sponsored by GlaxoSmithKline and urges people with asthma to talk to their doctor about ways to control it. While I do have problems with this recent trend of drug companies advertising their products to a mainstream audience, that’s not my problem with this advertisement. My problem is that when they show a screenshot of their website it’s being displayed in the IE 5 for Mac. This technology is dead and abandoned folks, get over it. Now, the only excuse I can think of for it is that the scroll bar in the screen shot looks green and the last time that was an option was in Mac OS 9. The window details are a bit blurry in this video capture, but it still shocks me that any self-respecting media-production company would still be using that system and browser.
2. I wasn’t very impressed by the inevitable cornucopia of beer ads, but my favorite was this one (Bud Light - Secret Fridge). Another ad from Budweiser, ‘The Wave‘ seems to me like a pale imitation of Carlton United’s ‘Big Ad’.
3. Burger King’s entry ‘Whopperettes‘ seemed like an interesting way to continue their current over the top advertising strategy, but was fairly poorly executed in my opinion.
4. Degre’s ‘Stunt City‘ is a cool ad, but isn’t new.
5. Emerald Nuts. Their terrible wordplay never fails to amuse me. Greatly. Probably too much.
6. Having driven a car that gets between 25 and 28 MPG for most of my driving life, I’m wasn’t all that impressed by the fact that the Ford Escape hybrid gets 30 MPG. However, I suppose all steps taken to get SUV owners to not be such a bane to existance is a good step. Still, I had hoped Kermit had better standards.
7. GoDaddy.com, your ads annoy me. Sure, you got banned from last year for being overly racy. Sure, you have cheap domain names. Using these two things as the basis for an entire campaign seems uncreative. Also, your logo sucks and your website is ugly. You’d think when advertising a web-based service, you’d put a little bit more money into getting a design that doesn’t scream 1999 quite so much. 305 validation errors on HTML 4.01 Transitional! 606 for XHTML 1.0 Transitional! Grrrrr. Stupid web economics where profit != quality. Grrrr.
8. Hummer’s ‘Monsters‘ ad for the H3 has me a bit confused. It’s well-produced and sends a message that I sort of agree with: “The only way the H3 could be produced is as the ill-conceived lovechild of those bent on destroying the world.” Somehow, I think that might my Ashland upbringing and personal views talking and not the message they wanted to convey…
9. Pepsi’s ‘Hip Hop Can‘ wasn’t all that new of a concept, but stuck with me because we had been discussing the person who brokers a lot of cross promotional deals between products and musicians. It’s interesting to see this process simplified and played out (admittedly with added anthromorphization) on screen.
10. Scott Tissue’s ad, featuring Mike Ditka, bothered me no end. Maybe they’re trying to appeal to a certain redneck aesthetic that I don’t understand, but the production quality of this spot looked like something that we would have shot in the WAMS studio and put together before we started using nonlinear editing. No, strike that, it looked worse.
11. The United Airlines ‘Dragon‘ spot was by far the highlight for me. The animation was amazingly beautiful. It’s one of those styles that I really wish I could acheive myself but haven’t been able to when I’ve tried. Wow. Just wow.
12. GM’s ‘Live Green, Go Yellow‘ kind of seems like it’s an automaker trying to portray themselves as greener than they actually are because it’s the cool thing to do. While E85 is cool, I’d like to see them move beyond that.
13. FedEx’s offering ‘Stick‘ was well done and had an interesting concept behind it. I think I’ve seen them do better, but it still stuck with me.
14. Last, but certainly not least, Dove’s spot promoting The Campaign for Real Beauty , a project that’s working with several global organizations to combat harmful stereotypes for girls, intregued me. While it may be clever marketing on the part of a multinational corporation (Dove->Unilever->boo, animal testing) to improve their image, the campaign seems to be actively doing some good things.
15. Update: Also, there’s this MacGyver MasterCard ad which didn’t make it on to Google Video’s list but is rather amusing.

The rest of the ads made up the middle ground. Not great nor poor enough to get mentioned in detail.

Sometimes I see an advertising campaign that just bugs me. I just watched a television ad from Nestle for their pre-made packaged cookie products. It showed a mother and her children baking cookies together with a voice over beginning “childhood quickly flies away like cookies on a plate”. While the sentiment they’re trying to convey “bake with your children and childhood won’t seem to slip away as quickly” is nice, their product is working for an opposite goal. By removing most of the process (”just place, bake, and decorate” the voiceover continues) they’re removing the pedagogical value of the experience and making it be over even faster. Now, sure, your children will still get to decorate the cookies (using the provided frosting and sprinkles, of course) but their idea of what it means to bake cookies will be seriously distorted. By advertising like this, not only is Nestle pushing to distort valuable childhood memories, they’re chipping away at their future chocolate chip market.

While I had a vague idea of features that I’d wanted to include when working on my current site design, I hadn’t thoguht them through enough when I started. As it happened, the design evolved out of some things that I discovered while implementing a different design in css and just stuck. In this process, it lost the ability to work with some of the functionality that I wanted it to have and it’s just kind of sat here in a half-finished state for some time now. Because I’m tired of it sitting like this and need to get a solid design worked out so I can focus on content and other important things, I’m redesigning the site with a lot more focus. Read on for a list of stuff that I’m planning on doing. Tell me if any of it sounds crazy.
(more…)

Back in December of last year, Erin, Leah, and I collaborated on a children’s book for our ethics class. After much discussion of content, writing of text, drawing of pictures, and painting of backgrounds we all met one night in the student publicity office to assemble everything into a finished product. Many hours later, we emerged victorious holding the one and only copy of our masterpiece: Be Patient, Peter, which we promptly presented to our professor and never saw again.

Later on, when I went back to look for the files I was unable to find them. After much searching, I eventually resigned myself that the work had been lost forever, the digital form to the ethers of technology and the physical form into the hands of Dr. Etlich. This being said, you can imagine my joyful surprise when I stumbled across all of the original production files nestled safely in the root directory of my iPod. Huzzah!

And so, without further ado, it is my pleasure to present the special edition digital reissue of our groundbreaking philosophy text:

Be Patient Peter (PDF)

If you aren’t yet convinced of the glory of the publication, I produce for you the text from the back of the book:

The purpose of this book is to teach children about philosophy. The wonder of young
minds lies in their ability to both accept new concepts and exercise reason. Through the short
narrative about young Peter’s meaningful walk in the park “Be Patient, Peter” provides a short
overview of various philosophical concepts and introduces the young reader to five points of
view.
Peter becomes upset when his mother doesn’t allow him to swim unsupervised with his
older brother. Even only children can relate to the frustration encountered when age presents
a road block. Initially, Peter feels angry and resorts to vengeance. “I’ll show her,” he claims,
and heads out into the woods intending to swim against her wishes. Along the way he meets
five classic philosophical minds, Socrates, Aristotle, Lao Tsu, Confucius, and Sir Charles
Darwin, who help him understand the reasoning behind his mother’s rules.
Socrates teaches Peter what philosophy is, the expectations involved, and the need to
talk to people to understand. Aristotle talks about virtue, balance and patience. Confucius
introduces the concepts of cause and effect and duty. Lao Tsu brings in the need to understand
and yield to the forces of nature. If we stop looking for results, and live in the present, the
answers will find us. Darwin continues this line of thought, introducing the idea that people
are animals too. He explains to Peter that over time he will mature and that is why he must be
patient. By the time Peter reaches the water hole he changes his mind.
Expect a lot of questions from young readers!

On Sunday I spend nine hours at PNCA sitting in on a planning meeting for p:ear, a local nonprofit that works with homeless and transitional youth through arts, education and recreation programs. I was not there to learn about p:ear or to help them plan their future but to study their planning process as part of a strange little extra-curricular project that has spun out of my Design Studio II class. John Calvelli (the teacher of this class), Gabriella (another student), and I (me) all attended the meeting and throughout the process Gabriella and I weren’t exactly sure what it was we were supposed to be looking for. We’re working on coming up with ways that design can be used to help the process progress more easily and efficiently, but what exactly that meant was rather unclear.

We met again this afternoon to debrief from the long meeting and brainstorm ways that design-based improvements could be made to the process. We still aren’t exactly sure what we’re looking at doing, but some strong ideas are surfacing. Mostly supplemental materials (informational packets, workbooks, etc.) and physical organization of data around the room.

Lured by the promise of something interesting and by the beautiful poster, I made my way over to PSU on Saturday to take a look around at the Stumptown Comics Fest.

I woke up late and hopped a streetcar over to PSU where I made the poorest decision of the day (possibly of the week, or even month) when I decided to try a chicken bento from Rice Junkies. Having attempted to eat it (and failed) I must say that even if you are on the verge of starvation DO NOT EAT THEIR FOOD. The rice was dry and almost inedible and the chicken 1) didn’t look like any chicken part I’ve ever seen and, 2) was dry, chewy, and flavorless. The sauce brought on another entire level of the inferno that was my lunch, adding an insultingly bitter twist to the injury of the food.

After ditching the so called meal in a nearby trash can, I made my way to the Fest itself. The exhibition floor was scattered with an impressive selection of artists peddling their wares, chatting with curious readers, and happily sketching away. All of them seemed very pleased to be there, reveling in the community that was their own. I felt a little out of place, not knowing much about the ’scene’ that was represented, but after wandering a bit it didn’t seem to matter.

As usual, the things that I noticed as I examined the work leaned towards layout , printing techniques, and other designy elements. Several books caught my eye not because they had a compelling concept and amazing illustrations but rather because the hand-lettered type was so beautifully executed.

When 5:00 came around it was time for the Comic Art Battle, an amazing no-holds-barred war of pictionary on something psychotropic and highly illegal. The opening event was a ‘foundation challenge’ between two local comics journalists, one from the Willamette Week, the other from the Oregonian. The audience chose the actions of gargling and grave digging (simultaneously) and the artists took to their easels and drew their interpretations of a volunteer audience member performing these actions. Five minutes later, the winner was chosen by audience applause. The Big O took the cup, but both drawings were greatly amusing.

It was then time to move on to the main event of the afternoon. For the four-round comics battle, this years theme was ‘Girls vs. Boys’. After a quick introduction of the players (with The Final Countdown playing in the background) the first round began. Again the audience was polled, this time for an adjective, a verb and a noun. As the selected artists from each team began their drawings of an inebriated elephant playing soccer, insults such as “Of course she can draw an elephant, she’s a republican!” were flung between the contestants and the audience responded with appropriately shocked gasps.

Round 2: The Battle Royale. Two artists compete on the same piece of paper, illustrating a battle between audience chosen armies. Soon beavers and giant squid filled the paper, using teeth, harpoons, tentacles and the INK ATTACK to wage a mighty war.

Round 3 was drawn by volunteer artists from the audience. A young boy named Rolly (probably spelled wrong) who had been eagerly suggesting topics, raising his hand, and jumping up and down excitedly went up against a girl whose name I wish I could remember, but can’t. They bravely illustrated an audience member ice skating.

The final round was a collaborative six-panel strip with two artists from a team working together. Once again, the audience came through with a great topic: botched surgery. Both entries were amusing, but the girls’ took the cake in terms of completeness and plot.

In the end, the girls were declared victorious and the battle came to an end. It was entirely too much fun while it lasted and I laughed long and hard. The next time someone needs an idea for a comics fundraiser they should just do this. It was ten times funnier than much of the improvisational comedy that I’ve seen and it lets the audience see the artists at work.