Categories
Advocacy art direction Design Designers Ideas industry interface IXD Jason Santa Maria links Off My Lawn! Redesigns Responsive Web Design State of the Web Tech The Profession User Experience UX Web Design Web Design History webfonts

The Web We Lost: Luke Dorny Redesign

Like 90s hip-hop, The Web We Lost™ retains a near-mystical hold on the hearts and minds of those who were lucky enough to be part of it. Luke Dorny’s recent, lovingly hand-carved redesign of his personal site encompasses several generations of that pioneering creative web. As such, it will repay your curiosity.

Details, details.

Check Luke’s article page for textural, typographic, and interactive hat tips to great old sites from the likes of k10k, Cameron Moll, Jason Santa Maria, and more. 

And don’t stop there; each section of the updated lukedorny.com offers its own little bonus delights. Like the floating titles (on first load) and touchable, complex thumbnail highlights on the “observer” (AKA home) page. 

And by home page, I don’t mean the home page that loads when you first hit the site: that’s a narrow, fixed-width design that’s both a tribute and a goof.

No, I mean the home page that replaces that narrow initial home page once the cookies kick in. Want to see the initial, fixed-width home page again? I’m not sure that you can. Weird detail. Cool detail. Who thinks of such things? Some of us used to.

And don’t miss the subtle thrills of the silken pull threads (complete with shadows) and winking logo pull tab in the site’s footer. I could play with that all day.

Multiply animated elements, paths, and shadows bring life to the footer of Luke Dorny’s newly redesigned website.

Now, no site exactly needs those loving details. But danged if they don’t encourage you to spend time on the site and actually peruse its content

There was a time when we thought about things like that. We knew people had a big choice in which websites they chose to visit. (Because people did have a big choice back in them days before social media consolidation.) And we worked to be worthy of their time and attention.

Days of future past

We can still strive to be worthy by sweating details and staying alive to the creative possibilities of the page. Not on every project, of course. But certainly on our personal sites. And we don’t have to limit our creative love and attention only to our personal sites. We pushed ourselves, back then; we can do it again.

In our products, we can remember to add delight as we subtract friction.

And just as an unexpected bouquet can brighten the day for someone we love, in the sites we design for partners, we can be on the lookout for opportunities to pleasantly surprise with unexpected, little, loving details.

Crafted with care doesn’t have to mean bespoke. But it’s remarkable what can happen when, in the early planning stage of a new project, we act as if we’re going to have to create each page from scratch.

In calling Luke Dorny’s site to your attention, I must disclaim a few things:

  • I haven’t run accessibility tests on lukedorny.com or even tried to navigate it with images off, or via the keyboard.
  • Using pixel fonts for body copy, headlines, labels, and so on—while entirely appropriate to the period Luke’s celebrating and conceptually necessary for the design to work as it should—isn’t the most readable choice and may cause difficulty for some readers.
  • I haven’t tested the site in every browser and on every known device. I haven’t checked its optimization. For all I know, the site may pass such tests with flying colors, but I tend to think all this beauty comes at a price in terms of assets and bandwidth. 

Nevertheless, I do commend this fine website to your loving attention. Maybe spend time on it instead of Twitter next time you take a break?

I’ll be back soon with more examples of sites trying harder.


Simulcast on Automattic Design

Categories
A Book Apart A List Apart Advertising Advocacy An Event Apart architecture automattic Blogs and Blogging business Career client services clients climate change Code Community conferences content Coudal Partners creativity CSS Design Designers development DWWS engagement eric meyer Future-Friendly glamorous HTML Ideas industry Jason Santa Maria launches Ma.gnolia My Back Pages Off My Lawn! parenting peachpit Publications Publisher's Note Publishing Redesigns Self-Employment software Standards Startups State of the Web Stories studio.zeldman The Essentials The Profession Usability User Experience UX Web Design Web Design History Web Standards Websites wordpress Working writing Zeldman zeldman.com

Ten Years Ago on the Web

2006 DOESN’T seem forever ago until I remember that we were tracking IE7 bugsworrying about the RSS feed validator, and viewing Drupal as an accessibility-and-web-standards-positive platform, at the time. Pundits were claiming bad design was good for the web (just as some still do). Joe Clark was critiquing WCAG 2. “An Inconvenient Truth” was playing in theaters, and many folks were surprised to learn that climate change was a thing.

