I was having an interesting conversation with Alex Jones the other day, remarking about the usability studies by Peter Steen Høgenhaug around the ‘link’ iconography in CMS software. Alex touched on this in his blog with Usability of the Link Icon and earlier with Replacing the Save Icon. It’s interesting when we encounter patterns in systems that other designs tend to perpetuate and we create learned patterns that users who interact with our systems get used to over time.

As Alex points out, Høgenhaug did test with users unfamiliar with the CMS software and were not used to patterns in those systems even though many systems use very, very similar iconography. It would be interesting to see that case applied to frequent users (a simple pattern learned once, to be sure).

I’m a big fan of re-evaluating systems on a regular basis because I think it keeps UX professionals fresh. I’m always worried that too often, as technology changes, as systems become more complex and evolved, we rely on older iconography, older user patterns, and the ‘traditional’ ways of thinking. I feel that we should be looking deeply at the user base to come up with new and innovative methods to teach users new structures rather than relying on old habits and patterns. Saving to a disk may no longer be a useful user action, versions could be closer to the path you want users to take. Sharing, Tweeting, Manipulation – new and interesting actions have cropped up for users. It’s up to designers to take a step back and look at how these actions are taken in the system and craft designs which encourage these actions but are not confusing.

John – Agency Creative Director

• 38 years old, married with children and a dog – enjoys painting in his spare time.
• John has been the creative director of a mid-sized agency for 3 years.
• John’s looking for an online portfolio, attention to detail, and some idea of style and taste.
• In addition to creative samples, John wants to see a good knowledge base, experience, and contact information .
• John spends a fair amount of time on the Web and as such can appreciate good design and the latest trends both in Web development and design. He speaks the lingo and is on the forefront with best practices to fulfill a wide variety of customer/ client needs.
• John takes an analytical, critical approach to sites. The need to find information quickly and effectively is important as he is constantly judging the interface.

Andrea – Local Web Designer

• 31 years old, has a boyfriend and a cat – enjoys indie music and good beer.
• Andrea is a local tech/ design geek who keeps up her relationships in the industry.
• Andrea enjoys reading tech and design blogs (mostly through her Google Reader) to stay on top of the latest tools of her trade and also for inspiration for her next design.
• Industry news is very important and she keeps up with what’s happening with her peers by attending several professional events as well as discussions online. Beer Summits are her favorite.
• She is most likely to find a new blog to read through her contacts in the industry or through meeting with the authors at professional meetups

Any and all thoughts are welcome, I’m still kind of fleshing the personas out as I begin to focus on a new information architecture that I’ll post within the next few days. I’m still looking to see if, in fact, I need another persona or if these two would capture the majority of those who would look at my site.

I finally got the shirt that I ordered off Fab (FYI, if you want an invite, I’d be glad to send you one) from the wonderfully creative Out Of Print clothing company. They make amazing shirts featuring artwork from out-of-print editions of great works. They also have a mission (from their site):

Out of Print celebrates the world’s great stories through fashion. Our shirts feature iconic and often out of print book covers. Some are classics, some are just curious enough to make great t-shirts, but all are striking works of art.

We work closely with artists, authors and publishers to license the content that ends up in our collections. Each shirt is treated to feel soft and worn like a well-read book.

In addition to spreading the joy of reading through our tees, we acknowledge that many parts of the world don’t have access to books at all. We are working to change that. For each shirt we sell, one book is donated to a community in need through our partner Books For Africa.

How we read is changing as we move further into the digital age. It’s unclear what the role of the book cover will be in this new era, but we feel it’s more important than ever to reflect on our own individual experiences with great literary art before it’s forever changed.

The one thing I was really struck by was the shirt’s tag. It’s always a great feeling to see that someone cared enough about the whole user experience to seamlessly meld ideas into a cohesive, coherent brand package. For a group concerned with literary tradition, they nailed the concept – my clothing tag was an old punch library card with the names of all the creatives involved in the project.

Details matter. The experience doesn’t stop with a purchase or a click through.

Many thanks to Chris Harris for helping me out with some amazing logo sketches. I’m really loving the one on the lower right. I’m trying to go for a bug that will work over several themes and still look pretty bold on the Web.

I’m still going through a lot of the Web stuff too – I’ll post some of the personas and wireframes I’ve been playing with. I’m really trying to pull myself above the project (one of the reasons I asked for Chris’ help). I feel that my last design was a long time coming because I was knee-deep in the design and moving farther from treating myself as a client. I really want to go through the motions to do this redesign differently. I think it’s also a more ‘true’ redesign in that I’m changing everything and slightly repositioning myself more towards interaction design and user experience at a higher level.

