Tag Archives : design


Adobe Illustrator will Iron Your Shirt

I confess I had not given Adobe Illustrator nearly enough attention over the years, until recently. Photoshop used to be my go-to app for comping/wireframing/pre-production deliverables for years. In fact, Photoshop is still used in some of the top companies for exactly that purpose. This is certainly not what Photoshop was built for originally, but those designers are a wacky bunch. Eventually, features like slices and Layer Comps wormed their way into the software spawning new web prototyping workflows.

The Problem with Photoshop Comps

The problem with Photoshop in this context, aside from its limited support of vector artwork, is that it lacks multipage support. Layer Comps are great for enabling designers to maintain representations of multiple application “states” in single PSD files – which can, incidentally, be placed into InDesign layouts, with specific states activated, for presentation purposes – but the reality is, building these files is cumbersome at best. The result can easily become a labyrinth of grouped, nested and duplicated layers which becomes incrementally less manageable as each comp is added.

Overengineering with InDesign

Illustrator Multi-Exporter ScriptInDesign, of course, is the be-all and end-all of multipage layout software. (If anyone is aware of anything that truly comes close, I’m all ears. I’ve had people suggest a few things to me over the years, but I’ve shut them down with the mere mention of Object Styles. If you’ve never heard of them, well, you’re in the majority. Suffice it to say they’re tremendously powerful yet seldom understood.) InDesign also has a formidable set of vector tools, but Adobe Illustrator can always be used for complex vector compositions, which can then be seamlessly imported into InDesign.

Adobe Illustrator Artboards to the Rescue

Photoshop Export Layers to Files ScriptStill, InDesign can be a bit much, as it turns out, for virtually anything other than lengthy, text-heavy projects. Thankfully, Adobe Illustrator CS4 introduced multiple artboards, which effectively made Illustrator my primary design tool. In my case, I design for print and web far more often than I build books. For those occasions, InDesign is always there.

With multiple artboards in Adobe Illustrator, an entire branding project can be housed in a single file. One caveat is that only one unit of measurement can be set within that file. Thus, if the project will span print and web, two separate files can be used; otherwise, there will be some switching of units (likely inches/cm to pixels and back) during the project.

The missing ingredient here is automation. Thanks to Matthew Ericson over at www.ericson.net, there is a script which exports layers and artboards to individual PNG files, even at double resolution to retina displays if you so choose. You can download the script right here.

Multiple artboards can be exported to multi-page PDF or placed into InDesign layouts. I’ve managed to avoid the InDesign phase for the vast majority of recent projects. I try to avoid complex wireframes, for that matter, as I feel the wireframing process can distance developers from actual users which can result in a lot of wasted time. The Lean UX approach favors “Getting Out Of The Deliverables Business,” but if you can’t avoid it, Adobe Illustrator’s second-to-none toolset is right there, so add a few artboards and wireframe to your heart’s content.

There is also a similar script for Photoshop downloadable right here. My typical use case is the need for multiple PNG files of the same dimensions. Simply stack the layers, including placing vector files, name the layers individually, and run the script.


Gestalt Ingenieur

I came across a quote from Dieter Rams in an article here:

I am troubled by the devaluing of the word ‘design’. I find myself now being somewhat embarrassed to be called a designer. In fact I prefer the German term, Gestalt Ingenieur.

Gestalt

Just a Doodler

Gestalt Ingenieur translates to Shape or Form Engineer; though I would not profess to being an engineer, I like the inclusive nature of this term. Besides, it sounds exotic. I’ve always been uncomfortable referring to myself as a designer, despite having held the title formally on numerous occasions. Thanks to the likes of Rams, Ive, Apple and many others, perhaps design is getting some proper recognition these days. Nevertheless, my father was, in my view, the ‘Real Deal.’ He could illustrate, by hand. He was trained. Me, I’m a doodler, albeit a fairly accomplished one, especially if you count the fact that a couple of my comic strips were published (full disclosure: it was a college publication circa 1990, and the editor was one of my closest friends).

Having been around and owned computers for virtually my entire life, I’ve never shied away from getting my hands dirty when it comes to coding, or scripting, or programming. The Graduate Supervisor at San Jose State University, where I’m pursuing my Masters in Computer Science, asked, “So you think you can code?”

Gestalt Ingenieur, What?

I do code. I wouldn’t call myself a programmer any more than I would a designer, but the reality is programming is a large part of what I do, but it’s all a means to an end, whatever it takes to accomplish the puzzle of the day. These puzzles, for me, tend to be usability-related. Sometimes, they’re people-related. All the jQuery in the world can’t solve those kinds if problems. In those situations, pretending to be a sea of tranquility is sometimes the best bet. In short:

Check your own Gestalt.


Draw

‘Lean’ (re: Eric Ries’ The Lean Startup) is a notable buzzword these days, perhaps inspired by our recession and everyone’s obsession with trimming fat, getting rid of waste, stop resting on your laurels, that’s-what-got-us-into-this-mess-in-the-first-place mentality. I recently mentioned Lean UX to someone and they perked up: “What can you tell me about that?”

I can tell you that I owe my career as a graphics-visual-ui-ux-whatever-you-feel-like-calling-it-guy to this methodology, if you even can call it a methodology. I was lean before it was a trend – and I’m not just referring to my BMI. I’ve held graphic design positions (regardless of what the actual titles were) at all kinds of organizations huge and small for decades, yet I still have a hard time referring to myself as a graphic designer. My late father was one of the few real graphic designers I’ve ever known. I should be so lucky to have but a fraction of his raw talent. At least, I am assuming he had raw talent, although he did actually go to school for it. Nevertheless, I can hold my own. The fact that I know the de facto software inside and out may help, though that should be expected of anyone in this field. However, when it comes time for a design meeting, no one cares about what software you use or how clever you are while using it. It’s all about the product.

Disembodied HeadThe idea is simply to get something in front of the stakeholders as early as possible. This is the product. It will be, by definition, imperfect, raw, and in need of revision. Unless you work in a vacuum, this has to happen. Ideally, there will be a few (three is a great number, never less than three) versions to review. Listen to the comments. Absorb all input. Get over yourself.

Keep iterating. Incorporate suggestions, revisions, diatribes, everything is fair game. Do not stop iterating until the product is shipped, printed, published, posted, tweeted, and of course, Pintstagrammed. After that, keep iterating, unless it’s a one-off project, in which case iterating means using all this knowledge thus far to help streamline future projects and meetings with this cast of characters who have entrusted you with their naked souls.

Whenever possible, draw.

This falls under the “I should take my own advice” category, as my own manual drawing has taken a back seat to the computerized variety for far too many years. Why draw? If a picture is worth a thousand words, a lousy picture could become a cacophony of insults. Without a doubt, this is why most people refuse to draw in the first place. Again, get over yourself. I’ve been told that I can, in fact, draw. We all can. We can all make pictures using whatever tools happen to be around. I developed whatever abilities I have over time, with practice. Pictures are far more efficient than words, and drawing by hand can still be far more efficient than using a device. There are finally some electronic tools these days which can replace pen(cil) and paper, but they cost a lot more money. Until tablets are everywhere, lo-tech can prevail.

After all this reading, I’m feeling like going back to the drawing board. That’s right, I said it. Enough with the overengineering already. Time to put pen or pencil or marker or blood to paper. Kill some trees – as long as the paper’s recycled. Maybe notes from my next design meeting will have no words at all. Maybe there won’t even be wifi. Back to basics, keep it simple, return to the roots. Feel free to insert some Buddhist-sounding cliché here.