background preloader

First Principles of Interaction Design

First Principles of Interaction Design
The following principles are fundamental to the design and implementation of effective interfaces, whether for traditional GUI environments, the web, mobile devices, wearables, or Internet-connected smart devices. Help! This is a huge revision. I expect I have made mistakes. This revision features new examples and discussion involving mobile, wearables, and Internet-connected smart devices. What has changed greatly is the level of detail: You will find many new sub-principles within each category, along with far more explanation, case studies, and examples. Previous Version & Its Translations. Introduction Effective interfaces are visually apparent and forgiving, instilling in their users a sense of control. Because an application or service appears on the web or mobile device, the principles do not change. I Love Apple, But It’s Not Perfect I’ve used many example drawn from Apple products here, often as examples of bad interface practices. Aesthetics Top Anticipation Autonomy Color Consistency Related:  Design PrinciplesWeb Design

Ergonomie web illustrée The Design of Everyday Things Book Review Donald A. Norman When I set off to write a book review I try to make the review itself valuable even if the reader doesn’t end up reading the book by taking and explaining some of the more interesting and useful ideas. The Design of Everyday Things makes this task very difficult because of the sheer amount of concepts and their interconnectedness that Norman presents. Even though the book was first published in 1988 and so focuses more on the design of physical things like water faucets, doors and clocks, the ideas presented are directly applicable today in the design of software interfaces and websites. The book was originally titled “The Psychology of Everyday Things”, with the word ‘psychology’ later swapped for ‘design’. Who is guilty? There is a running theme throughout the book that deals with blame; more specifically, who is to blame for misuse, misunderstanding or errors when using everyday (and not everyday) objects and devices? What are they thinking? Natural Mapping

user advocacy and human-centered design Published 1986 (re-issued 2002). 2013 revised edition. The Design of Everyday Things (DOET) was first published in 1988. The book is about how people interact with technology. The principles of interaction are mostly unchanged -- they still apply today. But the technology is very different. I did a thorough revision. The revised and expanded paperback will be available November 5. Even the smartest among us can feel inept as we fail to figure out which light switch or oven burner to turn on, or whether to push, pull, or slide a door. Buy from Amazon.com Sample chapters and miscellany Balsamiq. Rapid, effective and fun wireframing software. | Balsamiq 10 Heuristics for User Interface Design #1: Visibility of system status The system should always keep users informed about what is going on, through appropriate feedback within reasonable time. (Read full article on visibility of system status and watch 3 min. video on the visibility heuristic.) #2: Match between system and the real world The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order. (Read full article on the match between the system and the real world and watch 3 min. video on the real-world heuristic.) #3: User control and freedom Users often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. (Watch 2-min. video on the user control heuristic.) #4: Consistency and standards #5: Error prevention (Read full article on preventing user errors.) See Also

Designing for the Next Step There are two things that every designed screen must do well: describe the current step and describe the next step. It’s as simple…and hard…as that. In a recent post (Why you should bury the sign up button) I told the story of a redesign I did in which people just didn’t want to click the “sign up” button on the home page, no matter how beautiful or sexy that sign up button was. Here’s another example. I ask you to notice several things about this: It’s an offer about money. Well, even though I’ve read the Times online for years I have no idea what a “digital subscription” is. A Straight-forward Fix The design solution to this is relatively straight-forward. The first piece of missing information is my current status as a New York Times reader. The second piece of missing information is the difference between where I’m currently at and where I could be…what exactly is being offered here? Remember that comparison is how people make decisions. Designing for the Next Step Currently working on:

Persuasive Navigation The web professional's online magazine of choice. In: Columns > IAnything Goes By Jeff Lash Published on December 17, 2002 Persuasive navigation is navigation that persuades a user to do something. Persuasive navigation is one aspect of a site built on persuasive architecture. Persuasive navigation vs. calls to action On many sites, regular navigation is supplemented by calls to action that will hopefully get the user to follow a particular navigation path. A call to action tells users to do something—Apply Now, Find Out More, Buy This, Sign Up Now—whereas persuasive navigation gives people a reason to do something. A call to action is generally considered outside of the navigation framework, since it is supplemental to the primary navigation. The phrase “call to action” implies that the site is placing a call to the users and that they need to answer it. Putting persuasion to use Once the power of persuasion is understood, it is time to put it to use. “ The easy answer: Money.

Use a single word space between sentences “In the nineteenth century, which was a dark and inflationary age in typography and type design, many compositors were encouraged to stuff extra space between sentences. Generations of twentieth century typists were then taught to do the same, by hitting the spacebar twice after every period [full stop]. Your typing as well as your typesetting will benefit from unlearning this quaint Victorian habit. All white space in HTML, in any combination of spaces, tabs or line breaks, is automatically collapsed to a single word space. If you do need to insert more than a single word space between sentences, or any other characters, then use one of the many space characters available in Unicode.   en space   em space   3-per-em space   4-per-em space   6-per-em space   figure space   punctuation space   thin space   hair space Another method would be to apply the white-space:pre property in CSS to retain the white space formatting.

BJ Fogg's Behavior Model Open Source Document Management Solutions Writte Share the article! Content Management Systems (CMS) have always been a nebulous term. That’s one reason that I’ve never included this category in my reviews of Java open source projects. One of the primary features of a CMS is its support for Repository services. Here’s the list of “Document Repository” implementations that I have found: DSpace Federation – DSpace is a digital library system to capture, store, index, preserve, and redistribute the intellectual output in digital formats. Take note that I moved several entries from “Knowledge Management (KM)“.

Related: