de.hideout-lastation.com
Paradies Für Designer Und Entwickler


Vier UX-Designtechniken zur Förderung der Benutzerinteraktion

Die Ermutigung von Nutzern, auf einer Website zu bleiben und diese zu nutzen, beinhaltet nicht immer schlankeren Code oder schönere Grafiken. Einige der einfachsten Layouts, wie Reddit, sorgen dafür, dass die Benutzer mit dem Inhalt vertraut sind, und sind begeistert von der Interaktion mit der Site.

Das Geheimnis liegt in der Nutzererfahrung und der Berücksichtigung der Funktionsweise einer Website . Interaktionen entstehen durch Seitenelemente und Aktionsströme, die sich von einer Seite zur nächsten bewegen.

In diesem Beitrag werde ich einige UX-Designtechniken vorstellen, die angewendet werden können, um die Benutzererfahrung zu verbessern und die Benutzerinteraktion zu erhöhen . Beachten Sie, dass diese nicht immer auf jede Website anwendbar sind und es ist wichtiger zu verstehen, warum diese Techniken funktionieren, so dass Sie Ihr eigenes Urteilsvermögen verwenden können.

Das Thema Benutzererfahrung ist umfangreich und erfordert Geduld, um es vollständig zu verstehen. Aber je mehr du übst, desto mehr wirst du verstehen

Das Beste, was Sie tun können, ist auf den Webseiten herumzuspielen, die Sie mögen und herauszufinden, was Ihnen an ihnen gefällt . Aus Ihren Erfahrungen können Sie konsistente Ideen extrapolieren und herausfinden, was Sie (und vielleicht auch andere) auf einer Website beschäftigt.

1. Verwenden Sie Kontrast, um Aufmerksamkeit zu ziehen

Jede Site ist mit einer Handvoll von Elementen für die Benutzerinteraktion aufgebaut. Hyperlinks, Schaltflächen, Eingabefelder, Sidebar Widgets, die Liste geht weiter und weiter. Aber nicht alle Elemente sollten gleich sein . Einige sind natürlich wichtiger für Besucherinteraktionen und sollten mit einem höheren Kontrast gestaltet werden, um sich von anderen Elementen auf der Seite abzuheben.

Diese Idee stammt von einem hohen Farbkontrast und der Art und Weise, wie Menschen visuelle Daten in Mustern verarbeiten. Wenn sich etwas von seiner Umgebung abhebt, sei es durch Farbe, Größe, Form oder Leerzeichen, kann es aufgrund des Kontexts wichtiger erscheinen.

Verwenden Sie den Kontrast, um auf bestimmte Seitenelemente aufmerksam zu machen, die Besucher in eine bestimmte Aufgabe einbeziehen. Wenn Sie mehr Newsletter-Anmeldungen erstellen möchten, enthält Ihre Abonnement-Box möglicherweise eine hell animierte Anmeldeschaltfläche oder ein eindeutiges Vektorsymbol.

Das Ziel ist es, Aufmerksamkeit zu erregen, indem eine Schnittstelle aufgebaut wird, die Besucher dazu verleitet, bestimmte gewünschte Aktionen durchzuführen.

Wenn Sie Zeit haben, sollten Sie vielleicht ein paar A / B-Fallstudien durchführen, um zu sehen, welche Farben / Elemente am besten zusammenspielen. Statistiken sind schwer zu bestimmen, aber Sie werden überrascht sein, wie viel von einem einfachen Split-Test gelernt werden kann.

2. Geschmackvolle UI / UX Animation

Ich bin kürzlich auf einen Beitrag mit dem Titel Was ist Disney über Interface Animation wissen. Es behandelt die wesentlichen Punkte der Animation und wie diese sich auf die Psyche der Benutzer auswirken, die mit einem flachen 2D-Bildschirm interagieren.

Verschiedene Arten von Animationen können bestimmte Verhaltensweisen implizieren. Wenn Sie beispielsweise den Mauszeiger über eine Schaltfläche bewegen, springt sie möglicherweise nach oben, um anzuzeigen, dass sie anklickbar ist. Fehlermeldungen schütteln oft, um die Aufmerksamkeit des Benutzers auf sich zu ziehen.

Denken Sie daran, dass die UX-Animation sichtbar und dennoch subtil sein sollte . Wilder Over-the-Top-Animationen sind eher für TV und Filme als Schnittstellen.

Aber das bedeutet nicht, dass Ihre Schnittstellen flach bleiben sollten. In der Tat würden die meisten Benutzer lieber irgendeine Art von Animation haben, weil sie die Illusion einer glatteren Erfahrung vermittelt. Beim digitalen Design geht es teilweise darum , ein illusorisches Interface zu erstellen, aber je realistischer es aussieht, desto mehr werden Ihre Benutzer interagieren wollen.

3. Responsive Design als Voraussetzung

Es ist fair zu sagen, dass ein guter Teil der Internetnutzer von ihren Mobiltelefonen aus surft. Links, die mit sozialen Seiten wie Facebook und Twitter geteilt werden, werden oft direkt auf Smartphones und Tablet-Geräten besucht.