I was writing the second edition of Designing With Web Standards. My daughter, who is about to turn twelve, was about to turn two. My dad suffered a heart attack. (Relax! Ten years later, he is still around and healthy.) A List Apart had just added a job board. “The revolution will be salaried,” we trumpeted.

Preparing for An Event Apart Atlanta, An Event Apart NYC, and An Event Apart Chicago (sponsored by Jewelboxing! RIP) consumed much of my time and energy. Attendees told us these were good shows, and they were, but you would not recognize them as AEA events today—they were much more homespun. “Hey, kids, let’s put on a show!” we used to joke. “My mom will sew the costumes and my dad will build the sets.” (It’s a quotation from a 1940s Andy Hardy movie, not a reflection of our personal views about gender roles.)

Jim Coudal, Jason Fried and I had just launched The Deck, an experiment in unobtrusive, discreet web advertising. Over the next ten years, the ad industry pointedly ignored our experiment, in favor of user tracking, popups, and other anti-patterns. Not entirely coincidentally, my studio had just redesigned the website of Advertising Age, the leading journal of the advertising profession.

Other sites we designed that year included Dictionary.com and Gnu Foods. We also worked on Ma.gnolia, a social bookmarking tool with well-thought-out features like Saved Copies (so you never lost a web page, even if it moved or went offline), Bookmark Ratings, Bookmark Privacy, and Groups. We designed the product for our client and developed many of its features. Rest in peace.

I was reading Adam Greenfield’s Everyware: The Dawning Age of Ubiquitous Computing, a delightfully written text that anticipated and suggested design rules and thinking for our present Internet of Things. It’s a fine book, and one I helped Adam bring to a good publisher. (Clearly, I was itching to break into publishing myself, which I would do with two partners a year or two afterwards.)

In short, it was a year like any other on this wonderful web of ours—full of sound and fury, true, but also rife with innovation and delight.


As part of An Event Apart’s A Decade Apart celebration—commemorating our first ten years as a design and development conference—we asked people we know and love what they were doing professionally ten years ago, in 2006. If you missed parts onetwothree, or four, have a look back.

 

 

Categories
dreams Existence interface Jason Santa Maria Small Business Standards Startups State of the Web The Essentials The Profession W3C

My Glamorous Life: The Power Compels You

I DREAMED that my friend Jason Santa Maria took a job at a popular new startup that had exploded onto the world scene seemingly overnight. A fascinating visual interface was largely responsible for the popularity of the company’s new social software product. It was like a Hypercard stack that came toward you. A post full of exciting social significance just for you would appear in a self-contained deck with rounded corners. The next post would pop up on top of the first. The next, on top of that one. And so on. In my dream, people found this back-to-front pop-up effect thrilling for some reason.

Having imagined the interface, I next dreamed that I went to visit the startup. There were so many cubicles, so many shiny people running around, holding morning standups and singing a strange company song, that I could not locate my friend Jason’s desk. Someone grabbed me and told me the founder wanted to see me.


THE FOUNDER was an ordinary looking white guy in his late twenties. I was surprised that he wore beige chinos with a permapress crease. With all the TV and newspaper hubub around his product, I guess I’d expected a more stylish and charismatic presence.

The founder told me he was concerned because his mother, apparently a cofounder or at least an officer of the company, was of the belief that I had contempt for their product and disliked her personally. I assured him that I liked the product. Further, I had never met his mother, never read or heard a word about her, and felt only goodwill toward her, as I bear toward all people in the abstract. I don’t hate people I don’t know.

“It would be cool if you told mom that yourself,” he said. And suddenly two assistants were whisking me off to speak to her directly.


THE AUDITORIUM-SIZED waiting room outside the founder’s mother’s office was filled with at least a thousand people who had come to talk to her before me. They seemed to have been waiting for hours. There was an air of boredom and rapidly thinning patience, mixed with excitement and the kind of carnival atmosphere that surrounds things that blow up suddenly in the press. It felt like the jury selection room for a celebrity murder case. Only much, much bigger.

