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
Le catalogue chanté des 25 JOURS AUCHAN 10 Heuristics for User Interface Design Download a free poster of Jakob’s 10 Usability Heuristics at the bottom of this article. #1: Visibility of system status The design should always keep users informed about what is going on, through appropriate feedback within a reasonable amount of time. When users know the current system status, they learn the outcome of their prior interactions and determine next steps. Predictable interactions create trust in the product as well as the brand. #2: Match between system and the real world The design should speak the users' language. The way you should design depends very much on your specific users. When a design’s controls follow real-world conventions and correspond to desired outcomes (called natural mapping), it’s easier for users to learn and remember how the interface works. #3: User control and freedom Users often perform actions by mistake. When it's easy for people to back out of a process or undo an action, it fosters a sense of freedom and confidence. #4: Consistency and standards
Star Wars en réalité augmentée Cette série de photographies peintures, réalisée par Christian Waggoner bluffera à coup sûr tous les fans de Star Wars. L’artiste s’est concentré sur le casque de ces personnages emblématiques de la saga, ainsi que sur les reflets dans la visière de chacun d’entre eux, pour offrir un résultat final ultra-réaliste. Fidèle au scénario, Waggoner a même fait se refléter le visage de Han Solo dans celui de Greedo, celui de Mace Windu pour Jango Fett ou encore celui de Luke face à son père lors du combat mythique dans L’Empire contre-attaque. Un Maître de la peinture qu’on n’égalera pas de Sithôt.
L’expérience utilisateur expliquée en infographie | weXperience L’expérience utilisateur est une notion complexe qu’il est parfois difficile d’expliquer avec des mots. Nous devons souvent recourir à des moyens détournées (métaphores, images) pour montrer son importance dans l’optimisation de sites. Heureusement pour nous de bons designers d’information s’appliquent à expliquer l’expérience utilisateur sous des formes visuelles. Stéphane Brossard compare l’expérience utilisateur à une course d’athlète. Selon Jess McMullin, l’expérience utilisateur est un cycle en 9 étapes. Au moyen de cette roue, Magnus Revang rassemble les éléments qui composent la notion d’expérience utilisateur. Sans doute l’infographie la plus complète sur la notion d’expérience utilisateur.
The Dark Side Of User Experience – There Are Some Right Bastard Companies Out There It’s always a balancing act between creating best experience for the user and achieving business objectives, but there are some companies who go straight for your wallet and brush you aside like some cheap whore. Dark Patterns is a brilliant look into the evil side of design, UX decisions that can’t simply be put down to errors of judgement and poor design skills – no this shit is far, far more sinister. Quite simply, these well known companies are trying to screw people in one way or another. Take a look at the Ryan Air example in the slides and how they put the option to opt-out of insurance half way down the list of countries! Other examples of those practising this dark art include Moneysupermarket and Go Compare. Each type of evilness has a name, there’s dozens including: Don’t forget mobile has its own set of Dark Patterns too - Remember the Crazy Frog ringtone? Oh and what about Android? The scary thing is that this is just getting started.
Pourquoi les agences d'ergonomie web devraient toujours travailler avec un rédacteur Pourquoi les agences d'ergonomie web devraient toujours travailler avec un rédacteur La scène se passe chez un client, un matin à Paris, dans des bureaux spacieux et clairs : "Voilà, nous avons fini les maquettes et maintenant nous vous avons contacté pour rédiger les textes ! – Merci de votre confiance, je suis ravie d'être là ! – Silence... et bien il faudrait leur demander exactement. – Ok. – A vrai dire, je ne sais pas exactement. – Ah oui, je vois. – C'est une bonne question. – Et là, ce serait bien de réassurer les internautes par rapport à la manière dont va se dérouler la commande, une fois qu'ils auront acheté le produit. – Oui, c'est vrai. – Oui, je vois, c'est un problème. – Oui. – Bon ce n'est pas grave, j'ai l'habitude. – Peut-être, oui." Je vous le demande : pourquoi persister fin 2010 à laisser du lorem ipsum sur les maquettes web ? La structure d'un article ou d'une page web créée pour valoriser le sujet, l'information, c'est fondamental.
Ubimédia I | Papier Millimétré Qu’est ce que l’ubimédia ? Pour définir l’ubimédia, trois articles y sont consacrés sur Papier Millimétré pour décrire l’ensemble de l’historique de cette notion depuis la genèse de l’informatique ubiquitaire à la fin des années 80 jusqu’aux projets récemment sortis dans les métropoles du monde entier. - Partie 1 Ubimédia I : Genèse de l’informatique ubiquitaire - Partie 2 Ubimédia II : Evolution du domaine et création du terme Ubimédia (article à venir) - Partie 3 Ubimédia III : Exemples et applications (article à venir) Même si cette partie ne parle pas de l’ubimédia proprement dit, il est intéressant de connaître et de comprendre le passé de ce domaine pour en découvrir les bases fondamentales . Partie 1 : Genèse de l’informatique ubiquitaire Il y a presque vingt ans, en 1991, Tim BERNERS inventa le World Wide Web. Les premiers écrits Dès 1988, Mark WEISER était le chef scientifique du Xerox PARC (Palo Alto Research Center). Schéma 1 : Les trois ères de l’informatique selon Mark Weiser
Content Strategy, IA, UX or SEO: What’s My Problem? With a growing number of ambiguous ‘solutions’ made available by web consultants, it can be difficult for a website owner – who can see that her website isn’t achieving it’s potential, but doesn’t know why – to identify the core issues and find relevant help. At Contentini we’re fans of data, evidence and an analytical approach. Although problem solving often requires breadth of knowledge and depth of experience, we’ve just started to investigate how different types of website issues could be automatically identified be examining standard web analytics data. These are our first published thoughts on the topic, which we hope you’ll add your comments to and help progress to the next iteration. Information Architecture Problem Description Information Architecture (or IA) defines the structure and relationship of your website content and pages. Symptoms High ‘pages per visitor’ combined with low ‘average time per page’ or low ‘time on site’High bounce rate, especially on the home page
Actualité à la Une Is Yahoo Shutting Down Del.icio.us? [Update: Yes] For a couple of days now, we’ve been hearing rumors that the Yahoo layoffs included the entire Delicious team. Now Former Yahoo employee and Upcoming founder Andy Baio has tweeted out the above Yahoo! product team meeting slide that seems to show that Yahoo! is either closing or merging the social bookmarking service as well as Upcoming, Fire Eagle, MyBlogLog and others. In some kind of weird founder solidarity, the slide was originally posted on Twitter by MyBlogLog founder Eric Marcoullier. Listed under the ominous “Sunset” are: Delicious, Altavista, MyBlogLog, Yahoo! Under “Merge” are: Upcoming, FoxyTunes, Sideline, FireEagle, Yahoo Events and Yahoo People Search. It also looks like sundry Yahoo properties like Yahoo Deals and Yahoo Calendar will be made into features. Delicious, MyBlogLog and Upcoming have been somewhat neglected since being acquired by Yahoo and founders Joshua Schachter, Marcoullier and Baio have all moved on to do other (more successful) things.