Über visuelles Design und Interaktionsdesign
<br />Im gesamten Produktdesignprozess liegen die „Prozesse“ des visuellen Designs und des Interaktionsdesigns sehr nahe beieinander, und die Beziehung zwischen beiden ist komplementär und beeinflusst sich gegenseitig. Wie kann man den Benutzern das interaktive Design als direkteste Ebene der Kommunikation mit Benutzern in guter Form präsentieren? Hier konzentrieren wir uns hauptsächlich auf die Rolle des Sehens bei der Verbesserung der Benutzerfreundlichkeit der Interaktion:
1. Verbessern Sie das Surfen: 1) Gute Leistung der Informationsstruktur. Um die Interaktion zu unterstützen, muss das visuelle Design zunächst die Darstellung des Produkts und der interaktiven Informationsstruktur, die Klarheit und Lesbarkeit der Informationen und dann die Kommunikation von Marke und Emotionen erfüllen. Visuelle Sprache kann Produktkonzepte und Informationen durch Schichtung, Klassifizierung, Vergleich und andere Sprachmittel verarbeiten. Beispiel:  Bild 01  Bild 02 Wenn ich die beiden obigen Bilder vergleiche (bei beiden handelt es sich um Artikeldetailseiten), glaube ich, dass nicht viele Benutzer schnell und genau erkennen können, welche Informationen die Website ihnen geben möchte oder was sie tun sollen, wenn sie pic01 durchsuchen. Die Verteilung der Informationen, die Hierarchie und die Farben sind nicht effektiv, was bei den Benutzern Verwirrung und Orientierungslosigkeit hervorruft. Pic02 unterteilt den Inhalt in wichtige und unwichtige Abschnitte, sodass die wichtigsten Artikeldetails klar ersichtlich sind und die Struktur übersichtlich und klar ist. Wir spüren den wirkungsvollen Einsatz visueller Sprache, die bei der Darstellung von Informationsstrukturen eine große Hilfe sein kann. Vorherige Seite 1 2 3 4 Nächste Seite Gesamten Artikel lesen |
<<: Unterschiede und Anwendungsbeispiele von for, for...in, for...of und forEach in JS
>>: Detaillierte Codebeispiele zu sieben Methoden zur vertikalen Zentrierung mit CSS
Artikel empfehlen
js realisiert den Lupeneffekt von Produkten auf Einkaufswebsites
In diesem Artikel wird der spezifische Code von j...
So zeigen Sie in CocosCreator eine Textur an der Wischposition an
Inhaltsverzeichnis 1. Projektanforderungen 2. Dok...
Detaillierte Erklärung gängiger Befehle im Docker-Repository
Einloggen Docker-Anmeldung Schließen Sie die Regi...
Einführung in die CSS-Technologie zur automatischen Farbanpassung von Vordergrund und Hintergrund (Demo)
1. Vorschau des Farbabstimmungseffekts Wie im GIF...
Ideen zum Erstellen von Welleneffekten mit CSS
Zuvor habe ich mehrere Möglichkeiten vorgestellt,...
Zusammenfassung der MySQL-Indexkenntnisse
Die Einrichtung eines MySQL-Index ist für den eff...
Nutzungsszenarien und Quellcodeanalyse der Funktionskomponenten erweiterter Vue-Komponenten
Inhaltsverzeichnis einführen Anwendungsszenarien ...
Reines CSS, um eine horizontale Linienanimation unter dem Element (Hintergrundbild) zu erreichen
Effektbild: html: <div class='site_bar'...
Der Unterschied zwischen Animation und Übergang
Der Unterschied zwischen CSS3-Animation und JS-An...
Vorbereitung der Vue Element-Front-End-Anwendungsentwicklung für die Entwicklungsumgebung
Inhaltsverzeichnis Überblick 1. Entwickeln Sie di...
Probleme beim Ändern des Passworts und beim Herstellen einer Verbindung zu Navicat bei der Installation und Verwendung von MySQL 8.0.16 unter Windows 7
Bei der Installation von MySQL sind mir mehrere P...
Optimierung der Leistung von Paging-Abfragen für MySQL mit mehreren zehn Millionen Daten
Wenn die Datenmenge in MySQL groß ist, wird die S...
Was bedeuten CN2, GIA, CIA, BGP und IPLC?
Was ist die CN2-Linie? CN2 steht für China Teleco...
Methode zum Vergleichen der Größe von Varchar-Typnummern in einer MySQL-Datenbank
Erstellen einer Testtabelle -- ------------------...
Analyse der prinzipiellen Implementierung aus dem Quellcode des Mini-Programm-Entwicklertools
Inhaltsverzeichnis So zeigen Sie den Quellcode de...