Click for larger image.

Reasons to like it:

• Shows both % of the day spent sleeping, as well as exact hours.
• Adds iris/pupil patterns of the various eyes.
• Evokes the concept of sleep with the “eyelid” sleep indicator.
• Includes our species for context.
• Provides information about the subjects used (all adults, all except humans in captivity).
• Sorts from least to most to increase ease of comprehension. Of course, the issue here is not whether it’s done in descending or ascending order, just that order makes it more intuitive.

The only change I might make would be to combine the lines of text at the top and bottom, but this may be driven by a style standard. In any case, it’s a small issue, and doesn’t hurt the clarity of the graphic.

In the pre-caller ID era, a woman has missed a call. She recently had new phones and service set up, and a phone technician visiting tells her to dial a code to get the number she missed. She dials the code, hears the number, and immediately says, “So you don’t get the name, then?” In other words, she’s just been told about a useful new service she didn’t even know existed, and already she’s disappointed and has an improvement.

This is one of the many reasons I don’t believe in pixel-perfect design. UX is about constantly reaching for perfection, not settling back and presuming you’ve accomplished it. The moment “perfect” UX encounters a user, the user and the environment change in response to it, and “perfect” needs to evolve.

Google gets this. Geek.com reports that Google+ is already responding to user critiques and feedback.

You may think Google could sit back and watch the Google+ network grow, but that would be a mistake. The search company has realized it can’t just watch what happens, it needs to respond to users quickly in order to keep them happy and the network growing.

Nice to see they’re not resting on their laurels. Intelligent designers evolve ;–)

P.S. Thanks to Shannon Brown for sharing the link—on Google+, of course!

Too many social media-based sites, including many social networks, provide only lip service to how users think about groups, let alone user privacy empowerment. A user is seen as one of their members, and the business creates a mental model in which the user is the center of a series of widening circles. “Empowerment” of user content privacy is typically limited to enabling permissions control within those circles.

Users don’t see themselves that way. People think of sharing information in terms of a constantly changing algorithm of need, purpose, and ability. We trust some friends more closely than others; we have acquaintances who know a great deal about us whom we barely know. It’s my belief that these clashing mental models are one of the primary reasons social media and social networks fail to engage.

Click for larger image.

Some examples of groups which don’t fit the standard business mold:

• Trusted acquaintances. To get a job, we may need to share detailed background information with people we barely know but must trust out of necessity: human resources, drug testing representatives, recruiters. We also share a great deal with doctors, literally putting our lives and health in their hands, without knowing them very well.
• Interest-based friends. We have friends with whom we choose to share everything, but we frequently have friends with whom we limit sharing to specific interests. Colleagues and fellow hobbyists are examples.
• Family. These people know a great deal about us simply because of frequent close contact, which typically leads to close bonding and sharing. But as with interest-based friends, we may prefer to share some things, not all.
• Unknown people. In a world in which job-hunting is becoming a lifestyle, people are sharing for an audience they don’t know yet. Potential employers, recruiters, customers, and business partners are often deliberately targeted by job-hunters.
• Untrustworthy people. These may be ex-spouses, stalkers, etc. Some social networks allows you to block specific users, but many do not, and most sites which employ social media to enhance their business do not.

Natural grouping also allows sites to make the most of niche parts of their audience. Too many times I’ve seen sites imagine the majority of their users to be their primary audience, neglecting more highly focused and engaged groups. These long tail segments of the audience were typically grouped more narrowly, and interacted between themselves much more highly than the generic larger groups, but were neglected because of their size. My recommendation in this situation? Don’t neglect smaller active segments, learn from them. Enabling natural grouping allows the larger, generic audience to begin to sort itself into smaller, more actively engaged segments. In other words, don’t cut off your long tail to spite your site.

A few sites have allowed natural grouping, with great success. Back in 2003, before Facebook even existed, LiveJournal introduced easy-to-create custom friend groups to control content privacy. For example, my custom groups include writer friends, fellow techies, female friends, specific users, and more. LiveJournal also allows users to filter their friend content according to these groups. It’s more than a blog, it’s a social writing platform. This, along with a highly usable interface and solid branding, creates an experience that still commands a great deal of loyalty from a strong user base. It’s not Facebook, but it was never meant to be.

Google+ is likewise not Facebook. Nona Aronowitz at GOOD observes,