Das bedeutet, dass jede Website in irgendeiner Weise für Mobilgeräte optimiert werden sollte - vorzugsweise mit einem vollständig ansprechenden Design.

Wenn Sie sich Gedanken über die Bildschirmgröße machen müssen, werden kritische Funktionen in einem völlig neuen Licht erscheinen . Als Designer müssen Sie entscheiden, welche Funktionen am wichtigsten sind und wie sie auf kleineren Bildschirmen erscheinen sollen. Diese responsive Design-Strategie braucht Zeit, um zu lernen, aber der beste Weg ist, andere Websites zu studieren und Techniken auszuwählen, die Sie mögen.

Die Wahrheit ist Responsive Design funktioniert und es wird von der Design-Community mit jedem Jahr mehr akzeptiert.

Benutzer erwarten außerdem, dass Websites vollständig reagieren, sodass sie auf jeden Gerätebildschirm ausgerichtet sind. Wenn eine Website nicht gut in einen mobilen Webbrowser passt, kann sie für den Benutzer unangenehm sein.

4. Vereinfachen Sie den Interaktionsprozess

Smashing Magazine hat kürzlich einen der besten Posts veröffentlicht, die ich gelesen habe, um die Vereinfachung des Interface-Designs zu unterstützen . Es besagt, dass niemand durch Reifen springen möchte, um Ihre Website oder Anwendung zu verwenden. Die Leute sind nur am Endergebnis interessiert und am schnellsten dorthin zu gelangen .

Ich möchte gerne UX-Flowcharts für jedes interaktive Seitenelement erstellen, wenn ich Drahtmodelle skizziere. Diese helfen visuell zu verstehen, wie die Site aussehen und funktionieren soll.

Aber in Wahrheit spielt es keine Rolle, wie Sie die Erfahrung planen. Seien Sie sicher, dass Sie eine möglichst schnelle und einfache Erfahrung planen. Wenn es darum geht, Aktivitäten anzuregen, sollten Sie die wichtigen Dinge durch das Design impliziert haben .

Wenn jemand auf Ihrer Webanwendung landet und nicht versteht, wie man sich sofort anmeldet, ist das ein großes Problem. Es sollte für den Benutzer offensichtlich offensichtlich sein, was Ihre Site macht und wie sie davon getrennt sein kann.

Der beste Ausgangspunkt ist die Erforschung des UX-Designs und der Prozess, wie Benutzer mit einer Schnittstelle interagieren. Von dort können Sie Schlüsse ziehen, die für Ihre eigenen Projekte relevant sind und Ihre Schnittstellen ideal zu ihrem größten Potential vereinfachen.

Weitere Informationen zum Thema Benutzeraktivität finden Sie in den folgenden Posts:

  • Breaking Web Design Konventionen = Breaking der Benutzererfahrung
  • Usability- und User Experience-Archive auf Smashing Magazine
  • Web-Design-Konzepte, um Benutzerinteraktion zu locken

Einpacken

Es gibt keine einheitliche Antwort darauf, wie Websites gestaltet (oder repariert) werden, um die Benutzerfreundlichkeit zu verbessern. Ja, es gibt einige Dinge, die Sie ausprobieren können, aber jede Seite ist etwas anders und das Studium von UX-Design ist sehr kompliziert.

Ich hoffe, dass dieser Artikel Sie dazu bringen kann, über einige gebräuchliche Techniken zum Aufbau von höchst brauchbaren Interfaces nachzudenken. Das Beste, was Sie tun können, ist, sich in die Lage eines typischen Benutzers zu versetzen und zu versuchen, die Hauptfehler einer Schnittstelle zu erkennen. Und wenn Sie ein Problem erkannt haben, sind Sie bereits auf halbem Wege zur Lösung!

40 erstaunliche colorized historische Fotos, die Sie nicht verpassen sollten

40 erstaunliche colorized historische Fotos, die Sie nicht verpassen sollten

Wenn ich mir ein altes Schwarz-Weiß-Foto anschaue, kann ich nicht anders, als mich zu fragen, wie es war, in dieser Ära zu leben. Ich würde mir auch vorstellen, wie das Foto ausgesehen hätte, wenn es Farben hätte ; Würde das dem Foto eine ganz andere Stimmung geben?Dank der Fortschritte der Fotobearbeitung in den letzten Jahren können wir nun sehen, wie Schwarz-Weiß-Fotos wahrscheinlich aussehen würden, wenn sie in Farbe aufgenommen würden, durch eine Technik, die als Foto-Farbgebung bezeichnet wird. Es ist b

(Tech- und Design-Tipps)

Der definitive Leitfaden zu CSS-Pseudoklassen

Der definitive Leitfaden zu CSS-Pseudoklassen

Ob Sie ein Anfänger oder ein erfahrener CSS-Entwickler sind, Sie haben wahrscheinlich schon von Pseudo-Klassen gehört . Die bekannteste Pseudo-Klasse ist wahrscheinlich :hover, mit dem wir ein Element :hover, wenn es sich im Hover-Zustand befindet, dh wenn ein Zeigergerät, wie eine Maus, darauf zeigt.Na

(Tech- und Design-Tipps)