Analyse des Produktstatus im interaktiven Design, der im Design nicht ignoriert werden kann

Beim Produktdesign legen Designer Wert darauf, dass die Bilder sehr schön aussehen. Beim Erstellen des Inhalts der virtuellen Seite verwenden sie schöne Bilder und ordnen den Inhalt genau richtig an. Bei der Erstellung der Schnittstellendemo ist diese Seite jedoch möglicherweise leer oder weist sehr viele Inhalte auf, was zu einem falsch ausgerichteten Layout führt.
Daher dürfen Sie beim Entwurf einer Schnittstelle extreme Zustände wie leere Zustände und zu viel Inhalt nicht ignorieren. Diese Zustände können möglicherweise nur bei der ersten Verwendung und nur bei einer kleinen Anzahl von Benutzern auftreten, sie wirken sich jedoch alle auf die Detailqualität des Produkts aus.
Um die Benutzeroberfläche möglichst realistisch zu gestalten, platzieren Designer beim Erstellen interaktiver oder visueller Entwürfe einige virtuelle Inhalte auf der Seite. Aber wenn Designer die von Front-End-Studenten erstellten Demos sehen, fragen sie sich immer, warum sie so anders sind als die Seite, die ich am Anfang erstellt habe.
Leerer Zustand: Wenn Benutzer manche Produkte zum ersten Mal verwenden, stoßen sie häufig auf eine Benutzeroberfläche mit leerem Inhalt. Dies gilt insbesondere für Social-Internet-Produkte, bei denen Benutzer selbst Kreise erstellen und Inhalte generieren müssen. Zu diesem Zeitpunkt wird normalerweise ein Leitfaden für Anfänger verwendet, um den Benutzer zum nächsten Schritt zu führen.
Interaktionsdesign-Analyse: Produktstatus, der im Design nicht ignoriert werden kann 123WORDPRESS.COM

Interaktionsdesign-Analyse: Produktstatus, der im Design nicht ignoriert werden kann 123WORDPRESS.COM

Wenn Benutzer beispielsweise Foursquare zum ersten Mal verwenden, werden sie durch das Hinzufügen von Freunden angeleitet. Um die Suche nach Freunden zu erleichtern, können sie auch Freunde von Facebook, Gmail und Twitter importieren.

Wenn Sie noch keine Artikel auf Facebook geschrieben haben, erhalten Sie auch Anleitungen zum Schreiben und Veröffentlichen neuer Artikel.

Ebenso verfolgt Flickr einen geführten Bedienungsansatz, um den Benutzern ihren aktuellen Status klar mitzuteilen und ihnen mitzuteilen, was sie als Nächstes tun sollten.

Gmail verwendet zur Benutzerführung die Methode des Sendens von E-Mails, sodass Benutzer ihre erste Benutzererfahrung abschließen können, während sie die Anweisungen für Neueinsteiger lesen.

Tumblr verwendet leere Zustände, um die wichtigsten Funktionsbereiche der Benutzeroberfläche zu erklären. Benutzer müssen nicht wissen, was sie als Nächstes tun sollen. Sie können Follower hinzufügen, Inhalte veröffentlichen oder Ihre Homepage dekorieren. Dies soll den Benutzern auch einen schnellen Einstieg ermöglichen.
Der Zustand bei zu vielen Inhalten Die Oberfläche von Internet-Produkten sollte erweiterbar sein, um die Inhalte flexibel verändern und erweitern zu können. Informationen zu spezifischen Methoden finden Sie in einem anderen Artikel „Flexible und skalierbare Schnittstelle“.

<<: Zwei einfache Beispiele für Menünavigationsleisten

>>: Vue erhält Token zur Implementierung des Beispielcodes für die Token-Anmeldung

Einführung in die MIME-Kodierung (integriert aus Online-Informationen und praktischen Erfahrungen)

Analyse des Produktstatus im interaktiven Design, der im Design nicht ignoriert werden kann

Einführung in die MIME-Kodierung (integriert aus Online-Informationen und praktischen Erfahrungen)

Analyse der Protokolldateien im Tomcat-Protokollverzeichnis (Zusammenfassung)

Details zur Verwendung des Vue-Slots

So drucken Sie hervorgehobenen Code in der Node.JS-Konsole

Detaillierte Erklärung von as, Fragezeichen und Ausrufezeichen in Typescript

Dieser Artikel zeigt Ihnen, wie Sie mit CSS-Rahmen spielen

Zusammenfassung der gebräuchlichen Buchstaben in Unicode

Der Browser der Betaversion IE9 unterstützt HTML5/CSS3

Einfaches Beispiel für die Verschönerung von HTML-Kontrollkästchen und -Radios

Detaillierte Analyse des React Native-Startvorgangs

Artikel empfehlen

Grafisches Tutorial zur Installation und Konfiguration von MySQL 8.0.11 und MacOS 10.13

4 Möglichkeiten, mit CSS ein zweispaltiges Layout mit fester linker Spalte und adaptiver rechter Spalte zu erreichen

Analyse des MySQL-Sperrmechanismus und der Verwendung

Die Verbindung zwischen JavaScript und TypeScript

CentOS 7.x Docker verwendet die Overlay2-Speichermethode

JavaScript-Singleton-Modus zum Implementieren benutzerdefinierter Popup-Fenster

Installieren Sie eine virtuelle Python-Umgebung in Ubuntu 18.04

So verwenden Sie Vue+ElementUI Tree

Tutorial zum Erstellen eines CA-Zertifikats unter Linux Centos8

Detaillierte Erklärung des Hash-Jump-Prinzips von Vue

Empfehlen Sie mehrere MySQL-bezogene Tools

Verwendung und Analyse des Mysql Explain-Befehls

CSS3 + HTML5 + JS realisiert den Schrumpf- und Expansionsanimationseffekt eines Blocks

Beispielcode zur Implementierung einer Upload-Komponente mit Vue3

Zusammenfassung der MySQL InnoDB-Sperren