I’m hoping that what’s good for the goose is good for the gander. I know what types of planning and design make interfaces work for clients and the like, I’m just trying to apply all the same steps to my design, trying not to be as personally wrapped up in the nitty gritty and following a design plan I’ve set out for myself.

I’m opening up comments on this post and I’d love to hear some thoughts on the sketches, what you think of my ideas to process everything from a detached point-of-view, and pretty much whatever’s on your mind.

I’ve started work on a redesign of everything.

I don’t just mean this site, but my resume, my cover letter design, my branding, my business cards, invoices, my Tumblr, my Twitter, everything.

I’ve not gotten to really get involved in my personal projects in a while so I’m deciding that I’m going all out on this project. I want to model everything after early-mid 1960s style ‘golden age of air travel’. I love the aesthetic that was produced at the time, but more importantly I love the concept of a user experience I’ll never be able to enjoy.

Air Travel used to be grand: everything was branded just so, every need was catered to, and the airlines encouraged an experience rather than just a service. I wasn’t alive to enjoy it, so I’m sure I romantize the experience a bit; but I’m enthralled with all the good design from huge companies really pouring money into a hard sell. I wish more companies would put that kind of money into their user experiences again, but with travel, sadly, I worry those days are long long gone never to return. Flying is now an uncomfortable chore, a thing you have to remove clothing to do, something that makes you feel flustered, and generally user-unfriendly.

I’m looking through lots of old inspiring tags, boarding passes, and materials from that era, trying to pick out graphic design elements that I can put my own twist on, update and make modern. I want to showcase how important every facet of the user experience was to the continued success of an industry and hopeful the exercise will make me a better user experience designer for it.

I’ll post wireframes, sketches, personas, and designs as I make them, so watch this space for big changes!

A conversation transpired the other day in which a colleague of mine remarked that he’d had it with “hacks” in our industry – that is, those who call themselves developers and designers but still use recycled code, un-secure scripts, and kludged together markup. He complained that there should be an education requirement (like that of doctors, lawyers and engineers) and that the lack of professional underpinnings was killing our industry. He argues:

“There’s such a low entry level to our industry, all you need is photoshop & wordpress to build a site”

“… [T]here are hacks in the webdesign/deve industry (like other industries) and education would help weed them out.”

“Anyone can participate even if they’ve never built a site before or their a seasoned vet.”

These arguments (and I hear them frequently amongst professionals in my field, especially after a few years of making a good, honest living doing this) are worrisome to me. I myself did not earn any degree in my industry (for those that don’t know: I have a B.S. in Microbiology and Immunology. NOT Web development. NOT Advertising. NOT Computer science.) and in fact, most of my most trusted colleagues didn’t either. Ours is a very, very young industry and we should do well to remember that our pioneers are not so old yet. Even surgery was once the domain of the barber. I think the low level of entry is amazingly effective in bringing in new talent who really want to understand and change the industry in new and powerful ways. What first got you into the Web field?

Education, to me, seems a horrifyingly poor way to “weed out” those hacks in the industry. High-powered ADAs who help put away mass murders, rapists, and pedophiles went to law school. The ambulance chasers and DWI-Dudes also went to law school. Education seems to be a rather poor way to separate the hacks from the pros – there are plenty of diploma-factories out there who are all to happy to give you a slip of paper giving you a degree in “Web Paging” in exchange for cold cash. The education is nice, but it’s my belief that Mark Twain was right: “I have never let my schooling get in the way of my education.” I myself teach classes on development and accessibility, I give back by posting on forums and message boards, I try to attend meetups and conferences to learn and share my knowledge with others because it keeps my skills sharp as well as opening me up to learn something from those with different life experiences.

The last point really gets under my skin. I feel that an argument like this is birthed from time removed from a time when the professional was starting out. I will be the first to admit I came in through the hobby and hacker route – I was a little script kiddy doing my best. I learned from stealing source code, playing with scripts from other sites and honestly hacking crap together until I understood how it worked. Tim Berners Lee started this little experiment to help researchers publish content to a hub. This isn’t the Sorbonne, it’s the Wild West – it’s open and free and it’s what we all love deep down in our hearts. I feel the day that we treat this as an elites-only walled garden, is the day our profession will have fallen to so much accounting and pixel pushing. I know the concern is that it lowers professionalism for those of us who make money doing this professionally, but it’s true for any industry. There are those who will prefer the cheap suits at Sears, but there are plenty who respect and want a bespoke piece from Savile Row. The cream always rises to the top, so they say.

