{"id":1549,"date":"2016-11-28T10:40:48","date_gmt":"2016-11-28T09:40:48","guid":{"rendered":"http:\/\/usersnap.com\/de\/blog\/?p=1549"},"modified":"2016-11-28T10:40:48","modified_gmt":"2016-11-28T09:40:48","slug":"usability-nielsen","status":"publish","type":"post","link":"https:\/\/usersnap.com\/de\/blog\/usability-nielsen\/","title":{"rendered":"Jakob Nielsens 10 Prinzipien f\u00fcr Interaktions-Design"},"content":{"rendered":"

Vor \u00fcber zwanzig Jahren hat Jakob Nielsen seine 10 Prinzipien f\u00fcr Interaktions-Design unter dem Titel \u201c10 Usability Heuristics for User Interface Design\u201d formuliert. Wir stellen seine 10 Prinzipien vor und zeigen, wie diese heutzutage umgesetzt werden. Dabei geht es um die Frage: Inwiefern sind Nielsens Prinzipien heute noch relevant? Und was k\u00f6nnen Sie heutzutage noch daraus lernen?<\/p>\n

<\/p>\n

Punkt 1: Das System sollte User mittels Feedback dar\u00fcber informieren, was gerade passiert.<\/h2>\n

Feedback f\u00fcr Ihre User ist ungemein wichtig f\u00fcr eine gute User Erfahrung. Dabei sollte der User nach M\u00f6glichkeit direkt Feedback erhalten, sowohl f\u00fcr erfolgreiche wie fehlerhafte Aktionen.<\/p>\n

Ein Beispiel: Ein User verwendet ein Passwort, das Ihren Passwort-Regeln widerspricht. Hier wird Feedback verlangt, welche Zeichen erlaubt sind, wie lang das Passwort sein muss und welche Elemente (Buchstaben, Zahlen, Sonderzeichen) dieses enthalten muss.<\/p>\n

Oder: Ein User f\u00fchrt eine Anwendung erfolgreich aus. Er sendet z. B. einen Newsletter erfolgreich aus oder plant diesen. Auch hier wird eine Best\u00e4tigung, positives Feedback erwartet. Mailchimp ist darin gro\u00dfartig.<\/p>\n

\"mailchimp\"<\/p>\n

 <\/p>\n

Punkt 2: Gemeinsamkeit zwischen dem System und der realen Welt<\/h2>\n

Nielsen schreibt hier, dass das System die Sprache des Users sprechen soll, mit W\u00f6rtern, S\u00e4tzen und Konzepten, die er auch aus der realen Welt kennt.<\/p>\n

Dies ist absolut wichtig, dass eine Anwendung die Sprache der User spricht.<\/p>\n

Ein negatives Beispiel daf\u00fcr ist, wenn User Nachrichten erhalten, die eigentlich an Entwickler gerichtet sind.<\/p>\n

\"photos-error-message-ios\"<\/p>\n

Auf Design-Ebene gab es diese Ann\u00e4herung auch mit der Bewegung des Skeuomorphismus: Hier wurde das Design realer Gegenst\u00e4nde wie z. B. das eines Taschenrechners in den digitalen Bereich \u00fcbertragen.<\/p>\n

\"skeuomorphic-button-design-website\"<\/p>\n

Inzwischen ist man von skeuomorphistischer Ann\u00e4herung aber eher wieder abgekommen und hin zu einem leichteren, flat design \u00fcbergegangen. Der Grund daf\u00fcr war, dass diese \u00dcbertragung von bekannten Designs noch nichts mit der User Experience zu tun hatte.<\/p>\n

Steve Job hat dazu gesagt:<\/p>\n

\u201cDesign is not just what it looks like and feels like. Design is how it works.\u201d<\/p><\/blockquote>\n

Punkt 3: Kontrolle des Users und Freiheit<\/h2>\n

User machen Fehler. Nielsen schreibt in seinem dritten Punkt von dem Gef\u00fchl der Kontrolle die User haben wollen. Dazu geh\u00f6rt auch eine Vorausplanung, wenn es um Fehler geht. User sollten Aktionen r\u00fcckg\u00e4ngig machen oder neu machen k\u00f6nnen.<\/p>\n

Wenn Sie mehr zu diesem Thema und zum Erstellen guter Fehlermeldungen erfahren wollen, kann ich Ihnen unseren letzten Artikel \u00fcber Fehlermeldungen sehr empfehlen<\/a>.<\/p>\n

\"mobile-screen-error-message\"<\/p>\n

Punkt 4: Konsistenz und Standards<\/h2>\n

F\u00fcr den User ist es wichtig, dass Design-Standards eingehalten werden. User haben bestimmte Erwartungen, wenn Sie auf Ihre Website kommen. Standards helfen Ihren Usern intuitiv zu navigieren. Beispiele daf\u00fcr sind z. B. das Hamburger Men\u00fc oder klickbare Bilder. Die Frage sollte daher immer sein: wie kann ich das, was sich als Standard etabliert hat, einsetzen, um m\u00fcheloses Navigieren zu erleichtern. Auch Design-Neuerungen sind dann am besten, wenn sie mit bereits etablierten Mustern verbunden werden.<\/p>\n

Zu Konsistenz z\u00e4hlt Nielsen aber auch eindeutige Kommunikation. Ihre User sollten sich nicht fragen, ob verschiedene W\u00f6rter das gleiche bedeuten.<\/p>\n

Ein Beispiel daf\u00fcr ist, wenn Sie \u201cSign in\u201d und \u201cSign up\u201d nebeneinander verwenden. Das ist verwirrend f\u00fcr die User.<\/p>\n

\"signin-signup-registration-design\"<\/p>\n

Punkt 5: Fehler Vermeidung<\/h2>\n

Noch besser als gute Fehlermeldung ist, wenn man Fehler direkt verhindern kann. Wichtig daf\u00fcr ist unbedingt klare Kommunikation und Design, dass es Usern schwer macht Fehler zu machen.<\/p>\n

F\u00fcr mehr Informationen dazu, k\u00f6nnen wir Ihnen diesen Artikel zur Fehler-Vermeidung empfehlen. <\/a>\u00a0Hier geht es darum, dass es eigentlich zwei Arten von Fehlern gibt: 1) Fehler, die man aus Versehen macht (Slips) und 2) Fehler, die User machen, wenn sie ein Ziel haben, aber den falschen Weg nehmen. M\u00f6glichkeiten, dies zu verhindern k\u00f6nnen Vorschl\u00e4ge sein, die man dem User macht oder aber indem man bestimmte Aktionen beschr\u00e4nkt oder verhindert.<\/p>\n

