When in doubt about learning… read this! Continue reading
When you see museums through UX Design, this is what you get. Continue reading
Get a little closer to what is UX Design and how it works. All made simple. Continue reading
Graphical interface pioneer Susan Kare, photo by R.J. Muna
The gestures and metaphors of icon-driven computing feel so natural and effortless to us now, it seems strange to recall navigating in the digital world any other way. Until Apple’s debut of the Macintosh in 1984, however, most of ourinteractions with computers looked more like this:
How did we get from there to here?
The Mac wasn’t the first computer to present the user with a virtual desktop of files and folders instead of a command line and a blinking cursor. As every amateur geek historian knows, the core concepts behind the graphical user interface or GUI (including the icons, mouse, and bitmapped graphics) made their debut in 1968 in a presentation by Stanford Research Institute’s Doug Engelbart celebrated as the “mother of all demos.”
The revolutionary ideas in Engelbart’s demo were further developed at Xerox PARC, where a 24-year-old Steve Jobs took a legendary tour in 1979 that convinced him that the GUI represented the democratic future of computing. (“I thought it was the best thing I’d ever seen in my life,” he said later. “Within ten minutes, it was obvious to me that all computers would work like this someday.”) He promptly licensed the GUI technology he saw at work in a non-commercial product called the Xerox Alto for a modest amount of Apple stock, and the rest is Silicon Valley history.
Steve Jobs, 1983, by Susan Kare
Shortly thereafter, Xerox doomed its chances to own the icon-driven future by pouring its resources into the Xerox Star, a product aimed strictly at the corporate market. Each Star purchase required an initial $75,000 installation and a network of external file servers, plus another $16,000 for each additional workstation (twice the price of a new car at the time). A digital revolution for the masses, it wasn’t.
The genius of Steve Jobs, Jef Raskin, and the rest of the Mac team was recognizing a huge untapped market for home computing among artists, musicians, writers, and other creative weirdos who might never have cared enough to master the arcane complexities of a command-line UI or blow a fortune on hulking digital workstations.
The challenge of designing a personal computer that “the rest of us” would not only buy, but fall crazy in love with, however, required input from the kind of people who might some day be convinced to try using a Mac. Fittingly, one of the team’s most auspicious early hires was a young artist herself: Susan Kare.
After taking painting lessons as a young girl and graduating from New York University with a Ph.D. in fine arts, Kare moved to the Bay Area, where she took a curatorial job at the Fine Arts Museums of San Francisco. But she quickly felt like she was on the wrong side of the creative equation. “I’d go talk to artists in their studios for exhibitions,” she recalls, “but I really wanted to be working inmy studio.”
Eventually Kare earned a commission from an Arkansas museum to sculpt a razorback hog out of steel. That was the project she was tackling in her garage in Palo Alto when she got a call from a high-school friend named Andy Hertzfeld, who was the lead software architect for the Macintosh operating system, offering her a job.
Kare’s first assignment was developing fonts for the Mac OS. At the time, digital typefaces were monospaced, meaning that both a narrow I and a broad M were wedged into the same bitmapped real estate — a vestigial legacy of the way that a typewriter platen advances, one space at a time. Jobs was determined to come up with something better for his sleek new machine, having been impressed by the grace of finely wrought letterforms in calligraphy classes he audited at Reed College, taught by the Trappist monk Robert Palladino, a disciple of master calligrapher Lloyd Reynolds. (The lasting impact of Reynolds’ instruction can also be seen in the playful cursive of the seminal West Coast Beat poets Gary Snyder and Philip Whalen, making Reynolds and Palladino the human hyperlinks between desktop publishing and Jack Kerouac’s Dharma Bums.)
For the Mac, Kare designed the first proportionally spaced digital font family that allowed text to breathe as naturally on the Mac’s white screen as it does in the pages of a book. The distinctive Jobs touch was upgrading the original monikers of these elegant typefaces from the names of train stations near Philadelphia — like Rosemont and Ardmore — to those of world-class cities like Geneva, Chicago, and New York.
Inspired by the collaborative intelligence of her fellow software designers, Kare stayed on at Apple to craft the navigational elements for Mac’s GUI. Because an application for designing icons on screen hadn’t been coded yet, she went to the University Art supply store in Palo Alto and picked up a $2.50 sketchbook so she could begin playing around with forms and ideas. In the pages of this sketchbook, which hardly anyone but Kare has seen before now*, she created the casual prototypes of a new, radically user-friendly face of computing — each square of graph paper representing a pixel on the screen.
First Kare sketched a pointing finger for the “paste” command, using a pink magic marker.
Then she sketched a paintbrush with some paint on it.
She drew a pair of scissors for the “cut” command.
And she drew a bitmapped hand — the primitive progenitor of all the “pan hands” sliding invisible sheets of paper in programs like Adobe Photoshop and Illustrator.
She sketched an icon for “stop.”
And a symbol for “danger.” (The skull-and-crossbones design would come in handy when Jobs issued one of his infamous motivational koans to the Mac team: “It’s better to be a pirate than join the Navy.” Painted on a flag, Kare’s Jolly Roger was hoisted outside of the Mac skunkworks in Bandley 3.)
And she sketched a pair of complementary bitmaps for Apple itself.
Kare also drew some frankly goofy stuff, like an icon for “auto indent” that was a bit too literal.
And two equally whimsical icons for a programming instruction called “jump.”
She also came up with ideas for a term she heard the programmers using as they raced to meet Jobs’ punishing deadlines: “debug.”
And for “boot,” she drew an icon worthy of Nancy Sinatra.
Once software was developed that enabled Kare to start brainstorming digitally, she mined ideas from everywhere: Asian art history, the geeky gadgets and toys that festooned her teammates’ cubicles, and the glyphs that Depression-era hobos chalked on walls to point the way to a sympathetic household. The symbol on every Apple command key to this day — a stylized castle seen from above — was commonly used in Swedish campgrounds to denote an interesting sightseeing destination. [Note: See comment by Lennart Regebro below for an even older citation of the design.]
Kare’s work gave the Mac a visual lexicon that was universally inviting and intuitive. Instead of thinking of each image as a tiny illustration of a real object, she aimed to design icons that were as instantly comprehensible as traffic signs.
There was an ineffably disarming and safe quality about her designs. Like their self-effacing creator — who still makes a point of surfing in the ocean several mornings a week — they radiated good vibes. To creative innovators in the ’80s who didn’t see themselves as computer geeks, Kare’s icons said: Stop stressing out about technology. Go ahead, dive in!
And dive in we did, en masse. In the Wall Street Journal recently, Steven Johnson, author of Where Good Ideas Come From and other smart books,recalled the thrill of seeing the first computer he ever considered buying: “One look at the Mac and you could tell something was different. The white screen alone seemed revolutionary, after years of reading green text on a black background. And there were typefaces! I had been obsessed with typography since my grade-school years; here was a computer that treated fonts as an art, not just a clump of pixels. The graphic interface made the screen feel like a space you wanted to inhabit, to make your own… The Mac was a machine you wanted to live in.”
Many of us are living there still; and you can find the myriad visual descendants of Kare’s sketches in desktops, laptops, tablets, and phones today.
At the same time, as hardware has become faster, cheaper, and more powerful, interface designers have moved away from spare, economical road-sign style icons, and now favor the lush, elaborately rendered, 3D virtual objects that fill up the screens of our mobile phones and tablets, complete with faux shadows and glistening highlights.
For Kare herself, the Apple years were just an initial milestone in a distinguished career that has included designing icons for the Windows and IBM OS/2 operating systems, bitmapping the virtual deck in the Windows version of Solitaire, crafting logos for startups, creating products for New York’s Museum of Modern Art, and making fine-art prints of memorable icons like the Bomb, the Watch, the Paint Can, and the taxonomically ambiguous Dogcow.
For years, thousands of Facebook users a day swapped Kare-designed birthday cakes, engagement rings, roses, and disco balls, never knowing they were made by the same artist whose smiling image of the Happy Mac greeted a generation at the threshold of a new world.
In time for the holiday season, Kare has self-published her first book, Susan Kare Icons, with copies signed by the artist available on her website. A modified version of this essay serves as the introduction, though the hand-drawn icons seen here are not included in the book.
I asked Kare if she had any feeling at the time that the work she was doing at Apple 30 years ago would be so pervasively influential. ”You can set out to make a painting, but you can’t set out to make a great painting,” she told me. “If you look at that blank canvas and say, ‘Now I’m going to create a masterpiece’ — that’s just foolhardy. You just have to make the best painting you can, and if you’re lucky, people will get the message.”
[*Some of these icons were included in my presentation for Pop-Up Magazine #5 at Davies Symphony Hall in San Francisco on November 9, 2011. Thanks to the Pop-Up editors and contributors for a marvelous evening. All icons used with the permission of Susan Kare.]
Originally published on PLOS Blogs November 22, 2011