The two assistants escorted me to the very front of the auditorium, to an empty row of seats abutting the door to the founder’s mother’s private office. “Special treatment,” I thought. I was thrilled to be cutting to the front of the line, apparently as a result of the founder’s directive to his assistants. The front row chairs were reversed, facing back to the rest of the auditorium, so I was put in the somewhat uneasy position of staring out at the mass of people who had been waiting to see the founder’s mother since long before I arrived.

After a while, Ian Jacobs of the W3C was brought to the front of the room and seated near me.

We waited as other people were shown into the founder’s mother’s presence.


AFTER FIVE or six hours of drowsy waiting, I realized that the room was set up to mirror the software’s interface: people from the very back of the auditorium were first in line, and were shown into the founder’s mother’s presence first. Gradually, the hall of applicants emptied from the back to the front. Those of us in the very front of the line were actually the last people of all who would be admitted to the holy presence. It was a smart marketing touch that apparently permeated the company: everything real people did in the building in some way echoed the characteristics of the software interface — from the end of the line coming first, to the way the rounded conference tables echoed the shapes of individual news posts in the software’s back-to-front news deck.

What a smart company, I thought. And what a good joke on me, as I continued to sit there forever, waiting to see someone I’d never met, who held a baseless grudge against me, which it would one day be my task to talk her out of.

Categories
business Design Happy Cog™ Jason Santa Maria The Essentials Zeldman

One blog post is worth a thousand portfolio pieces.

I HIRED JASON SANTA MARIA after reading this post on his site.

The year was 2004. Douglas Bowman, one of my partners on a major project, had just injured himself and was unable to work. I needed someone talented and disciplined enough to jump into Doug’s shoes and brain—to finish Doug’s part of the project as Doug would have finished it.

I lack the ability to emulate other designers (especially classy ones like Douglas Bowman) and I was a Photoshop guy whereas Doug worked in Illustrator, so I knew I needed a freelancer. But who?

A Google search on Illustrator and web design led me to a post by a guy I’d never heard of. The post was enjoyably written and reflected a mature and coherent attitude not simply toward the technique it described, but to the practice of design itself. Yes, the blog itself was intriguingly and skillfully designed, and that certainly didn’t hurt. But what made me hire Jason was not the artistry of his website’s design nor the demonstration that he possessed the technical skill I sought, but the fact that he had an evolved point of view about web design.

Anyone can write a how-to. Not everyone thinks to write a why.

Jason had.

I offered him the thankless task of aping another designer’s style for not a ton of money under extreme time pressure, and to my pleased surprise, he accepted. He did so well, and performed so selflessly, that I hired him for another project, this time one with full creative freedom. I have never regretted those decisions.

Just about everyone I know and work with I first met online. And, although well-done portfolio services have their place, neither I nor anyone at Happy Cog has ever hired someone purely (or even largely) on the basis of their portfolio. It’s all about how you present yourself online. Before I even meet you, do I feel like I know you—or like I wish I knew you?

Have you got a point of view? Are you sharing it?

Categories
Big Web Show Design Designers Jason Santa Maria The Big Web Show

Episode 30: Jason Santa Maria

Designer Jason Santa Maria

JASON SANTA MARIA (website, Twitter) will be our guest Thursday December 9th, 2010 during Episode No. 30 of The Big Web Show (“Everything Web That Matters”), co-hosted by Dan Benjamin and recorded at 1:00 PM Eastern before a live internet audience.

Jason is a self-described Graphic Designer living in sunny Brooklyn, New York. He is the founder and principal of the design studio Mighty, creative director for Typekit, a faculty member in the MFA Interaction Design program at SVA, co-founder of A Book Apart (Brief Books for People Who Make Websites), vice president of AIGA/NY, founder of Typedia, a shared encyclopedia of typefaces online, and creative director for A List Apart for people who make websites. A former designer and creative director at Happy Cog, Jason has worked for clients such as AIGA, The Chicago Tribune, Housing Works, Miramax Films, The New York Stock Exchange, PBS, The United Nations, and WordPress, “focusing on designing websites that maintain a balance of beauty and usability.”

The Big Web Show records live every Thursday at 1:00 PM Eastern on live.5by5.tv. Edited episodes can be watched afterwards, often within hours of recording, via iTunes (audio feed | video feed) and the web. Subscribe and enjoy!

Categories
AIGA Appearances better-know-a-speaker cities Design glamorous Happy Cog™ Jason Santa Maria New York City NYC Zeldman

Lost in Space

Jeffrey Zeldman onstage.

Jeffrey Zeldman onstage at Galapagos Art Space, Brooklyn, New York. Photo by Onno de Jong from last night’s AIGA/NY talk and birthday celebration, curated by Jason Santa Maria.

Categories
A List Apart Design Fonts Formats industry Jason Santa Maria Real type on the web Standards State of the Web Tools Web Type Day webfonts webtype

Get Real With Real Fonts

A List Apart, for people who make websites.

Web fonts are here. Now what? In Issue No. 296 of A List Apart for people who make websites, Nice Web Type’s Tim Brown debuts Web Font Specimen, a handy, free resource to see how real fonts really look on the web; and Jason Santa Maria discourses on web type, showing how to avoid using fonts that don’t work on the web, and achieve graceful pairings of fonts that do.

Categories
A List Apart An Event Apart Appearances architecture art direction Authoring Browsers bugs Career Chicago cities Code Community Compatibility conferences content content strategy creativity CSS Design development DOM downloads editorial Education engagement eric meyer events flickr Fonts Formats glamorous Happy Cog™ HTML HTML5 industry Information architecture Jason Santa Maria javascript Markup photography Real type on the web Scripting Search social networking speaking spec Standards State of the Web

Chicago Deep Dish

Dan Cederholm and Eric Meyer at An Event Apart Chicago 2009. Photo by John Morrison.

For those who couldn’t be there, and for those who were there and seek to savor the memories, here is An Event Apart Chicago, all wrapped up in a pretty bow:

AEA Chicago – official photo set
By John Morrison, subism studios llc. See also (and contribute to) An Event Apart Chicago 2009 Pool, a user group on Flickr.
A Feed Apart Chicago
Live tweeting from the show, captured forever and still being updated. Includes complete blow-by-blow from Whitney Hess.
Luke W’s Notes on the Show
Smart note-taking by Luke Wroblewski, design lead for Yahoo!, frequent AEA speaker, and author of Web Form Design: Filling in the Blanks (Rosenfeld Media, 2008):

  1. Jeffrey Zeldman: A Site Redesign
  2. Jason Santa Maria: Thinking Small
  3. Kristina Halvorson: Content First
  4. Dan Brown: Concept Models -A Tool for Planning Websites
  5. Whitney Hess: DIY UX -Give Your Users an Upgrade
  6. Andy Clarke: Walls Come Tumbling Down
  7. Eric Meyer: JavaScript Will Save Us All (not captured)
  8. Aaron Gustafson: Using CSS3 Today with eCSStender (not captured)
  9. Simon Willison: Building Things Fast
  10. Luke Wroblewski: Web Form Design in Action (download slides)
  11. Dan Rubin: Designing Virtual Realism
  12. Dan Cederholm: Progressive Enrichment With CSS3 (not captured)
  13. Three years of An Event Apart Presentations

Note: Comment posting here is a bit wonky at the moment. We are investigating the cause. Normal commenting has been restored. Thank you, Noel Jackson.

Short URL: zeldman.com/?p=2695

Categories
A List Apart art direction client services creativity Design industry Jason Santa Maria jobs Web Design work Working

Jason Has Left the Building

I owe it all to Douglas Bowman‘s bad back.

Doug and Brian Alvey and Adam Greenfield and I were working on a big client project when Doug’s back went out. He was so sick, he couldn’t work, and it was unclear when he would be able to work again.

As a friend, I was worried about Doug. As a creative director, I was worried about finishing my client’s project.

Doug and I had both done designs. The client liked my design but I’d sold him Doug’s. Now Doug couldn’t finish, and I didn’t trust myself to execute the remaining pages in Doug’s style. I needed someone skilled enough to finish what Doug had started and mature enough to sublimate his own style while still making good design choices.

I had just read “Grey Box Methodology,” a well-written romp through a personal design process. The author was a young designer named Jason Santa Maria. His site looked great, his portfolio was impressive, he had good ideas about design, and the process he had written about lent itself to the technical aspects of finishing Doug’s work.