Punkt 6. Einfache Anleitung und sichtbare Informationen<\/h2>\n

Nielsen schreibt hier, dass man den User nicht \u00fcberfordern darf oder erwarten kann, dass er sich an Inhalte erinnert. Daher sollten alle notwendigen Informationen sichtbar sein oder einfach zu erhalten.<\/p>\n

Ein Beispiel: Bei Netflix wird angezeigt, welche Inhalte ein User vorher angesehen hat. Damit muss sich dieser nicht an genaue Filmtitel erinnern, sondern sieht eine History.<\/p>\n

Punkt 7: Flexibilit\u00e4t und Effektivit\u00e4t<\/h2>\n

Geben Sie Ihren Usern die M\u00f6glichkeit Abk\u00fcrzungen zu nehmen, damit erreichen Sie sowohl neue und erfahrene User. Geben Sie Ihren Usern die M\u00f6glichkeit, mehr zu lernen oder aber direkt zu der gew\u00fcnschten Aktion zu springen.<\/p>\n

Ein Beispiel:\"press<\/p>\n

Auf unserer eigenen Presse-Seite hat der User zum Beispiel die M\u00f6glichkeit nach unten zu scrollen und sich alle Elemente einzeln anzusehen oder aber direkt – als Shortcut – das gesamte Presse-Kit herunterzuladen.<\/p>\n

Punkt 8: \u00c4sthetik und minimalistisches Design<\/h2>\n