I see Google+ as serving a completely different function. Facebook and Twitter can mobilize, organize, and disseminate information. It can and will continue to help journalists, politicians, and activists do their work. But sometimes you just want to hang with your friends, and when that can’t happen in real life, something like Google+ could be the next best thing.

Users are constantly tweaking their output—what they say, what they share online, what they do—to optimize their personal experience of the world. Designing for this provides a more natural way of interacting with others online. Online social networking shouldn’t have to be the end of privacy, or limited to artificially preset circles; it can be an extension of our normal behavior. Herzfeld and Google+ get that.

P.S. Since late 2008 I’ve been advocating natural grouping, empowering users to control access to themselves by their own purposes and needs. Some of the above was shared in a 2009 presentation, Designing for purpose.

Dash, A. Blog. Twitter.

Ong, J., 28 June 2011. Google gave original Mac designer free rein on new Google+ UI, AppleInsider.

Now imagine a robust web app. This site would work across most if not all browser and devices, “gracefully degrading” when necessary. It would be usable, useful, and user-friendly, fulfilling the promise of site for the user. Bugs would be a rare event.

After reading Nassim Taleb’s antifragility discussion on Edge’s World Question Center, I think we can do better. As Taleb envisions it, an antifragile system is one that is “beyond robustness,” one that not only withstands disorder and change, but loves those things. Taleb provides an example:

Just as a package sent by mail can bear a stamp “fragile”, “breakable” or “handle with care”, consider the exact opposite: a package that has stamped on it “please mishandle” or “please handle carelessly”. The contents of such package are not just unbreakable, impervious to shocks, but have something more than that, as they tend to benefit from shocks.

So let us coin the appellation “antifragile” for anything that, on average, …benefits from variability.

In this and following posts, I’m going to discuss what the characteristics of an anti-fragile web app might look like. These include (but are not necessarily limited to):

• A self-refining interface. The more browsers, devices, and user preferences it’s exposed to, the better it can refine itself, and predict or suggest the ideal UI for a given user with a given browser or device.
• Self-refining taxonomy. A content strategy that benefits from variety and size. I’m convinced that in the post-Google, post-UX, post-social media world, semantic information management in all forms will be the next big thing. (Note: by post-Google, post-UX, etc., I don’t mean a world existing without those things. Rather, I mean the world that has thoroughly incorporated these and similar game-changing concepts and is ready to grow from there.)
• Simplicity of structure, allowing flexibility of response.
• Loves change. Learns from being used for new and unexpected purposes, adapting the new ability or use to improve or expand existing features.
• The broader and more varied the audience, the more information there is to develop targeted content and interfaces.

Self-refining interface

What on earth is a self-refining interface? A self-refining interface is one that adjusts itself to user needs, either at an aggregate or individual level. Ideally it would do both.

Today we have a plethora of interfaces with which to browse the web. Notepads, smart phones, PDAs, laptops, televisions and more are used to present online information. There are even a few awkward-looking wristwatches receiving online updates, heralding the arrival of the smart gadget. The Pew Internet & American Life Project reports a sharp increase in adults using mobile devices to access the internet, as well as other online activities. Cell phone ownership is stable, but using phones for purposes other than phone calls is going up, up, up.

This marks the beginning of the end of pixel-perfect web design. No longer is there a single fold, above which content cues should reside; no longer can a company focus solely on meeting their audience’s needs by designing for the top three browsers across the top two computer operating systems. Graceful degradation is going the way of the dodo. Instead, we need evolutionary designs, adaptable to a variety of niches.

Companies who have already focused on this typically seek to determine the device being used by a particular user, then serve them content optimized for that device. Unfortunately, with the broad variety of devices in use, it’s difficult to accommodate all of them. Alternatively, they offer a “mobile” or “text-only” link, optimized for users with low bandwidth or smaller mobile devices. Again, we have only a couple of optimizations, and as user trends change, the developers behind a given web application or site must run to keep up.

Built-in design adaptability might work in many cases. For example, a combination of incrementally sized, wrapping modules and liquid layout could flexibly accommodate both broader and shorter resolutions (the Xoom’s resolution, for example, is 1280 x 800). Navigation could be persistent, but fly out on mouseover. Tricky to do, but not impossible. There is no “graceful degradation” because all resolutions are intended to happen. But this is merely robust.

What if the web application itself took this optimization a step further? Imagine these scenarios:

A site that actively analyzes user system demographics and develops UI and navigation options for a variety of interfaces; users can select their preferred default. Depending on the intelligence of the system, these could be based on persona types, or actually customized on a user-by-user basis.

Proactively personalized interface preferences. Based on a user’s interaction behavior, the site infers their content and navigational preferences and presents or suggests an interface matching those. Do they like clicking on tags? Perhaps a tag cloud-driven navigation should be integrated into their UI.

To be honest, I’m not certain what a truly antifragile user experience would look like. But I know we’ll never get there if we don’t think about it; and thinking about it will bring us more robust UX along the way.

Taleb, Nassim M. (2011). Antifragility—or—The Property Of Disorder-Loving Systems. The Edge Question 2011. Accessed 17 January 2011.

This specialization is a good work model, not least because it allows designers to be true experts in interaction, branding, etc. (Please note: I’m not arguing that either the specialist approach, or the shared roles—developer/UI/IA—approach, is better. Both have excellent advantages in different situations.) Such designers do not typically think of themselves as coders.

But they frequently are.

Many UI designers, particularly in the corporate world, work with a style guide. They frequently drive it, as style guides establish a visual language for the site. In the same way that someone flipping channels can frequently tell a CSI scene from a Law & Order scene without looking up the show title, the visual language of a site should set it apart as itself.

The style guide helps designers and coders do that. It’s a shared reference, in which the designers establish the visual and interaction requirements, and the developers create CSS styles to invoke those requirements on the page. This is where designers become coders.

Why does this matter? Because the tags a designer chooses become the code the developer uses, and the semantic impact of them goes beyond the visual interaction. Among other things, the semantic nature of code affects how it’s parsed by search bots, and how accessible it is to the visually impaired and other disabled users.

Designer-driven code happens in two ways:

specs

After designing interactions, creating comps, and obtaining buy-in from stakeholders or clients, there comes a point when a designer looks upon her work and knows that it is good. To ensure that it stays good when it gets translated into code, the designer then creates specs for the developers, frequently using a style guide to pick the appropriate tag or style for a given need.

It’s at this point that the designer becomes a de facto coder. Again, the tags a designer chooses become the code the developer uses. In this situation, designers must be careful to use the appropriate tag/style for the appropriate need. Header tags should be used for headers, and organized top to bottom—not used to create a visual distinction in non-header copy. If a designer chooses a header (H1-H6) tag for a visual style, the developer nests the copy within that tag, regardless of whether the content is a header or not.

So designers must be aware that when they use a header, or blockquote, or definition tag, they are telling the browser, bots, and other applications specific information about that content. Remembering this when creating specs helps considerably in producing semantic, searchable, accessible code. This should not be a burden to designers, particularly since organizational tags are limited but text styles are infinite.

creating the guide

Style guides are created in a variety of ways. Sometimes it’s a collaboration between development and design to create an entirely new brand from scratch, in which case it’s easy to develop a semantically sound guide. Sometimes it’s driven by design, and created by developers.

Sometimes it’s captured from an existing site, in which styles may or may not be semantically sound. For example, I worked in one place where header tags were viewed primarily as visual tools, and the same page might have five different H1 tags in five different styles, depending on the CSS-styled area of the page they were used. In such cases, developing a semantic style guide is more than simply changing a mindset, it’s a complex, large undertaking.

Semantically sound code makes sense. It’s easier to train new designers on it, easier to maintain as your site evolves, and sets your site apart to search bots as a more well-organized, user-friendly, likely-to-be-relevant source of content. Designers who are aware of the effect their styling instructions have on semantics will not only be better “coders,” they will be more valuable designers to their clients or employers—and most importantly, create better user experience for their audience.

Previously I wrote about what this said regarding the range of experience UX designers could leverage to engage users (UX happens everywhere).  But there’s more behind this statement than the observation that where a person’s attention goes, there goes their experience of the world. There’s an ethical responsibility implicit there as well.

What and how we attend to things matters to our quality of life. Psychologists, medical doctors, and Buddhists have known this for some time (Buddhists have known it a bit longer). Focused attention is used in mindfulness-based stress reduction programs for cancer patients; an excessive level of difficulty in maintaining focus is a diagnosable disorder; “right mindfulness” is part of the Buddha’s Eightfold Path. The very process of therapy involves drawing attention to specific patterns of behavior.

But attention isn’t the whole story. If William James is correct, then experience involves not just attention, but an agreement to attend. When a user agrees to give us (UX architects) some of their attention, they are in effect agreeing to make us a small part of their experience of the world. They are allowing us to have an effect on their quality of life, small or large depending on what our product or service is.