I wrote to Jason Santa Maria, telling him I had a small freelance project that was probably boring and would bring him no glory, since it required him to design like someone else. Jason was game and said yes. He did a great job and was egoless about it, and he seemed perfectly comfortable working with better established, heavyweight talents. His quick, professional, selfless work kept the project going until Doug was back on his feet.

To reward Jason for what he had done, when a new and juicy assignment came my way, I asked if he wanted to be the project’s lead designer. The rest you can you figure out.

For four and a half years, Jason Santa Maria has been a designer and then a creative director at Happy Cog. In an agency filled with talent, he made a huge personal mark. I’ve trusted him with some of the most important designs we’ve handled, from AIGA to the redesign of A List Apart. He has never let me down, professionally or personally. More than that, his work has expanded my conception of what web design can be.

Four and a half years is a couple of centuries in internet time. For about a year, Jason and I have known that it was getting to be time for him to move on. Not that we had any problem with him or he with us. But just that nearly half a decade is a long time for any designer to spend in one place.

As he has just announced, Jason is leaving Happy Cog. He will stay involved in A List Apart and perhaps a few selected projects, but basically he is out the door and spreading his wings. Godspeed.

[tags]jasonsantamaria, Jason Santa Maria, JSM, Stan, adieu, happycog, design, webdesign[/tags]

Categories
Code CSS Design development Jason Santa Maria Web Design

Making Modular Layout Systems

Jason Santa Maria details his approach to building a modular system for laying out pages with CSS—“a handy way to predictably tame content without becoming predictable.” Deep tricks of the trade revealed!

[tags]modular, layout, system, css, design, webdesign, jasonsantamaria[/tags]

Categories
A List Apart An Event Apart cities Code conferences content creativity CSS Design development eric meyer events experience Happy Cog™ Ideas industry Jason Santa Maria San Francisco Usability User Experience UX Web Design work Working Zeldman

Photos from An Event Apart San Francisco

Take a dip in the Flickr photo pool from An Event Apart San Francisco 2008. Day Two is about to begin.

111 Minna Gallery (MediaTemple party)

[tags]aeasf08, aneventapart, webdesign, conference, sanfrancisco[/tags]

Categories
An Event Apart art direction Boston Community conferences content CSS Design development eric meyer events experience Happy Cog™ Ideas industry Jason Santa Maria Layout links Standards style Travel UX Web Design Zeldman

AEA Boston 2008 session notes

Early, initial linkage and reviews. Let us know what we missed!

Functioning Form – An Event Apart: Understanding Web Design

Luke Wroblewski: “Jeffrey Zeldman’s Understanding Web Design talk at An Event Apart Boston 2008 highlighted factors that made it challenging to explain the value and perspective of Web designers but still managed to offer a way to describe the field.”

Functioning Form – An Event Apart: The Lessons of CSS Frameworks

Luke Wroblewski: “At An Event Apart Boston 2008, Eric Meyer walked through common characteristics of several Cascading Style Sheet (CSS) frameworks and outlined lessons that can be learned from their structure.”

Functioning Form – An Event Apart: Good Design Ain’t Easy

Luke Wroblewski: “Jason Santa Maria’s Good Design Ain’t Easy talk at An Event Apart 2008 argued for deeper graphic resonance in the presentation of content online.”

KarlynMorissette.com: An Event Apart: Day one schedule

Karyln is an educator who attended An Event Apart Boston 2008, sat in the front row, and took fabulous notes. This summary post links to her individual notes from each session of day one.

Karlyn’s session notes are informative, opinionated, and fun to read, and include photos of speakers and presentations. Well worth your time!

KarlynMorissette.com: An Event Apart: Day two schedule

Karyln assesses day one and posts links to her individual notes from each session of day two (except for the last session, as “you had to be there” for the live critiques).

Idiot Banter: An Event Apart session notes

Notes from all sessions.

Slide sharing

Luke Wroblewski – An Event Apart: Web Application Hierarchy

“In my Web Application Hierarchy presentation at An Event Apart Boston 2008, I walked through the importance of visual hierarchy, visual principles for developing effective hierarchies, and utilizing applications of visual hierarchy to communicate central messages, guide actions, and present information. Download the slides from my presentation.”

Quirksmode: AEA Boston slides

From Peter-Paul Koch’s presentation on unobtrusive scripting.

[tags]aneventapart, design, webdesign, conference, aeaboston08, session notes, downloads[/tags]