So I welcome all the hackers, hacks, script kiddies, punks, and noobs. There’s always more to learn, more that noobs can teach us about ourselves and our established modes of thinking and that’s frankly better for all of us.

As the wonderful Mr. Fry points out, the secret to being gorgeous is in one’s attitude of mind. By being mindful of good design choices and good interactions, users will tell us that we are wonderful. The secret is really in mindfulness – the more time and effort we put into designing quality interactions with touches and flourishes of UX goodies, the better our products become. The late, great John Slatin once told me that he felt that those who were mindful of accessibility and usability were so often far and away better than their peers at those areas. Because the Web is a mutable form, because users are constantly interacting with the implementation, and because feedback is easier and faster than ever before, we need every facet to gleam, every seam to be stitched and everything to look, well, gorgeous.

I’ve been thinking a lot about attention to details, something I’ve always struggled with (even though I know when I do it I’m so much better off because I take more pride in the thing I’ve created), and I’m making a larger push in my design and development to really focus on those details and little things that don’t so much make people notice them, but feel at ease because everything is just right.

Thinking about little details in a broad way helps one understand the full scope. If, for instance, a user is making a purchase on a site for the first time and there are lots of well done photos of the object or all the buttons fit the site look or the breadcrumbs show the steps a user needs to take; then there is a slow building of confidence – the user now trusts the seller because if the process was so tight on the details, the worries of shipping, security, etc are lessened (for better or worse) and customer confidence improves.

So let’s take some of Mr. Fry’s advice – the more we pay attention to making our interfaces and processes gorgeous, the more people will tell us so, which is the secret, really.

Sprezzatura is an old Italian word defined as “an easy facility in accomplishing difficult actions which hides the conscious effort that went into them.” In other words, making it look effortless. This is an important trait for user-centered design: the workflow, actions, and methods a user takes through the design should make the experience pleasant and as simple as possible.

I like the idea of old words to describe concepts which have become so full to bursting with just a certain type of meaning, that they exist as themselves – untranslatable. Words like panache or schadenfreude or (to quote Kim Loop) tacos. There should be a certain amount of the untranslatable in design, too; something that helps users navigate the difficult and deep concepts that we ask them to follow. Think about how many interactions a user must go through to purchase goods and services for an e-commerce site or how many fields must be filled out to sign up for a new service from a provider. These interactions can happen because UX designers and developers have paved the way – made it seem simple and clean.

The best way to make the hard stuff look easy is through research: find out what your users get caught up on, find out what they want most in your interface, and find out what makes your users trust you. Keep testing, through A/B testing, constant design tweaks and polling your users. I’ve always liked programs like Silverback and doing task-based polls with simple click-based tasks. By taking stock of what your users find difficult, you can make that difficult time seem easy. Capiche?

So much has happened in the past few weeks (both personally and in the tech world) that I’m updating twice this week to make up for last week. I wanted to write about the iPad, but I’m going to save it for another day. I had to comment on my friend Mike Melanson’s (@rwwmike) Read Write Web article (read the full thing, especially the comments).

Because I’m a friend to Mike, and I like RWW, I subscribe to their RSS feed via Google reader. I therefore missed all the amazing comments that ensued from users. I’m now very sorry I did. Here’s just a small sampling of what comments a post called “Facebook Wants to Be Your One True Login” got:

ok cool now can I get to facebook (fuccinwayne)

The new facebook sucks> NOW LET ME IN. (John Blair)

I WANT THE OLD FAFEBOOK BACK THIS SHIT IS WACK!!!!! (Nicole Gray)

What is going on? You are totally confusing me. Knock-knock. Anybody there? Let me in. Katherine (Katherine Radway Hegedus)

By now you get the idea: There are somewhere in the range of 200+ comments like these. It took me a while to understand what was going on, but it dawned on me that the RWW article ranked higher in the Google search rank than did the Facebook login page. This means someone did the following steps 100% blindly (or autopilot):

1. typed “login facebook” into Google
2. clicked the first link without looking at the link or description
3. ignored the red color scheme of Read Write Web
4. dismissed the huge article in the middle of the page until they found a Facebook icon (Facebook connect)
5. without looking at the address bar or any authentication, logged in as if to Facebook
6. finding the comment field the only place to post, ignoring all other comments, posted an angry or confused question as if Facebook were a person

David Hayes (@drhayes) has a beautiful shot that it’s much more than Facebook on his blog.