As the other half of that agreement, we enter into an unspoken contract with users to make that experience worth their while.

Where a person’s attention goes, there goes their experience of the world. In other words, UX happens everywhere.

Your product may be the ultimate experience you want your users to have, and your web site experience may help get them to purchase it (or be the goal itself, if you’re a social network or some other online service). But long before they land on your site or purchase your product, every interaction of the user with your brand is UX.

What people say about your product on social networks or blogs, your advertising (online and off), how your competitors represent you and your service. Your content lives everywhere, and your existing users and prospects can potentially encounter it everywhere. You can’t control this, but you can add to the milieu in a variety of ways: blogs, forums, social networks, videos, mobile applications, gadgets, rich media advertising, news, and choosing to advertise on more targeted sites.

Why does this matter? Because people make decisions in an all-or-nothing manner. Neurologically speaking, every encounter creates a positive or negative moments in a user’s head—a yes/no binary decision. A user’s overall impression comes from the preponderance of the individual binary choices associated with a concept.

Further, in the absence of knowledge most people tend to go with whatever information gets in first with the most. In this way informational cascades are spread across a population which may or may not be accurate. (This may be why car salespeople are trained to get customers to say “yes” more than once, and to speak to more than one salesperson. You can read more about binary decision making and informational cascades in The tyranny of dichotomy.)

If you expect users to “agree to attend” to ultimately experience your product, one way is to create more positive binary moments about your brand and product than there are negative ones. Every encounter with your brand weights a user’s interest in one direction or another. As UX strategists, it’s clearly in our interests as UX strategists to create positive user experiences in every relevant context possible.

Try it with these:

• Semantic extraction, Texas Instruments RFID news
• Semantic extraction, Freudian dream interpretation

Why does this matter? Because as search engines and other information trawlers grapple with more and more content, the ability to parse and understand that content continues to become more and more important.

[Cross-posted from the alexfiles, my personal blog.]

• Accurate – watching a bar fill up gradually only to chug to a halt at around 90% can infuriate all but the most Zen. Worse still on the hair ripping scale are bars that fill up, only to empty and begin anew!
• Responsive and smooth – the bar should be updated regularly to show that things are still working. This means that, on the web, we should update progress bars via Ajax rather than hefty page reloads. Research shows that a linear, consistent progress increase is better than the bar jerking around like a malfunctioning robot dancer.
• Precise – the bar should show an estimate of time remaining, and perhaps other data such as percent or file size remaining so the user knows if he or she should start any long books in the interim.
• Appropriate – before using a progress bar, consider carefully whether it is appropriate, both in terms of User Experience and technical feasibility.

I’d expand on this, and add that the progress bar is useful beyond the completion of a software task, but for personal accomplishments; “Am I there yet?” moments, if you will. For example, the LinkedIn progress bar prompts profile completeness.

The progress bar is actually a game element, which triggers the twin desires to both complete and compete. It’s invaluable in educational, social media, and other contexts. Like Seth Priebatsch of SCVNGR said, “Humans love progress bars. If you see a progress bar, you want to complete it.”

The same requirements apply that Davies suggests, but the nature of the progression dynamic changes. So, instead of time remaining, the user may have tasks remaining, or user-generated content, or a certain amount of time using the application or exploring the site. These progress bar milestones can themselves incorporate game elements, becoming a quest for users for which progress bar completion is only one of many rewards.

Apart from games themselves, game mechanics (or gamification) have been primarily used in the educational field, although it’s been spreading through interaction design since the nineties. Those interested in exploring the field, a good start is Clark Aldrich, a true guru at designing “serious games” and simulations.

Related post: Fun is Fundamental.

I was therefore glad to see Francisco Inchauste’s well-thought, longer version of Einstein’s “as simple as possible, but no simpler” remark.

From the column:

As an interactive designer, my first instinct is to simplify things. There is beauty in a clean and functional interface. But through experience I’ve found that sometimes I can’t remove every piece of complexity in an application. The complexity may be unavoidably inherent to the workflow and tasks that need to be performed, or in the density of the information that needs to present. By balancing complexity and what the user needs, I have been able to continue to create successful user experiences.

Plus, as I’ve commented before, messy is fun!

• Inchauste, F. The dirtiest word in UX: complexity. UX Magazine, 6 July 2008.