Six revisions showcases 20 sites that use typography exceptionally well.
Whitney Hess asked some of the most influential and widely respected practitioners in UX what they consider to be the biggest misperceptions of what we do. The result is not only a terrific list that debunks myths, but an excellent compilation of quotes that better describe what UX is about than a clinical definition can. Those who were quoted described UX as many things, from the reach and touch of customers with products and companies, to the processes we use and the roles we play when we take part in its design.
The Top 10 list of what user experience design is NOT…
1. …user interface design
2. …a step in the process
3. …about technology
4. …just about usability
5. …just about the user
8. …the role of one person or department
9. …a single discipline
10. …a choice
Of course you're going to have to read the article to get what those points mean. But in essence all of these observations debunk myths that UXD is any one thing among the many parts that might describe it. User experience is both tangible and intangible--it's just exists when people decide to participate in the use of a thing. UX Design is the many parts in a holistic approach to design or enable the use of the thing, and every aspect related to its use.
This is a cool browser-based CSS grid generator created by Rasmus Schultz of mindplay.dk. Lets you quickly set some column, gutter, and margin sizes using forms inputs or button controls. Similarly you can set typography with form controls, and the results are shown on screen. When you're happy, you can bookmark your work, and export the CSS. Sweet.
This the audio and slides from the presentation Chris Fahey gave at SVA's Interaction Design Program series dot dot dot. In this excellent short short talks (16 minutes), Chris talks about sketching and shows plenty of examples from his notebooks. Great series of events that Liz Danzico and company are putting on. Chris will be on the faculty of the MFA program.
This is a major revision to the OmniGraffle Wireframe Shapes that I've been providing at urlgreyhot since OG version 1.x. It's been over a year since the last update to that version. This version adds new elements and is formatted for OG 5.x. You can get it here in the Tools section.
Tog's comparison and analysis of the human computer interaction versus the user experience with both the Amazon Kindle and the iPhone/iPod Touch is excellent. The separation of HCI/UX in his analysis really drives the point home that good interaction and industrial design can make the experience, and a good experience isn't only about the design.
I don't use a Kindle daily, so I can't comment personally on it, but the industrial design was a showstopper for me and kept me from wanting it. Truth be told, though, the kind of books I read are probably better on dead trees. The thing that impressed me most was the mobile connectivity and the screen. But when I held it in my hand and paged through, the buttons kept me paging through accidentally. I think the lack of back light for darkened rooms would also be a let down.
As for the iPhone, I'm not one of those people that dotes on it. Don't get me wrong. It's without a doubt the single most enjoyable device I use daily, and I wouldn't want to be without it. But many of the elements of the experience have frustrated me, and I still won't be convinced that typing on a touchscreen is a step forward from a physical keyboard. The Sidekick spoiled me.
The best part of this article is that step back that tells the story of why we need to take a holistic approach to the product, from the interaction with the interface to every aspect that radiates from the product.
Companies that pay attention to both the mechanics of the interface and the subtleties of the user experience win. Explore websites like Bed, Bath & Beyond and see how good screen design and carefully-plotted user experience come together. Don’t just examine look and feel; set up a shopping scenario and experience every step from thinking about maybe buying a product to selecting it and checking out. Bed, Bath & Beyond has perfected a superior experience in their real-world stores, and they have translated it beautifully into the cyber world.
There are no trade-offs here. Human/machine interaction is a subset of the user experience. Anything done to improve the mechanics of the interface will, by its very nature, improve the overall experience. Anything done to improve the user experience will amplify the good qualities of the human/machine interaction.
You must, however, research and design each of them separately—and to test each of them separately. They each require a specific frame of mind, and concentrating on just one will lead to the kind of uneven design that both the Kindle and the iPhone/iPod Touch have been offering.
And that last part strikes home most. These are separate activities, but require a holistic approach and frame of mind. Investing in research and design on both of them can be seen as either a luxury or a given depending on how and where you work. But the holistic approach ensures a better experience.
Brandon Schauer gives us 9 ideas for experiences whose time has come--the idea being that these are things we can do to create or extend the experience with our businesses because the timing is right. With luck, execution of any of these ideas can turn into real value for businesses and their customers.
Will Evans discusses how he uses wireframes in his design process. The story is one you've probably heard before. It's a description of concept design, using wireframes as the tool for finding the right design. One could use sketching just as well.
He's talking about that path we take as designers to frame the problem for discussion, extrapolate solutions from that discussion, and generate possible solution concepts. He calls his process one of divergence, transformation, and covergence. This maps to a common cycle in design where there is a lot of front-loaded generation of ideas and further and further reduction of solutions as the process unfolds. There's a great diagram in Buxton's Sketching the User Experience on page 146 (based on Pugh's 1990 work, Total Design) which discusses the waves of expanding and contracting generation and reduction that happens as designers find focus. The right design emerges at the end of the process of ideation and selection.
It's interesting to read Evans' description of his thoughts during his design process, as it mirrors what Buxton and Pugh describe. We need to hear more detailed accounts like his, that fill in the picture for other practitioners, and hopefully impress upon some of us different ways for practicing our craft.
Faruk Ateş provides some suggestions for implementing pagination, all of which I would agree with. After the suggestion list, Ateş shows quite a few examples and discusses what's good and bad about them. There's a huge list of examples on Smashing Magazine as well, although some of them are a little fussy.
Oddly enough, while a few of the examples show the method of using an ellipsis plus the last few page numbers as a way to show number of pages, Ateş doesn't count that as a recommended practice.
Here's a screenshot of Flickr using this method. I like Flickr's as an example because it's as straightforward as ou can get with no fuss.
The practice of showing the an ellipsis plus the end pages is one of the pagination conventions I've been using for years and is one I'd add as a more explicit recommendation to the lists above.
Henrik pointed me to Raphaël, a nice JS library for generating interactive charts.
Via tweet from Henrik Lied