As a user experience developer, this brings up all sorts of questions, concerns, and feelings of dread. As a user experience developer I certainly know that I’m not my audience or even close to it, but I do think I have an understanding of how things work. I had no idea how heavy the reliance on Google to get a user where they wanted to go was. I wasn’t sure that so many users had gotten so adept at filtering out such amazing amounts of noise, they saw Read Write Web as Facebook.

Users seem not to use the address bar, they don’t use bookmarks, and hardly read anything. This isn’t bad, it’s not saying these users are dumb, but it brings up a need to fix these interfaces for users. This is just a time where I feel like a priest in the Dark Ages: preaching the only written word through a language no one understands. It freaks me out when I peer into the actions of users who are using the sites and I can’t begin to fathom the thought process or the use case.

Talking with less tech savvy friends and family, they are amazed that I “know all this stuff” when I myself feel I don’t know much at all until I look at it from the other end: this is my job and my life – I am of the priest class, talking in cryptic language, trying to navigate the dark for my flock. I try my hardest to treat these things as material to learn, to grow in my understanding of the philosophy of the user.

Part of me can’t help but think – did users learn the behavior that caused them to act that way because we trained them that way?

Horizontal Buttonholes
Buttonholes serve to keep the garment fastened, plain and simple. The reason buttonholes in dress shirts run vertically is two fold: one one hand, the vertical lines look good with vertical stripes and stitching, and on the other, the vertical buttonhole keeps the button in the middle of the hole while making sure that no stress unbuttons it. Two holes in the shirt, however, have different stress points: the neckline (the collar) and the waistline (at the belt level).

The neck and hips both rotate horizontally while the chest and stomach, when they do rotate, rotate vertically along the spine. This causes stress to be placed in the opposite direction from the position of the vertical buttonholes at these locations. Tailors, being the designers they are, came up with a nifty solution:

Horizontal buttonholes at the waist and neck now distribute the pressure from twisting motion! But wait, doing so suddenly ruins the nice, clean centered button everytime force is applied. The button will slide from the middle, to the opposite side of the force and back again. That wouldn’t look good, except these buttons are hidden from view by the tie at the neckline and the belt and trousers at the waistline. Brilliant!

Gusset Reinforcements
Speaking of pressure, the shirt has pressure applied anyplace that two pieces of fabric meet. Normally seams take all this pressure, but what of areas that require openings such as the cuffs and the space where the front and back tails meet along the coronal plane of the body? Over time, tailors found these meeting of the folds took much of the stress of the garment. To solve this and make the shirts last longer, tailors employed gussets: small pieces of fabric and stitch that held fast like so:

These reinforcements are not that noticeable, but they add long-term value to the shirt while solving a fundamental problem, which keeps the user happy as their shirt secretly holds up throughout the day

Undercollar Construction
The collar of a shirt is arguably one of the most distinctive aspects to the shirt. Button down, point, or wing collars all give a clean line to the face of the gent wearing it. Tailors know this but they also know that men sweat and need to wash the shirt over and over again in its lifetime. The problem with washing is the shrinking effect it can have on fabric. To keep the points clean and the collar looking sharp, Tailors build in undercollars. Undercollars are woven differently than the top collar to not pull on the top fabric if they shrink:

The undercollar really highlights a good user experience in that the shirt, despite repeated cleaning, looks great everytime. The undercollar is almost never, ever seen, much less noticed, yet it just works to make the user appreciate the forward-facing part of the shirt.

Buttons and Stitching
Buttons and stitches are the main reinforcements of the garment, and as such, need to be sturdy and many. Buttons on well made shirts are generally pearl, rather than plastic. Though Tailors found that it was cheaper to use plastic or resin buttons, they cause the buttons to slip from their holes easier and can chip and crack more often than their stronger pearl counterparts. Stitches hold all the pieces of the garment together, so the more per square inch, the more the shirt feels like a single piece, moving as one.

The phrase, “A stitch in time, may save nine” is literal here. This translates to any user experience developer: by spending the time and effort to make the experience better up front, the system becomes easier to maintain and by thinking of the details, the major pieces are already in place.

When developing a user experience, think about the ways the user will operate the system. Where will the user notice problems? Where will the pain points be? By gathering feedback and thinking critically, we can reinforce the way the user interacts to ensure a seamless and brilliant feel for our users. By taking care of the problems the user might run into, be provide an interface that the user feels is bespoke, made for them. When we do things right, the experience is as nice and comfortable as your favorite shirt.