Categories
An Event Apart Design Diversity eric meyer events experience Happy Cog™ industry Jason Santa Maria links Standards Travel Web Design work Zeldman

So long, Boston. We’ll be back.

An Event Apart Boston 2008 is over but the memories and photos linger on.

Eric and I started An Event Apart because we saw the need for a live, concentrated, learning and sharing experience about best practices and inspiration for the standards-based web design community. Thanks to brilliant speakers, phenomenally dedicated and supremely competent staff, and an extraordinary and growing attendee base of passionate practitioners, the show is steadily becoming the thing of which we dreamed.

And the food was pretty good, too.

Thank you for the ideas, jokes, and kick-ass Keynote graphics, Luke, Jeff, Jared, Ethan, ppk, Chris, Andy, Kim, Jason, and Doug.

Thanks also to our wonderful sponsors, Adobe (who gave away six copies of Creative Suite 3), GoodBarry (who packed goodies for everyone), and (mt) Media Temple (who threw a party so good, many people who attended don’t remember having been there).

Most of all, our deep thanks to all who came. Without you, Eric and I would be two lonely crackpots with a theory that web design matters. It will sound insincere because I have a vested interested for saying and thinking this, but you are truly the smartest and coolest “audience” going, and I put audience in quotes because you are so much more than that. So, you know, thanks.

Thank you, Boston. We’ll be back in 2009. (And now, on to San Francisco and Chicago.)

Watch this space for AEA Boston session notes and download links, coming momentarily.

[tags]aneventapart, design, webdesign, conference, aeaboston08[/tags]

Categories
art direction Design Jason Santa Maria Layout people Web Design work

Art direction on the web?

On Tuesday morning, while Malarkey was furiously getting himself uninvited to Håkon Lie‘s Christmas parties, and oneself was busy publishing the latest issue of A List Apart, and the jungle drums spoke of nothing but Firefox 3, Jason Santa Maria quietly slipped a torpedo into the harbor.

Jason didn’t just redesign his website, he issued a call to arms. And what he called for was real art direction on the web.

Now, over the years, plenty of others have called for art direction on the web, and some have achieved it. Quite famously, starting in September 1996, Derek Powazek achieved it with the original {fray}, an independent, non-commercial, personal storytelling site featuring the finest writers and illustrators on the web, not a few of whom {fray} discovered and launched. Stories like Lance Arthur’s A Little Black Death, Molly Steenson’s Pulling a Geographic (now sadly stuck in a loop), and Rebecca Eisenberg’s Mugged weren’t just compellingly written; they were compellingly written and art directed. The drama of viewing and wondering what the next page held was part of the reading experience, as it is in visually leading print magazines like Seed and Wired.

{fray} was a magnificent achievement and still is, and if design officialdom didn’t recognize it at the time, and hasn’t recognized it since, the fault lies with officialdom.

But {fray} was not only a labor of love, it was also a labor of labor—each page lovingly hand crafted in the browser-centric HTML of the time. And today we are modern and streamlined, not only in our markup, but in our means of production. We’re all about blogs and zines, templates and CMS platforms. Nobody but weird Unibomber-like hermits and Tantek hand-codes individual pages anymore.

And it is to that environment—to our environment—that Jason’s redesign speaks, calling for real art direction in the context of template-and-CMS-based publications.

Well, here is my experiment: a very simple setup for fast design and art direction around content. I’m approaching this is much the same way one would approach the design of a magazine: a system for the way content gets handled, but every layout and story can take on a look of their own within that system.

It’s just a blog, like any blog, although better looking than most. Housed on what is essentially a beefed-up open source blogging platform. Beefed up just enough to allow the writer/designer to change colors, typefaces, and the position and shape of copy blocks on a per-post basis as needed.

Speaking of beef, where is it? Where are all these posts with unique layouts within an overarching and unifying system of design? They have yet to be written and produced. But I’ve seen the comps and know some of what is coming, and it is going to be a lovely, drawn-out feast.

And even if it were not half as lovely as it will be—if Jason, instead of being one of our leading web designers, were a visual illiterate—the idea would still matter, and this proof of concept would still merit our gratitude.

[tags]artdirection, webdesign, jasonsantamaria, derekpowazek,{fray}[/tags]