Jedes Element Ihrer Anwendung dient der Kommunikation mit Ihren Usern. Sie kommunizieren \u00fcber Text, Farben, Buttons, Symbole. Jedes kleine Element ist eine kleine \u201cInformationseinheit\u201d, die der User wahrnimmt. Nielsen pl\u00e4diert daher diese Informationen so gering wie m\u00f6glich zu halten, um den User nicht zu \u00fcberfrachten und relevante Inhalte immer noch sichtbar zu machen.<\/p>\n

Minimalismus im Webdesign bedeutet, dass es keine \u00fcberfl\u00fcssigen Elemente gibt – etwas, das schwer durchzuf\u00fchren ist, aber wonach viele Designer streben. Genau wie in minimalistischer Architektur gilt auch im Webdesign: viel Platz, Raum und M\u00f6glichkeit f\u00fcr Details.<\/p>\n

Ein bekanntes Beispiel f\u00fcr minimalistisches Design ist z. B. die Website der TED Talks.<\/p>\n

\"minimal_modern_webdesign_site-02\"<\/p>\n

Punkt 9: Helfen Sie Usern aus Fehlern zu lernen<\/h2>\n

Fehlermeldungen sollten so einfach wie m\u00f6glich gehalten werden und erkl\u00e4ren, worin genau das Problem besteht. Wenn Sie Usern Vorschl\u00e4ge machen, hilft das ihnen aus Fehlern zu lernen.<\/p>\n

\"twitter-example-registration-form-2\"<\/p>\n

Punkt 10: Hilfe und Dokumentation<\/h2>\n

Manchmal ist es notwendig, ausf\u00fchrliche Hilfestellung zu geben. Dies kann z. B. im Rahmen eines Onboardings sein oder aber als Dokumentation zu bestimmten Features oder Aktionen stattfinden.<\/p>\n

Wichtig sind hier konkrete Schritte, die der User einfach ausf\u00fchren kann. FAQs, Live-Chat oder technisches Dokumentationen sind beliebte Instrumente um Benutzer Abhilfe zu leisten und erste Probleme zu l\u00f6sen. Bei komplexen Enterprise-L\u00f6sungen ist es durchaus sinnvoll On-Site Trainings oder Video-Konferenzen durchzuf\u00fchren um so Hilfe und Dokumentation zu gew\u00e4hrleisten.<\/p>\n

Fazit<\/h2>\n

Jakob Nielsen entwickelte seine Prinzipien f\u00fcr \u201cHeuristische Evaluation\u201d in Zusammenarbeit mit Rolf Molich im Jahr 1990. 1995 formulierte er die vorhergehenden 10 Prinzipien.<\/p>\n

Obwohl Nielsens Formulierung seiner Usability Prinzipien schon \u00fcber zwanzig Jahre zur\u00fcck liegt, sind diese doch aktuell und gelten immer noch als best principles, die von Unternehmen weltweit angewandt werden. Zwar \u00e4ndern sich die Mittel, wie diese umgesetzt werden, die Prinzipien von Minimalismus, Fehler Pr\u00e4vention und klarer Kommunikation sind aber universell erhalten.<\/p>\n","protected":false},"excerpt":{"rendered":"

Vor \u00fcber zwanzig Jahren hat Jakob Nielsen seine 10 Prinzipien f\u00fcr Interaktions-Design unter dem Titel \u201c10 Usability Heuristics for User Interface Design\u201d formuliert. Wir stellen seine 10 Prinzipien vor und zeigen, wie diese heutzutage umgesetzt werden. Dabei geht es um die Frage: Inwiefern sind Nielsens Prinzipien heute noch relevant? Und was k\u00f6nnen Sie heutzutage noch […]<\/p>\n","protected":false},"author":2,"featured_media":1559,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[12],"tags":[],"class_list":["post-1549","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-development"],"acf":[],"_links":{"self":[{"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/posts\/1549","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/comments?post=1549"}],"version-history":[{"count":0,"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/posts\/1549\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/media\/1559"}],"wp:attachment":[{"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/media?parent=1549"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/categories?post=1549"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/usersnap.com\/de\/blog\/wp-json\/wp\/v2\/tags?post=1549"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}