it-swarm.com.de

Blinkende, springende und blinkende Elemente

Ich bin verantwortlich für die UI/UX in einem Softwareentwicklungsunternehmen.

Während meiner Abwesenheit haben einige Entwickler beschlossen, einen "Bounce" -Effekt auf eine Schaltfläche einer Website zu implementieren, die ihrer Meinung nach besser sichtbar sein sollte.

Grundsätzlich wird dieser Knopf alle 10 Sekunden springen und Ihre Aufmerksamkeit auf sich ziehen. Die Schaltfläche zeigt auf den Hilfeinhalt der Software.

Ich bin normalerweise gegen aufdringliche und nervige Animationen, aber ich würde gerne mehr über dieses Thema erfahren. Ich persönlich denke, dass diese Lösung sehr aufdringlich und ablenkend ist.

Wie soll ich mit Blink-, Bouncing-, Rotations- und Zoomeffekten umgehen? Gibt es Best Practices?

17
Rdpi

In meinem Buch dürfen alle Animationen von Steuerelementen nur durch Benutzeraktionen ausgelöst werden. Beispielsweise können in großen Formularen oder Vollbild-Workflows Animationen als zusätzliche visuelle Hinweise für den nächsten Schritt verwendet werden, sobald etwas abgeschlossen ist. If This Than That (ifttt.com) ist hier ein gutes Beispiel - die Seite scrollt automatisch zum nächsten Schritt, wenn Sie auf Next klicken.

Zufällige Animationen lenken Benutzer von der aktuellen Aufgabe ab und unterbrechen ihren mentalen Fluss . Dies betrifft insbesondere Elemente, die keinen Einfluss auf den Workflow der jeweiligen Aufgabe haben (wie die Hilfeschaltfläche in Ihrem Beispiel).

28
dnbrv

Wie JoJo in den Kommentaren sagte, stimmt etwas grundlegend nicht, wenn Sie Ihre Benutzer auf eine Schaltfläche aufmerksam machen müssen, die auf das Hilfesystem verweist. Die Tatsache, dass Sie einen prominenten Button haben - nicht nur einen Link -, um Seiten zu helfen, ist ein Hinweis auf Probleme in der Benutzererfahrung, und die Tatsache, dass jemand der Meinung ist, dass er prominenter sein muss - wackeln wie ein Teenager, der Ritalin - zeigt an, dass irgendwo etwas kritisch kaputt ist.

In Bezug auf die umfassendere Frage ist Ja-Bewegung ein gültiger Aufmerksamkeitsgreifer - ich habe in einem Fall einen Augenzwinkern-Knopf implementiert, um etwas Aufmerksamkeit darauf zu lenken. Das Problem der Bannerblindheit ist hier jedoch von entscheidender Bedeutung. Die meisten normalen Webbenutzer gehen davon aus, dass ein Wackelknopf eine Anzeige ist, und klicken Sie daher nicht darauf. Gleiches gilt für viele "clevere" Animationstechniken - sie mögen sehr gut und angemessen sein, aber die Benutzer erwarten, dass sie für etwas werben müssen.

IMO, wo ein gültiger und geeigneter Link zur Unterstützung - oder vielmehr weitere relevante Informationen zur jeweiligen Aufgabe - hervorgehoben werden muss, eine andere Farbe oder Größe verwendet oder sogar die Farbe kurz geändert wird, ist wahrscheinlich besser für den Zweck geeignet.

5

Ich stimme dnbrv größtenteils zu, aber ich denke, es gibt vielleicht einen Platz für nicht ausgelöste Animationen, wenn die Persönlichkeit des Produkts "lebendig" oder frenetisch und unkontrolliert ist. Möglicherweise haben Sie in einem animierten Kinderbuch eine Schaltfläche für die nächste Seite, die aussieht, als würde sie atmen oder zucken, wenn dies für die Szene angemessen ist, oder auf einer Website für eine Kinderspielshow, die viel hektische Bewegung und Ablenkung beinhaltet. In diesen Fällen kann es nicht vom mentalen Fluss ablenken, da es tatsächlich den Umgebungscharakter des Produkts erhöht. Ich würde es jedoch mit ziemlicher Sicherheit nicht auf einen Hilfeknopf setzen, außer vielleicht einem kleinen, subtilen Zucken, wenn es einen guten Grund zu der Annahme gibt, dass der Benutzer stecken bleibt und es andere Aspekte der Benutzeroberfläche gibt Persönlichkeit - nicht einmal alle 10 Sekunden.

4
Pam G

Lassen Sie es zumindest nicht mehr herumspringen, nachdem der Benutzer einmal darauf geklickt hat. Es gibt Benutzern die Möglichkeit, es zu stoppen, wenn es sie ablenkt.

Obwohl ich mir nicht vorstellen kann, dass der Hilfeinhalt so wichtig ist, dass jeder darauf klicken müsste. Wenn es etwas gibt, das jeder lesen muss, warum nicht einfach direkt auf die Seite setzen?

3
Jaco Briers

Es hängt alles ab. Ich kann mir ein Szenario vorstellen, in dem ein leicht springender Knopf angebracht sein kann.

Es gibt drei grundlegende psychologische Mechanismen, die helfen können, die Aufmerksamkeit auf ein bestimmtes UI-Element zu lenken:

  • plötzliche Bewegung
  • kontrast
  • größe

Wir sind uns der letzten beiden bewusst ... warum nicht in einigen Fällen die erste verwenden?

Welches ist das Richtige für Ihren Fall? Dies ist sowohl für qualitative als auch für quantitative Tests eine Frage. Ich würde es nicht nur aufgrund von Annahmen und Stereotypen ablehnen.

2
marcintreder

um die obigen Antworten zu ergänzen, können animierte UI-Elemente diskret sein! Ich habe Paul Boags Podcast darüber angehört, wie Boagworlds fast nicht wahrnehmbare CSS-Animationen verwendet, und fand den Podcast ziemlich interessant

1
jonathan