24
Before & A f t e r ® How to design cool stuff Issue 33 May 2003 www.bamagazine.com A Tale of Two Republics He a writer, she an artist, they started Banana Republic as an excuse to travel. Their work was called “the best catalog concept ever”—it was literate, entertaining, a make-believe world expressed in design. Within a decade, Banana Republic was grossing a quarter billion dollars per year. After that, they dreamed up The Republic of Tea, and, incredibly, did it all again. Mel and Patricia Ziegler, who know more than a little about putting together a good page, have a few words for you about the art of the idea.

Before & After Printissue

Embed Size (px)

DESCRIPTION

Before & After Printissue

Citation preview

  • Before&AfterHow to design cool stuff

    Issue 33 May 2003www.bamagazine.com

    A Tale of Two Republics

    He a writer, she an artist, they started Banana Republic as an ex cuse to travel. Their work was called the best cat a log con cept everit was literate, entertaining, a make-believe world expressed in design. Within a decade, Banana Republic was

    gross ing a quar ter bil lion dol lars per year. After that, they dreamed up

    The Republic of Tea, and, incredibly, did it all again. Mel and Patricia

    Ziegler, who know more than a little about putting together a good page, have

    a few words for you about the art of the idea.

  • 2 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 3

    Inside B&A

    John McWade Creative directorGaye McWade EditorGwen Amos Design editor

    ContributorsChuck Green John OdamHatsy Thompson

    Editorial offices Before & After magazine2007 Opportunity Drive, Suite 10 Roseville, CA 95678 Telephone 916-784-3880 Fax 916-784-3995E-mail [email protected] www.bamagazine.com Do business with us online! At bamagazine.com you can subscribe, cancel, renew, order back issues, change address, whatever, quickly, conveniently and securely. Subscription rate $48 per year (6 issues). Canadian subscribers please add $9 and remit in U.S. funds; overseas subscribers add $21. Before & After, How to design cool stuff (ISSN 1049-0035) is published bimonthly (January, March, May, July, September, November) by JMS Publishing LLC, 2007 Opportunity Drive, Suite 10, Roseville, CA 95678. Periodicals-class postage paid at Roseville and additional mailing offices. Postmaster: Please send address change to: Before & After, 2007 Opportunity Drive, Suite 10, Roseville, CA 95678. Issue 33, May 2003. Copyright 2003, JMS Publishing LLC. All rights reserved.

    JMS Publishing LLCJohn McWade CEOMichael Solomon Chairman

    Before&AfterHow to design cool stuff

    No surprises Focus sharp? Eye contact good? Veers ImageZoom lets you detect trouble before you buy.

    RUBB

    ERBA

    LL.C

    OM

    Back to the future Well, that didnt take long. Some of you loved it, some hated it, but our adventure with the tabloid page lasted just two issues. The deciding factor? A survey showing that 97% of B&A readersstatistically, everyonearchive and refer to their back issues. For that, a tabloid simply doesnt work. In returning to a standard page, we explored adding loop stitchingstaples that slip over binder ringsfor the ulti-mate in archival friendliness, but postal machinery would not permit it. So were

    back to a regular magazine format, which is more practical in every way.

    A bit of brilliance at Veer.com

    Have you ever bought an image online, only to discover that up close its not quite what you thought it was?films grainy, eye contacts wrong, whatever. Its especially exasperating when youve based a design on an image that looks great as a comp, but then fails at full resolution. Veer.coms new Image Zoom is the answer weve all needed. Just click and zoom to inspect an image

    at any level of detail before you order it. Veer has executed this little gem so beau-tifully that were certain it will soon be imitated everywhere. Check it out.

    Those invisible teens

    Writes reader Doug Reynolds: Im 47 and my client is about the same. The job is to design a logo and look that appeals to teenagers. I started research by asking my two teenage daughters and their friends what they like, then looked at what other compa-nies who market to this demographic are doing.

    I found that corporate design for teens typically comes from much older folks, and the teens are restricted to choosing what they like from looks cre-ated by non-teens.

    Question is, how does one design for an age group not visible in the design world? How do I find out what works for a group 30 years younger?

    Great issue. Readers, talk to us.

  • 2 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 3

    Lorem ipsum dolor sit amet, con sectetur adipscing elit, diam non numy eiusmod tempor inci dunt ut labore et dolore magna aliquam erat volupat. Ut enim ad minimim veniami quis nostrud exercitation ullamcorper suscipit laboris nisl ut aliquip ex ea commodo conse-quat. Duis autem vel eum irure dolor in reprehen derit in volupt ate velit esse moles taie son conse quat, vel illum dolore eu fugiat nul la pariatur. At vero eos et ac-cusam et justo odio dignissim qui blandit praesent lupatum delenit aigue duos dolor et mole stais exceptur sint occaecat cupi dat non prov i dent, simil tempor sunt

    in culpa qui officia deserunt mollit anim id est laborum et do lor fu-gai. Et harumd dereud faci lis est er expedit dis tinct. Name liber a tempor cum soluta nobis eligend optio comque nihil quod impedit anim id quod maxim pla ceat facer possim omnis es volu ptas assu-menda est, omnis do lor repellend. Temporem eutem quinsud et aur office debit aut tum rerum neces-sit atib saepe eveniet ut er repu-diand sint et molestia non este recusand. Itaque earud re rum hic tentury sapiente de lec tus au aut pre fer endis dolorib asper-iore repellat. Hanc ego cum tene sentniam, quid est cur verear ne ad eam non possing accommo-dare nost ros quos tu paulo ante cum memorite it tum etia ergat. Nos amice et nebevol, olestias ac cess potest fier ad augendas cum conscient to fac tor tum toen

    -dense

    , invitat igtur vera ratio

    tated fidem. Neque hominy in fant aut inuiste fact est cond que neg fac ile efficerd possit duo conteud notiner si effecerit, et opes vel fo-runag veling en libaral itat ma gis em conveniunt, dabut tutun bene vo lent sib conciliant et, al is adtis-sim est ad quiet. Endium caritat praesert cum omning null siy

    KENTUCKYMINESUMMERCONCERTSERIES

    Before&After Issue 33 www.bamagazine.com 3

    B&A interview

    A tale of two RepublicsHow can places that dont exist be so compelling? A conversation with Mel and Patricia Ziegler about the Banana Republic, The Republic of Tea, and how ideas take fl ight.By Hatsy Thompson

    18

    Page layout

    The news in 9x 6Why fuss with whole pages when you have only a little to say? Design this newsletter postcard instead! Tell your story in this surprisingly effective space. By Chuck Green

    14

    12PhotoshopA beautiful abstract in two clicks

    Issue33Before&After

    PHO

    TOD

    ISC.

    CO

    M

    Designclips

    John McWade

    The power of the logoWhy is a logo so hard to redesign? Because to the client, its full of hidden meaning.

    24

    ParkWorks, a logo as good as perfect

    A beautifully organized

    portfolio site

    Oh, our exasper-ating clients

    More!

    4Design in small spaces

    How to strengthen a small adFlat shapes and soft grays give a 2x 2 newspaper ad bold-ness and depth.

    8

    The color whirl!

    Cool a hot skylineTurquoise blues and verdant greens refresh a sweltering city scene.

    10

  • 4 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 5

    Letters from readers, ideas, techniques and items of general interestDesignclips

    Is this a perfect logo?Its close. ParkWorks is a non-profi t organization that raises money to add playgrounds to inner-city schools in and around downtown Cleveland. For its logo it called upon Epstein Design Partners, whose Anne Toomey came up with this beauty. Simple and full of life, her tree and its shadow are a brilliant juxtaposition of urban and nature. The image is instantly and deeply understandable. Cut-from-paper shapes convey childlikeness and playfulness, yet bear an air of sophistica-tionnot easy to do! More, they give the

    Similarity and repetition are key to good design. Note the tree trunk, building and windows are all trapezoids (okay, trapezoid-like). Note, too, the repetition of threesthree branches, three leafy bulges, three windows, and three major elements (leaves, trunk, building). Why three? The odd number, says Anne, keeps the image asymmetrical; with even numbers, things tend to start lining up. Similar quantities are also at work here (right)the tree is in halves (trunk, leaves), and the whole image is in halves (tree, earth).

    The emphasis subtle and exactly right, urban is expressed in shadow, while nature is in the light and the dominant position.

    epsteindesign.com

    image sharp edges that reproduce easily and well in all media, at all resolutions, exactly what you want in a logo. Frosting on the cake: It makes an excellent anima-tion; check out parkworks.org.

    LowerUPPERThe new faces of B&ABefore & Afters new text typefacethe one youre now readingis Utopia. An Adobe Original, Utopia was designed by Robert Slimbach in 1989 specifi cally for use in text. Its slightly square overall, evenly gray with excellent letterfi t; its easy to look at and undemanding to read. This is impor-tant. In choosing Utopia, we specifi cally sought a face that does not project much personality of its own, to not compete with the many designs that we show.

    Our new sans-serif face, used in head-lines and captions, is Vectora. Designed in 1991 for Linotype-Hell by Adrian Frutiger,

    Vectora is a slightly condensed, sharply defi ned typeface whose most distinctive attribute is its extreme x-heightlower-case letters that are nearly 85% the height of the uppercase. Result, uppercase letters fi t beautifully without adjustment in a line of lowercase, and line leadingthe space between linescan be so tight its a nega-tive value. In fact, the tighter its set, the better Vectora usually looks.

    Vectoras x-height is an incredible 85% of the cap height. Because of this, ALL CAPS in a line of lowercase type blend beautifully in, giving you another level of emphasis.

    UPPERUtopias short descenders and un-usually narrow overhangsnote the r belowcontribute to its excellent letterfi t; each letter tucks neatly against the next. Its squarishness can be seen in the bowl of the p, whose height is the same as its width.

  • 4 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 5

    Design axis

    Karen Barrancos online portfolio shows excellent visual organization

    The hard thing about a Web site is getting it organized for the viewerwhat happens where, and in what sequencein a way thats obvious and consistent. If what you need is a simple brochure online, take a cue from Karen Barrancos Special Modern Design, a portfolio site thats unusually well organized. Designed around the idea of a presentation stage with off-stage controls, it is so intuitively presented that its almost wordlesspractically the Holy Grail of design:

    specialmoderndesign.com

    A beautifully simple site

    Three permanent zones on a neutral background Everything on the site (like most sites) has one of three functions: presentation, navigation or contact information. Key in this case is that the functions do not mingle, overlap, or change position or appearance. Presentation happens in one window; navigation is handled off-stage. Note that the background is a neutral value, against which both white and black typethe highest possible differencestand distinctly apart. Note

    also the neutral (read: plain) typeface, set in all caps. The rectangular lines that form are like the pagean important similarity. The point of the plainness is to not upstage the presentation.

    As any salesman will tell you, keep your name in front of the customer, and make it easy for him to reach you. Advice beautifully followed, name, phone and e-mail access are always hereat whatever point in the presentation a con-tact decision is made, the viewer has instant access.

    (Almost) no-reading navigation Clicking a main menu item presents a graphi-cal submenu, where each selection adds deeper submenus, whose arrangement and smaller size intuitively convey their parent-child relationship. All selectable menus are yellow, a consistent identifier. Active, they turn dark, which recedes.

    Presentation window Everything happens here

    Main menuRuns the show

    Scrollable rsum and other text-based information use Flash technology to keep the screen scroll-bar-free. PDF link quietly appears only where appropriate.

  • 6 Before&After Issue 33 www.bamagazine.com

    devoid of illustration, a baffl ing charac-teristichow can one learn about color, or anything visual, without seeing it? As a result, the book is excellent in a classroom environment, but suitable otherwise only for the serious. Master it, however, and youll reap real dividends.

    Design editor Amos tells us that her preferred textbook supplement to Albers is Under-standing Color: An Introduction for Designers, 2nd Edition by Linda Holtzschue (John Wiley & Sons).

    I read your online article on lettering. It was great, but I was wondering what you would do if the letters were the same; for

    I know its not a design ques-tion, but I would like to have some comments and advice on the diffi cult part of our business: the meeting of different points of view and

    tastes, those of the client and those of the designerthe one who pays to get some-thing he likes, and the one who is paid to satisfy. That satisfaction sometimes involves doing things that you dont really like, junky but pleasing to a client and your wallet. I never really mentally and politically resolved that question. Im sure that your readers would be pleased to know your experienced point of view.

    Mario DesaulniersQubec, Canada

    Designclips

    Oh, our exasperating clients . . .Do you sometimes fi nd yourself tearing your hair out over a clients mystifying graphical directives? Like when for no apparent reason he asks you to make this picture bigger, or she wants that word red? Youre certainly not alone! But what do you do? Three reports from the front:

    RUBB

    ERBA

    LL.C

    OM

    Loved your articles, in particular Simplify in issue 32. I love simple. Its hard some-times for a client to buy simple, though. They want to fi ll the entire page. I guess they think theyre paying to have an entire page printed, so it should be covered! Ugh! How can you get clients to under-stand the need for a simplifi ed message? Maybe I should show them your article!

    Heidi Jones Clare, Michigan

    Many times I design what I believe in my heart and know in my mind to be solid design founded on the principles that Ive studied and the craft I am continuously honing. Yet the client butchers it.

    As the most simple and common

    DesignDesign

    Q

    It seems that B&A likes concepts on the layout side of things, like those from Grid Systems in Graphic Design by Josef Muller-Brockmann, which I love. Do you have any recommendations for any color theory books? Ive been using Albers, but havent found anything else that I like.

    Gregory Leppert, via e-mail

    Students of color wont improve on Albers, whose famous book, Inter-action of Color, has often been called the bible of color interaction. For the layman, however, color theory comes

    with caveats. The subject is deep, technical and often obtuse. Albers book and others like it are full of good doctrine but nearly

    wont improve on Albers, whose famous book, action of Coloroften been called the bible of color interaction. For the layman, however, color theory comes

    with caveats. The subject is deep, technical

    preferred textbook supplement to Albers is standing Color: An Introduction for Designers,Edition by Linda Holtzschue (John Wiley & Sons).

    example, M & MIm just thinking of a business name of M & M Design Center and wondered if you thought that it was workable graphically.

    Bonnie Marinaccio, via the Web

    Have you ever had a totally original idea in the middle of the night that in the light of day turned out to be some-

    thing youd already seen? Bonnie, its cer-tainly workable graphically, but before you start designing, you should check out the availability of that name youre consider-ing. Our guess is that its not a good idea.

    Last year I lost fi ve newsletterstwo monthly, three bi-monthly; over $10,000, a fourth of my annual income! The

  • exam ple of what I mean, Ill take a proof to a client for approval. Inevitably, copy that I set left-justifi ed for a reason comes back marked please center typewhich throws everything out of whack!

    Whats the best way to tell a client hes wrong and Im right without seeming dif-fi cult or being arrested?

    T. J. VanderstoopWhitby, Ontario, Canada

    Mario refers to the diffi cult part of our business. This is often where our relationships with our clients bog down. Why is this? Why is it so hard

    to communicate with clients? Why cant we get them to do what we want them to?

    To make life easier, give the client what he wants. Does this mean change a design whenever the client says change it? No, not at all. Heres what it means.

    Give the client what he wants by fi nding out upfront the intent of the job, writing it down, and agreeing with the client to that intent. Then do the design work. When the time comes to review drafts of your designs, make the review in the context of whether they achieve the intent. The dis-cussion should not be about whether the text should be left or right justifi ed, or what color a line is. The discussion has to fi rst take place at a higher level. Did we accom-plish what we set out to accomplish? Does this design achieve its goals? Is it clear and easy to understand? Measure the work against a clear set of predetermined objec-

    tives. Take the conversation away from the details and move it to what it does, not what it is.

    That said, even with an agreed intent you still have to give the client the chance to express his opinion about the design. However, you now have a context to dis-cuss possible changes. Will making this or that change better help us to achieve our objective? After making another version of the design, you can compare the two, using the intent as the criteria for choosing.

    The key to all this is the creative brief. It is the document that should always be developed with the client that he signs off on before the creative work begins. With-out it, projects are much harder than they need to be. With it, and with a commit-ment to using it, life gets easier.

    AP

    O B

    OX

    66

    7N

    EW

    YO

    RK

    NY

    10

    01

    2U

    .S.A

    .

    EL

    IK

    A

    BEFORE & AFTER MAGAZINE2007 OPPORTUNITY DRIVE #10ROSEVILLE, CA 95678

    No project too smallTalk about limited! Heres the assign-ment: Design a 4 x 2 mailing label using one typeface, uppercase only, black on white, no art. The exercise in minimalism that you see here arrived in our offi ce via New Yorks Museum of Modern Art. It would be hard to get E L I K A

    TYPE

    FAC

    E: H

    ELVE

    TIC

    A N

    EUE

    LIG

    HTrea son? One of our staff members just

    bought a Mac for his teenager at home, so his kid can do it for free.

    So, one no longer needs training or ex perience, just a Mac! And ptui on my 30 years of experience, eh?

    Sally Rae UphamGeneva, IL

    Ouch! A loss of workespecially if unex-pectedcan be a very diffi cult blow.

    The fact that you lost these jobs to a teenagerwho cant have any experience at allseems to say one of the following:

    1) Your colleague is blind2) The newsletters werent important3) Your expertise wasnt showingSounds like its time to show off your

    stuff by seeking projects more in line with your experience. Get out from under that ceiling! Itll be more rewarding creatively, and youll probably be paid better, too.

    simpler, yet the result looks designed, not just placed. Note how the extra letterspacing alone gives ELIKA its high-tech character.

    Before&After Issue 33 www.bamagazine.com 7

  • 8 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 9

    KENTUCKYMINESUMMERCONCERTSERIES

    TINTS: K100, K60, K40, K20

    KENTUCKYMINESUMMERCONCERTSERIES

    TINTS: K60, K40, K20, WHITE

    How to strengthen a small adFlat shapes and soft grays give a 2 x 2 ad boldness and depth

    Set above the sparkling North Yuba Riv-er in the rugged backwoods of Califor-nias Sierra Nevada, the Kentucky Mine Summer Concert Serieswhose name-sake reaches back to the Gold Rushis low-budget entertainment under the stars. Volunteer townspeople pitch in to take tickets, staff concessions, pres-ent door prizes. Advertising this event is equally on the cheapa 2 x 2 spot all summer in the local weekly, which itself is something of a Gold Rush relic: printed with black ink that could be mistaken for tar, on cheap stock, with half the ads pasted up by hand the way Abraham Lincoln did it.

    Problem is, small ads tend to get equally small effort from the paper, often being tossed together, sometimes in minutes, by an inexperienced staffer more interested in lunch.

    But a small, simple ad can be done well in a short time. The goal is an ad that looks good, prints well, stands out on the page, andespecially impor-tantdraws interest. The key words are keep it simple and be bold. Have a look.

    Its the right idea Theres plenty of fi ddling at these concerts, all right, and the typefaceCaslon Antiqueconveys the splintery, earthy character of the Kentucky Mine, but the cen-tered composition is static, and the raggedy detail is too small to make an impact.

    Bold means simple First step is to simplify every-thing, which means eliminate detail. We encounter detail in the photo and in the fi ne, small typefaces. This violin has an excellent, descriptive silhouette, so in Photoshop well replace its grays with solid black. (Open the image, clear the background, lock the pix-els, and fi ll with black.)

    Headline forward Three closely spaced grays20%, 40%, 60%soften the ad and recede together, so the headline in black stands forward. Visual weight is in the center. Whats evident now is how even the spatial volumes are. Note, left, that SUM-MER CONCERT SERIES fi ts the spaces below and be-side it almost exactly.

    Midrange, light Whats fun with gray is how easy it is to manipulate emphasis. Here, white headline and dark violin share the stagea midrange background (above, 40%) allows both white and black elements to stand apart equally. Headline makes it obvious that white, normally regarded as a passive backdrop, is actually a color like any other. Dont forget.

    SUM

    MER

    CON

    CERT

    SERIE

    S

    KENTUCKYMINESUMMERCONCERTSERIESSUMMERCONCERTSERIES

    Design in small spaces

  • 8 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 9

    KENTUCKYMINESUMMERCONCERTSERIES

    TINTS: K80, K60, K40, WHITE

    KENTUCKYMINESUMMERCONCERTSUMMERCONCERTSUMMERSERIES

    KENTUCKY

    SERIES

    TINTS: BLACK, K60, K40, WHITE

    KENTUCKYMINESUMMERCONCERTSERIES

    Black Black has power; the more black, the more power. This little ad will get noticed. When black is the primary background, however, use white judiciously. Here, the white violin has made edge a limiting factor; the extreme contrast overpowers the small gray type atop it. A solution is to gray the violin, or put the type elsewhere.

    KENTUCKYMINESUMMERCONCERTSUMMERCONCERTSUMMERSERIES

    KENTUCKY

    SERIES

    TINTS: K100, K60, K20, WHITE

    KENTUCKYKENTUCKY

    Note the overlap. This is a small point of interest but also tension; the two shades must always be different.

    Bold means heavy The raggedness of the original type was the right idea, but the font is too light, too full of white, and like the violin appears to fl oat. Above, the superheavy typefaceBlock Heavy Tset in all caps and tightly compressed squeezes the white out. Park it in the top left corner; note how it fi lls the corner and radiates into the space. Action.

    Bold means big Uncropped in the original and small enough to fi t the space, the violin seems to fl oat mid-air, weakly. Get major. Scale it up much too large for the space, anchor it to the bottom and push it right. The eye must now move into the violin, while the descriptive neck sends the eye skyward. Result: We have some visual action in this space.

    Bold means dense Above left, type set normally has extra leading, which is correct for text, but as a headline its too airy. Without ascenders or descend-ers, all caps can be set with negative leading; the block below is 25/17.5.

    Now add depth In solid black, every object sits on the surface conveying the same level of information. But there are four distinct thoughts here: the mine, the series, the violin and the page. By adding only two values of gray20% and 60%we separate all four by depth, violin in front, page in back; Kentucky Mine in dark gray gets major billing.

    KENTUCKYMINE

    KENTUCKYMINE

    Normal leading Negative leading

    Midrange, dark As the fi eld darkens beyond 50% (above, 60%), the adat least this onetakes on a sense of nighttime, mood, even sensuality. Its here that white begins to come forward and black recede, opposite the original effect. The thing to remember is edge. The less contrast between edges, the quieter and less demanding the image.

    7 p.m. EVERY FRIDAY JULY 11 THROUGH AUGUST 29KENTUCKY MINE AMPHITHEATER

    7 p.m. EVERY FRIDAY JULY 11 THROUGH AUGUST 29KENTUCKY MINE AMPHITHEATER

    Keep in mind that any given gray looks lighter against black than against white; adjust accord-ingly. The Ns above are both 50% gray. (Cover each side and compare.)

    N N

  • 10 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 11

    How to cool a hot

    skyline

    Whew! You can almost feel the heat. Reds, oranges, yellows and golds radiate from every molecule; even the water is hot. San Diego, a famously balmy city, never looked like this in real life. But the assignment is to create a brochure coverone a conven-tion bureau would like, or for any event in which the city itself is part of the attrac-tionand this dramatic, golden skyline is the photo we have. So the challenge is, how do we cool it off so visitors wont come expecting to swelter? The answer is found on the color wheel between ice blue and yellow, in the turquoise blues and verdant greens of springtime. Watch.

    Find the palette in your photo Every photo has a natural color palette; fi rst step is to fi nd it and organize it. First reduce the photo to a manageable number of colors; easiest way is to create a mosaic using Illustrators Object Mosaic func-tion (Filter>Object Mosaic). Work-ing from the biggest areas (sky, skyline, water) to the small-est, extract colors with the eye dropper tool. For contrast, pick up dark, medium and light pixels of each color. Sort your selections by color and each color by value. Its obvious just by looking that this palette is very narrow.

    Position your selections on the color wheel. (Hues are the middle ring; shades outer, tints inner.) All the colors in this image are in the yel-low-orange, orange-red range, quite unusual. The sky is somewhat yel-lower, some shades are darker than our chart, but this is the zone.

    Sky

    Skyline dark

    Skyline light

    Water

    The color whirl!

    10 Before&After Issue 33 www.bamagazine.com

  • 10 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 11

    Cool Coolest, prettiest and most refreshing is a mix of blues and greens; the greens share yellows with

    the photo, while the blues provide the ice. The colors shown here have simi-lar value, soothing low contrast.

    Coldest Mono-chromatic bluenote the dark, medium and lightis very cold and has the highest con-

    trast. Blue and orange are opposites; they have nothing in common. High contrast means high energy.

    San DiegoSan Diego San Diego San Diego

    HotCold

    Cool Warm

    San DiegoSan Diego San DiegoSan Diego

    Color is made darker or light-er by adding black (a shade) or white (a tint). Black and white, being color neutral, do not change the color . . .

    but only the value. As a result, any one color plus its own tints and shades always coor-dinate naturally. Such a palette is called monochromatic.

    As with a single color, all the hues that share a color (blue in this case) coordinate natu-rally. Any color in this range will work with any other.

    The opposite, or complement, of the warm oranges is blue, the coldest color.

    Adding yellow to blue yields the cool rangethe colors of water, new growth, spring-time. These are peaceful col-ors, tranquil and refreshing.

    Warmest Because of its proximity to yellow, monochro-matic yellow-green has the most color in common with

    the photo and yields the warmest image; it doesnt really cool the skyline very much.

    Moving toward yellow warms the image slightly; the dark blue-green corner adds con-trast. Now that you

    have the idea, youre on your own; working in just this narrow range youll find many interesting variations:

    Low-contrast tints are soft and unde-manding. A baby products convention.

    High-contrast corner highlights the checkerboard; light colors recede.

    Vivid green freshens like damp grass, dark corner is a visual anchor.

    Light yellow-green downplays the name, drawing attention to the city.

    Now widen the range . . .

    The color wheel is an artificial device, good but not perfectcolors in nature arent so evenly distributed, whose purpose is to show color relationships. Also visible are values (dark-light) and temperature.

  • 12 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 13

    In the old days, posters were made by hand and generally silkscreened onto paper or board. To do this efficiently meant that an image could have only a few flat colors, not the unlimited gradients of a photograph. This limitation resulted in a lot of innova-tive artworkbold images that were often stylized or abstract, and visually arresting. Photoshops Posterize feature is designed

    to mimic the flat colors of the silkscreened poster. It does this by reducing a photographs many gradients to just a few. The key to an excellent result, however, is to first apply a Gauss-ian Blur, then Posterize the blurred image. Like this:

    Photoshop 7.0

    Select . . . Gaussian Blur . . . Posterizethe entire image about this much 4 levels (Filter>Blur>Gaussian Blur) (Image>Adjustments>Posterize)

    A beautiful abstract in two clicksA photo can be too real. Photoshops Posterize feature can create . . .

    Left, any image blurred sufficiently and then posterized makes a totally ab-stract background in-stantly. The blurrier, the more abstract.

    Change colors Once posterized, color shapes are flat and therefore easily changed. Set your Magic Wand to zero tol-erance, select any area, and refill it with new color (below).

    Select . . . Gaussian Blur . . . Posterize

    Erase imperfections Good photos sometimes have bad spots. Here, high-contrast stripes are ideal for posterizing, but the cables are unsightly. Poster-ized, they simply disappear.

    Make modern art

  • 12 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 13

    TYPEFACE: TRIXIE PLAIN

    Add colorEyedropper directly from the poster for perfectly coordinated colors. Here, analogous colors (side by side on the color wheel) make very little contrast with the glass, so feel soft and mellow, and leave the high-con-trast cherry as the accent point.

    Whip up a refreshing invitation

    Select . . . Gaussian Blur . . . Posterize 4 levels

    You saw this photo last issue at work on a business card. But one image can live many lives; look how easily it can be disguised as a handsome invitation for your next backyard barbeque.

    Join us Friday at

    8 to celebrate our new patio!

    Its summer!

    How many levels? Posterize in very few levels, usually only three or four. What you want is difference; a dozen levels (above) defeats the illusion.

    Select . . . Gaussian Blur . . . Posterize 3 levels

    Set a moodPhotoshop can see things we cant, which makes every outcome a surprise. Reduced to three steps (above), the barely-there gradient of the original sky acquired a single sharp edge that feels deliberately artistic. Deep indigos and violets set a compelling night mood.

  • 14 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 15

    Page layout

    THE NEWS IN 9x6

    It looks like a newsletter and works like a newsletter, but its all on a postcard!

    Send newsletter signals A postcard newsletter presents information that read-ers typically see in another formmultiple 8.5 x 11 pages. This layout sends the same signals by using a conventional nameplate with the publication date and volume/issue information. A news letter, even one published by a business, is ideally a forum of ideas. In other words, to be most effective it should be equally as interesting to someone who doesnt buy your prod-uct or service as it is to someone who does. Save the hard selling for your brochure, and write your copy in news formwho, what, where, when, and why.

    Follow mailing regulations Before you print anything that you intend to mail, show your layout and a sample of the paper you plan to print it on to a mailing expert. To fi nd a United

    States Postal Service Mailpiece Design Analyst in your area, visit http://pe.usps.gov and select Mailpiece Design. They can provide advice and issue rulings re-garding acceptability of a particular piece for USPS au-tomated postal rates, which are generally signifi cantly less expensive than fi rst-class rates. Plus, they can help you interpret regulations, test the appropriateness of paper, even review your artwork. Knowing the rules can save you lots of time and money.

    By Chuck Green The benefi ts of a newslet-ter are legion. A newsletter keeps you in touch with your audience on a regular ba-sis, it provides a venue for promoting your products and services, and its a way to voice your ideas. But its challenges are sub-stantial, too. Writing, designing, preparing, and printing an eight- or sixteen-page a newsletter is no small task.

    From challenges spring solutions! Pre-senting the news in 9 x 6the postcard newsletter. At a fraction of the cost in sweat and equity, this small format offers nearly every benefi t of a normal newsletter, and many advantages. Less space means less writing and faster production. The con-densed size means substantial savings in printing and mailing. Especially valuable, it requires less of your audience; it arrives open and ready to read, and your story is seen and heard in condensed forma signifi cant advantage for those with only a passing interest in your subject matter. Heres how to make one.

    B&A RECOMMENDS A longtime contributor to Before & After, Chuck Green is a master of the creative small project. He is the host of ideabook.com, and the author of several useful design books, including Design it Yourself Newsletters ($25, Rockport Publishers, ISBN 1-56496-767-0), in which this article originated.

  • 14 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 15Before&After Issue 33 www.bamagazine.com 15

    Side 1

    Side 2

    Background fi rst The nameplate is the visual heart of this newsletter. Where do you get such a wide, skinny image? Easiest is to crop a sliver from a larger image. Look for the most expressive part; youll be surprised at how easy such extreme cropping often is. If your image isnt quite right, below are several alternate techniques:

    Create the illusion of continuity First make a wide panel, fi ll it with color eyedroppered from the image, then blend the image into the panel. (In Photo-shop, use the gradient mask or feathering tool.) Crop.

    Design a w-i-d-e nameplate

    Then the words . . .

    The newsletter name is a stack of three or more words. First step is to rank your words in order of importance.

    Set the keyword in caps and lowercase, the rest in all caps. The uniformi-ty of the caps makes the words neater to stack.

    Create contrast. Set the keyword in fancy script, the support words in plainer faces (complex vs. simple).

    Rank the words by using size, spacing and color. Increase letterspacing in small words; tighten it in big words.

    Stack the words, then adjust the size of each to a single width. One column wide is typical.

    Fine-tune the empha-sis with color. Above, top, white FUND is too prominent; bottom is a more even balance.

    Use text as graphics Set colored text in layers (there are three here) and adjust the opacity of each layer. Crop.

    Make a collage Combine many images artfully! Here, each coin and bill was scanned separately, then arranged. Crop.

    TYPEFACES FUND: COPPERPLATE 33BC | SKYSAIL: BICKHAM | TEXT: MINION | adobe.com | ILLUSTRATIONS SKYSAIL NAMEPLATE COLLAGE STEVE RAWLINGS, ALL RIGHTS RESERVED, AND CURRENCY COLLAGE (BACK, BOTTOM) MATTHEW COOPER, ALL RIGHTS RESERVED: ENCORE IMAGES, LTD., +44 (0) 1372 220 390 | en-core.net | SUPREME COURT: DESTINATIONS: WASHINGTON, D.C., DIGITAL STOCK/CORBIS | corbisimages.com

  • 16 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 17

    What a horizontal nameplate has in drama, a vertical name-plate has in practicality; you can fi t in the name plus lots of stuff. Below the name is a defi ning phrasea fi ve- to fi fteen-word statement that describes the scope of the newsletterand below that, a mission statement. To the right is the date, volume and issue numbers, and the publishers name just above the lead article. Four text columns on a nine-inch postcard are perfect. One type family* (Roman, italic and bold) is plenty.

    *MYRIAD | adobe.com

    16 Before&After Issue 33 www.bamagazine.com

    Use artwork to establish a style Use a collection of images illustrated in a similar style and color palette, and after a few issues your reader will begin to recognize your newsletter on sight. The key is to fi nd a collec-tion with depthenough images that speak to your subject. Look for images that help you tell your story. For exam-ple, instead of a piano to illustrate a story about a hot pianist, try using a piano thats on fi re. Be imaginative!

    Playful typestyle* con-trasts with plain block caps. Note size contrast.*SPACE TOASTER | chank.com

    Darker green bar sets off top from middle; RICHMOND in white now really stands apart.

    Duplicate PLAY! to make a shadow for depth. (Or, in InDesign, just click Drop Shadow.)

    Redgreens vivid complement (opposite)completes the contrasts.

    Create a playful version of the word stackRemember, create visual interest with contrasts. Here you can see contrast-ing typestyles, sizes, case, spacing, value, color, shadow depth and back-ground. Thats a lot!

    Borrow some background colors What color should things be? The best place to get beautifully coordinated color is to eyedropper it from the picture.

    Design a vertical nameplate

    Graphical sidebar is the focal point of side two (below). The cartoony rectangle mimics the nameplate in style and color, maintaining artistic continuity. This is a vital design element that keeps the postcard lively and engaging. The sidebar can be a tiny, stand-alone article, or it can be a caption or quotation from the main article. Note the contrasting white initial cap.

  • 16 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 17Before&After Issue 33 www.bamagazine.com 17

    Create a theme

    Stretch the idea!

    Combine artistic styles A fl at antique engraving contrasts beautifully with a 3D photo sitting right on the page.TYPEFACES GILBERT: COPPERPLATE 33BC | LAND SCAPERS: BICKHAM | ILLUSTRATIONS LANDSCAPE: PICTURESQUE LANDSCAPE ENGRAVINGS | visuallanguage.com | CAN: CMCD EVERYDAY OBJECTS 2 | photodisc.com

    Make a series Small images side by sidehere, client photos mixed with royalty-freemake a gorgeous nameplate.TYPEFACES NEW: COPPERPLATE 33BC | NEIGHBORS: BICKHAM | ILLUSTRATIONS HOUSE INTERIORS and EXTERIORS: COURTESY OF J.R. WALKER and COMPANY | whywalker.com | CLOSEUPS: HOME COMFORTS | photodisc.com

    Stretch a scene Good photo but too short? Fade smoothly into a back-ground. Bonus: More space above the name to write.TYPEFACE: COPPERPLATE 33BC | ILLUSTRATION: CORPORATE MOTION CD | rubberball.com

    Focus on a point No need to touch the top or even be rectangular! Here, ordinary clip art (right) becomes a through-the-mist focal point.TYPEFACES FANTASY: COPPERPLATE 33BC | TRAVELER: BICKHAM | ILLUSTRATION: TASK FORCE IMAGE GALLERY | nvtech.com

    TYPEFACES HEADLINE: RALEIGH GOTHIC | agfamonotype.com | TEXT: ITC GARAMOND LIGHT COND | itcfonts.com | ILLUSTRATION HOME COMFORTS | photodisc.com

    TYPEFACES HEADLINE: DOGMA BLACK | emigre.com | TEXT: ITC FRANKLIN GOTHIC BOOK COND| itcfonts.com | ILLUSTRATION TASK FORCE IMAGE GALLERY | nvtech.com

    TYPEFACES HEADLINE: RACER | adobe.com | TEXT: MINION COND| adobe.com | ILLUSTRATION ANTIQUE BOTANICAL ILLUSTRATIONS VOL VII | visuallanguage.com

    TYPEFACES HEADLINE: INTERSTATE ULTRA | fontbureau.com | TEXT: NEW CENTURY SCHOOLBOOK | adobe.com | ILLUSTRATION CORPORATE MOTION | rubberball.com

    The best looking and most memorable news-letters are those that have a visual themea repeating combination of illustration style, typestyle and color. Be disciplined about this; once youve established a look, dont deviate for the sake of novelty. Ideas:

    C15M10Y10

    K0

    C0M0Y0

    K100

    C0M80Y90

    K0

    C80M40Y70K30

    C90M50Y20

    K5

    C20M90Y90K10

    C50M60

    Y0K0

    C75M50

    Y0K0

    C5M60Y90

    K0

    C95M15Y30

    K5

    C25M25Y20

    K5

    C5M10Y15

    K0

    The beauty of the postcard newsletter is that most of its visu-al impact is in the nameplate, a design-it-once space that makes a recurring impression. Its a challenging and interesting space to design, and it can be confi gured in endless ways. Idea starters:

  • 18 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 19

    Interview

    By Hatsy Thompson Sometime in 1978, a very unusual catalog began to appear in mailboxes across the country. From the Banana Republic Travel & Safari Clothing Company, its sophisticated, eclectic design married hand-drawn illustrations with whimsical descriptions of functional yet stylish safari- inspired clothing. Real and would-be adventurers happily par took of the imaginary world it evoked. Ten years later, the catalog was grossing a quarter billion dollars in annual sales.

    Banana Republics creators, Mel and Patricia Ziegler, met at a Xerox machine at the San Francisco Chronicle, where he was

    a writer-turned-reporter and she a painter-turned-courtroom artist. The

    story, possibly somewhat apocry-phal, is that the couple sat down one weekend, she with sketchpad and he with pen, and conjured up what trade magazine Catalog Age

    called the best catalog concept ever. Retail stores followed,

    with life-sized giraffes,

    A Tale of Two

    Republics

    Excellent design conveys care, craftsmanship, professionalism. It is beautiful to see and fun to do. But the best designdesign that moves hearts and minds and mountainshas something more. It expresses a concept, a great underlying vision. Vision is what gives purpose to design. In fact, its fair to say that without a vision, design is only surface manipulation. Mel and Patricia Ziegler, the subjects of B&As fi rst interview, are all about visionthe art of seeing and thinking and imagining worlds that do not yet exist, and that will need design to bring them to life. Listen in.

    ILLUSTRATION BY H. CRAIG HANNAH

  • 18 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 19

    thatch-roofed huts, bush planes hanging from ceilings, and jungle jeeps frozen mid-hurtle in display windows. The couple sold their flour-ishing republic to The Gap in 1983 and presided over it for another five years.

    Their next venture, The Republic of Tea, was founded in 1991 to show, through the metaphor of tea, the lightness of taking life sip by sip. Once again, they used a catalog to conjure an imaginary world. Blending Mels words with Patricias illustrations, they infused all aspects of the business with tea-related themes: the company was composed of ministries (Mel was Minister of Leaves and Patricia Minister of Enchantment), customers were Dear Fellow People of Tea, and labels featured a mysterious teapot floating among tea-leaf clouds, mango mountains, persimmon wildflowers, and cottages made of vanilla beans and almonds. The Zieglers sold their second republic in 1994. |

    A Tale of Two

    Republics

    Designing to a vision The Manhattan store, circa 1985. Colors, fabrics and natural materials of every kind sustained the off-on-safari fantasy in every nook and cranny of the business.

    BOB KRIST

    Tea mindHow do you design a feeling? Pat found that with enhanced collageXerox machine and watercolorshe could juxtapose textures and colors to evoke fla-vors, sensations, a sense of place.

    Before&After Issue 33 www.bamagazine.com 19

    Catalog that built an empire, here a classic Banana Republic cover mimics a find-the-animals-hidden-in-the-picture childs puzzle. Meticulously made painting of an imaginary expatriate watering hole uses witty, improb-able juxtapositions to gainand sustainour attention. Look at Mark Twain and poet W. H. Auden reading each others works. See F. Scott Fitzgerald gaze into dancer Isadora Duncans eyes. Watch Ernest Hemingway challenge zebra Livingstone (a clothing store with a mascot!) in chess. Even the cap-tions language contributes whimsy: number 18 is le garon, un vrai Parisien (the waiter, a true Parisian); the cover artist painted for his supper.

    Notice how carefully composed this painting is: For example, follow the river of patterns created by

    dancer Nijinksys har-lequin diamonds, the zebras stripes, the chessboards squares, Picassos shirt stripes, and the zebra sketch in the lower left cor-ner. What else can you find?

    Typical catalog page features no fewer than seven fontswithout yielding typo-graphic Babel. Each font serves a specific function: two contrasting decorative fonts in mauve comprise the page headline; an old-fashioned typewriter font identifies the product; mauve italics convey historical and technical tidbits about fabrics; various sizes and weights of a Roman serif font, in black, describe product features; a stencil font provides the phone number; and call-outs are handwritten. Used consistently throughout the catalog, these font and col-or conventions enable readers to find their way within its densely filled pages.

    Also note the juxtaposition of illustra-tion stylesthe hand-drawn dresses, the engraving of the Indian woman, and the flat-patterned page border that echoes the sari border. Clever copy sustains the travel-ling expatriate dream.

  • 20 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 21

    conceptual, visual, contextualand then design from that central impulse.

    P | There are a few fi rst elements that characterize the energy of a new idea. In Banana Republic it was adventure, surplus, tropical, humor. These qualities seemed to evoke palm leaves, old fashioned typeface, yellowed colors. In The Republic of Tea, it was tea mind, refi ned taste, philosophi-cal leanings. These qualities suggested tall, elegant containers, dream-like images. You look into every nook and cranny in the business. You dont leave any empty places. Everything is designed to fi t.

    Why was the design you did for the early Banana Republic so compelling?

    M | It was genuine.

    P | Genuineness communicates stronger than the most refi ned design.

    M | We didnt have any money when we started Banana Republic, so we just did whatever we could do and liked to do. We played Cole Porter albums in the stores. We drew zebras and palm trees together. We sold khaki and safari clothes because we wanted to. We published a catalog because I knew how to write and Patricia knew how to draw. We drew on what we knew and put it all together.

    Then it became its own entity. Our original idea was a safari clothing com-pany. But most people werent taking safaris, they used the clothes to travel. And we wanted to become more accessible and less esoteric, so we started to imagine the travel metaphor. Then we had a travel

    Handcrafted pages belied sophisticated compo sition. Note the safari scene behind the products above; this is the establishing shota fi lmmaking techniquethat gives the reader a sense of place. (Cover the scene with your hand and see the difference.) Designed-in humor was also a powerful element; left, an invisible man yawns in his nightshirt. Invisible models were a common theme in the Banana Republichow easy they made it to envision yourself in the garment!

    WM | We begin with a need. Somethings missing, and it becomes obvious to us. Or we begin to notice something we hadnt really noticed before. But I dont think a business truly comes into being until you have a name for it. If you cant say it in a phrase or a word, its still fuzzy. Everything funnels through a name.

    How does the design for a new business take shape in your minds?

    M | We dont work from visuals, we work from a concept. The concept becomes the umbrella, and everything fi ts inside it. We bring all the disparate elements together

    The Banana Republic sold products by the trainload because it fi rst sold a daydream; that was its key. Every idea, every word, every picture, every page, every effort contributed to the dream. Above, Mels Journal takes us on an imaginery trip along the Inca Trail to exotic Machu Picchu.

    Handcrafted pages belied sophisticated compo sition. Note the safari scene behind the products above; this is the establishing shota fi lmmaking techniquethat gives the reader a sense of place. (Cover the scene with your hand and see the difference.) Designed-in humor was also a powerful element; left, an invisible man yawns in his nightshirt. Invisible models were a common theme in the Banana Republichow easy they made it to envision

    conceptual, visual, contextualand then design from that central impulse.WWhen you conceive a new WWhen you conceive a new Wbusiness, where do you start?Wbusiness, where do you start?W

  • 20 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 21

    The more you relax, the more it comes into focus.

    P | You cant separate design and business.

    M | Its been the seamless integration of the concept and the design and the product thats made anything weve done successful.

    Youve said that good design just goes away and leaves a feeling. What do you mean?

    P | Good design doesnt fl oat on top. When the concept and the design arent married at the bonewhere some body has an idea for a product and then you hire an outside designerthey fl oat as two separate things.

    M | Good design works together, all of its pieces. And its not just the design: theres the concept, the way it fi ts, the way its marketed, merchandisedit all has to fi t together.

    Youve used the word soulful to character-ize good design. When is design soulless?

    P | When it second-guesses the audience.

    M | In our culture, the producer is separated by such a vast chasm from the consumer that the process has become charmless. Somebodys sitting up there thinking, You know, what we need this month . . .

    Weve never used a focus groupI fi nd it an unbearable experience! So many people give up their intuition and then borrow it back. All we know how to do is love what we love and then have fun putting it out there.

    You seem to view ideas as pre-existing entities that youre able to detect and make tangible.

    P | Yes. Ive always seen our businesses as things you could walk around and see but were ethereal until they were made material.

    M | What most people tend to see are the solid piecesthe yous and the mes and the desks and the stores. But theres all this en-ergy going in all different directions between all kinds of objects.

    bookstore. We started a magazine. If you called our catalog center and were on hold, there would be tapes teaching you differ-ent languages. It became playful. People understood that the whole thing was about playing and having fun and being whimsi-cal and enjoying yourself and not taking yourself too seriously.

    When you began to sketch The Republic of Tea, what did you intend?

    P | I wanted to evoke the feeling of tea mind and then bring out the specifi c character of each tea. I was searching for a way to create an evocative world that didnt really exist. The medium I settled on was enhanced collage using a Xerox machine and watercolor. Juxtaposing different tex-tures evoked the subtlety of fl avors, a world

    of tastesclouds made out of grapes or chrysanthemums and bird feathers used to create mountainsides.

    Design played a key role in the success of your businesses. How do you understand design, and why is it so important?

    P | Design is communication. Design com-municates the feeling, the taste, the mes-sage, the spirit of a product. Its the web that holds everything together.

    M | Design is a language that people knowalthough they dont know they know it until they start speaking it.

    P | Design is letting down fi lters, just re-ceiving as objectively as possible and let-ting the vision come into focus on its own.

    Letting down fi ltersWith tea-leaf clouds, mango sunsets and water made of blue sky, a page from Patricias sketchbook (right) illustrates what she means by letting down fi lters and letting the vision come into focus on its own. These early sketches defi ned The Republic of Tea look, and expanded into the line that you see in stores today.

    WO

    RLD

    BO

    OK

    So many people give up their intuition and then borrow it back. All we know how to do is love what we love and then have fun putting it out there.

  • 22 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 23

    P | And if we pick up pieces of color and texture and start applying them, a business becomes a sculpture that anyone can see and even add pieces to. Then it becomes visible enough that others can see it and add more of what it needs.

    M | Weve created businesses as imaginary places, almost as art pieces, almost like a movie or a play. The Republic of Tea was a whole world where tea drinking, tea grow-ing, tea culture was paramount. We defi ned a whole culture: although it was vaguely Asian, it wasnt Asia, just as Banana Repub-lic was suggestively South American or tropical or African. And then the imagined becomes real. There is now such a place as The Republic of Tea!

    You also seen quite attuned to what peo-ple will want next.

    M | I like the metaphor of bird mind. Sometimes you look at a fl ock of birds, and all of a sudden every one of those birds takes a right-hand turn. How do they all know theyre supposed to turn right? Theres something larger: the fl ock itself is a living organism.

    P | You can see this in trends. Keds have been around for fi fty years, and all of a sudden you notice one kids wearing them and then another, and then all of a sudden theyre out in every color and everybody wants them.

    How do you help yourselves generate new ideas?

    M | Were wild brainstormers. There are no rules, just wide open space. You cant be too stupid. You have to just take it all in.

    P | Infl uences come from everywhere: from art or architecture or the newspaper, walk-ing down the street, the old drugstore on the corner. You could get a visual idea from a symphony or a concept from a smell.

    M | You have to be porous.

    P | Whenever we start something, I notice my latest attractions. Why do I fi nd Keds interesting all of a sudden, when theyve been there forever? Or a Mexican

    Feathers

    Fabric

    Leather

    Professional layout even in sketchbooksnote (above left) models toes beyond the page border and penline frame around her left sandal. Also, physical fabric samples, not just drawings, were key to envisioning the fi nished goods.

    Logos for imaginary affi liates (left) were designed as carefully as if they were real. Note the metamorphosis as they traveled from sketchbook to cata-log page above. Toll-free phone number was part of the look, and everywhere.

    Infl uences, says Pat, come from everywhere: from art or architecture or the newspaper, walking down the street, the old drugstore on the corner. You could get a visual idea from a symphony or a concept from a smell.

  • 22 Before&After Issue 33 www.bamagazine.com Before&After Issue 33 www.bamagazine.com 23

    Mel: I like the metaphor of Bird mind. Sometimes you look at a fl ock of birds, and all of a sudden every one of those birds takes a right-hand turn. How do they all know theyre sup-posed to turn right? Theres something larger: the fl ock itself is a living organ-ism. Pat: You can see this in trends. Keds have been around for 50 years, and all of a sudden you notice one kids wearing them and then another, and then all of a sudden theyre out in every color and every-body wants them.

    muralist? Just by having something in the making, I start noticing what Im attracted to. I take all the things that are drawing my visual attention and put them next to each other. The pattern they make becomes one of the design answers.

    M | And you need to do this in a collabora-tive setting. One of the exercises I often do with any company Im involved withIll sit at a table with a bunch of people and Ill put a teacup in the middle of the table, and Ill say, Thats The Republic of Tea. What does it want? Then everybody can be part of the creative process. We can all mute our individual egos and listen to the greater pulse of the combined and shared experience.

    What advice about design would you give someone starting a new business or re-working an existing brand?

    P | See yourself as the audience. Find the part of you that relates to the audience for a product. And then open every sense. Is this reaching you? Is this letting you feel and hear and know or taste the product? Design is about trying to communicate the essencenot just the product, but all the values of the company, all the ideas everything. | B&A

    The Zieglers live in sunny California. Writer Hatsy Thompson lives outside Boston, a Colonial-era settlement known for having a tea mind of its own.

    From sketchbook to catalogPatricias sketchbooks demonstrate how she juxtaposes what she notices to see what results: here she com-bines sketches, photos, swatches, threads, feathers and words to un-cover new possibilities for sandals, satchels and sarongs. Notice that the satchel carried by the green-tank-topped woman (far left) is drawn with fabric and strips of leather.

    Who thinks like this? Not focus groups. Jeep-, rhino-, and biplane-shaped cardboard gift boxes (right) were the imaginative products of a playful porousness.

    Part of The Gap since 1983, todays Banana Republic has safaried far from its ground-breaking roots, although visual traces remain. Below, heavy window framing sug-gests cargo crate or steamer trunk of the world traveler.

    CO

    RBIS

    | A

    rthu

    r M

    orris

  • 24 Before&After Issue 33 www.bamagazine.com

    They blew up the logo.And then it was over.The flag hoisted by three firemen in the

    rubble of 9/11, remember that? When one business acquires another,

    what changes first? Lets talk about your logo.Why would you redesign a logo? There

    are many reasons. If a company changes product or mission or market, a new logo will reflect the new day. An old image may look dated. Tastes change.

    Whatever the case, and whatever the logo, the thing to know is that the subject is serious.

    As a designer, you most likely think first in terms of aestheticsthis image is prettier than thator about what each ele-ment symbolizes. But be careful. What an image symbolizes to you has no bearing on what it means to the client. To the client, its the old logo that has meaning.

    Why? Because everyone who works for a company has to some degree adopted an identity. We bring to a job our educa-tion, abilities, ambitions, and take from it income, friends, lifestyle. We identify these experiences with the company and infuse its logo with personal meaning, whether the logo is artistically attractive or not.

    The logo is not just a graphic any more than a flag is a piece of colored cloth.

    Thats why its so hard to design. Youre working on sacred soil. Im exaggerating only a little, but Im not kidding.

    Thing is, a client asking for a redesign will not be aware of thisthat what he knows and values about his company is attached to its logo, and that hes asking you to replace it. Hes asking for a new flag.

    Advice: If you feel qualified, do the job. Before unveiling it, prepare your client. Tell him he can expect to feel uncomfortable at first, because youre replacing what he knows with a foreign thing. Tell him to not look for his familiar symbolism in it. It is being changed. But assure him that once his choice is made, his old meaning will gradually be transferred to the new logo.

    Then show him your best work.

    PRODUCTION NOTES Is the worlds first PageMaker studio still using PageMaker? No, we recently standardized on the Adobe Design Collection, which includes InDesign 2.02, Photoshop 7.0 and Illustrator 10. Our computers are new 17 Apple iMacs, (running OS X), which we like, and whose physi-cal attractiveness starts a lot of conversations. Biggest surprise: the screen display. Sharp, satu-rated, brilliant whites, jet blacks, its a quantum leap from our suddenly drab, blurry CRTs. In fact, even our printed pages look a little dull in com-parison, which is saying a lot, because our work-horse office printer is brilliant. The Xerox 8500 applies intense color not with ink or toner but with hot wax, color so vibrant that it sometimes surpasses the actual magazine. And thats say-ing a lot, because the printing of Before & After is state of the art. Unlike our rickety early years, the new B&A is handled computer to press via a 100% PostScript workflow by Dome Printing in Sacramento. Our InDesign files flow from a Creo Platemaster server to Flight Check for file review, then to Preps for page imposition. From there, a Creo Proofsetter makes digital Matchprint proofs using the same laser and dots that image Fuji thermal plates on the Creo Platesetter, with Creo Square Spot technology. B&A is printed at 175 lines per inch on a Heidel-berg web press. The quality result of this high tech speaks for itself. Funny, though, is that after years of compensating for dot gain, we now find ourselves compensating for slight dot loss.

    We are brand new to InDesign, and so far are especially impressed by its Paragraph Composer, which is the finest typesetting software weve ever seen. We miss some of PageMakers inter-face features, though, such as the simplicity of clicking anywhere to start typing, and moving the view freely with a single-key grabber hand. Practice will change this; we had PageMaker for 18 years, so many of our expectations are born of familiarity more than usefulness. InDesign is excellent and full of surprises. Stay tuned.

    Just as much as the Web, color in five years has changed the look of everyday communication, and now plays a part in every aspect of design. In color, consistency is everythingkeeping a color the same across all media. To this end, we have standardized as much as practical on Pantone

    nomenclature. We list the four process inkscyan, magenta, yellow and blackby percentage in the manner shown here. C80, for example, means an 80% tint of cyan. K means black. Where color corresponds to a Pantone standard, we also list the Pan-tone name, although the printed color is only a simulation.

    TTHE IMAGE BELOW is amazing, at least to me, not for political reasons, but for design reasons. What we see here is a 69-ton Brit-ish Challenger II tankseriously heavy metalnear Basra not long ago crushing a portrait of Saddam Hussein. A portrait.How much does a portrait weigh? Do you need 69 tons of armor to ruin it? Before you say of course not, Id like to

    suggest that maybe you do.Thats what I find amazing.When Saddam Husseins statue in cen-

    tral Baghdad was topplednot the real Saddam, not the actual person, but the metal imagethats when people flocked into the streets, when all knew the end was at hand, that the regime was done.

    Its like this. When one nation invades another, the first thing it does, as soon as it is able, before the fighting is over, before the government is installed, the first thing it does is replace the flag.

    Theres a famous image taken in Berlin at the end of World War II of allied armor destroying the despised swastika atop Nazi headquarters.

    John McWade | The power of the logo

    Pantone

    Process

    M30

    K30

    Y40

    C80

    REU

    TERS

    | C

    hris

    Hel

    gren

    24 Before&After Issue 33 www.bamagazine.com