it-swarm.com.de

Soll ich diese beiden sich gegenseitig ausschließenden Aktionen kombinieren?

Ich habe eine Schnittstelle zum Verwalten mehrerer E-Mail-Adressen, die einem Konto in meiner Webanwendung zugeordnet sind. Diese Schnittstelle muss von einem Administrator verwendet werden.

Die Benutzeroberfläche zeigt eine Liste der E-Mail-Adressen an und bietet Schaltflächen zum Löschen einer E-Mail-Adresse, zum Festlegen einer E-Mail-Adresse als primäre Adresse und zum Markieren von E-Mail-Adressen als überprüft. Die Funktion E-Mail-Adressen als verifizierte Funktion markieren markiert die E-Mail im System im Wesentlichen als bestätigt, sodass der Benutzer sie verwenden kann. Andernfalls müsste der Benutzer auf einen Link klicken, der an diese E-Mail-Adresse gesendet wurde, um ihn als ihren zu bestätigen.

Eine E-Mail-Adresse muss bestätigt werden, bevor sie zu einer primären Adresse gemacht werden kann. Bisher habe ich mir diese Schnittstelle ausgedacht:

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

Problem: Da eine E-Mail erst nach der Überprüfung primär erstellt werden kann, wird die Schaltfläche "Diese primäre E-Mail erstellen" für die Zeilen 3 und 5 deaktiviert. (Diese E-Mail als primär festlegen und als überprüft markieren, schließen sich gegenseitig aus.).

Sollte ich vor diesem Hintergrund diese beiden Spalten einfach zu einer kombinieren?

mockup

bmml Quelle herunterladen

Ich denke, dieser Ansatz vereinfacht die Benutzeroberfläche ein wenig, was eine gute Sache ist. Der Nachteil ist, dass nicht sofort ersichtlich ist, dass Sie eine E-Mail als verifiziert markieren müssen, bevor Sie sie als primäre E-Mail festlegen können.

Soll ich bei der ersten Schnittstelle bleiben? Gibt es bessere Möglichkeiten, um mit diesem Problem umzugehen?

14
F21

Ihr zweites Modell ist genau richtig. Dieses System besteht aus 3 Elementen: Datensatzname (E-Mail), Statusschalter/-anzeige und eine Aktion (Entfernen/Bearbeiten). Außerdem können die möglichen Status (nicht verifiziert/verifiziert/Standard) nur schrittweise nach oben geändert werden (d. H. Kein Überspringen oder Herabstufen). Daher ist es absolut nicht erforderlich, eine separate Spalte für den Validierungsstatus oder eine primäre E-Mail zu erstellen.

So handhabt GMail ein ähnliches Setup:

enter image description here

In dieser Situation war es sinnvoll, den Überprüfungsstatus nur deshalb von der Überprüfung zu trennen, weil es eine andere Aktion gibt (edit info), der den Raum bereitstellt. Es würde jedoch immer noch funktionieren, wenn die graue Bezeichnung unverified entfernt wird.

Hier ist das gleiche Muster in LinkedIn:

enter image description here

Es ist ziemlich offensichtlich, dass es sehr schwer ist, den Status der E-Mail oder den nächsten Schritt nicht zu verstehen. Bei der Arbeit mit grünen, gelben und roten Farbcodes ist jedoch äußerste Vorsicht geboten, da es für farbenblinde Menschen schwierig sein wird, sie zu erkennen (hier hilft eine unterschiedliche Zeichenfolgenlänge).

8
dnbrv

Ich stimme WebDevelopteer zu, dass es nicht sehr intuitiv ist, verschiedene Kategorien von Dingen in derselben Spalte zu haben. Aber Sie können einen anderen Weg gehen.

Dies ist eine (sehr) schnelle Idee. Wie wäre es, wenn Sie zuerst das Bestätigungssymbol haben und erst, wenn Sie darauf geklickt und überprüft haben, die primäre Auswahl als andere Schaltfläche angezeigt wird?

Die Bestätigungsschaltfläche hätte zwei Zustände: Deaktiviert (grau) oder Aktiviert (wie Schwebeflug). Die primären Schaltflächen haben drei: Unsichtbar, Deaktiviert und Aktiviert (wie Hover).

enter image description here

Sie können mit dem Layout herumspielen, damit es konsistenter aussieht (Spaltenfarben, Rahmen, Schaltflächen).

9
Yisela

Ich bin kein großer Fan von grauem Inhalt, da er den Eindruck erweckt, dass ein Inhalt nicht bearbeitet oder geändert werden kann. Ich würde empfehlen, einen Ansatz zu wählen, bei dem Sie den Benutzern die Flexibilität geben, jede gewünschte E-Mail auszuwählen, sofern diese bereits überprüft wurde (siehe das folgende Modell). Das letzte Radio in diesem Beispiel ist ausgegraut, da die E-Mail nicht überprüft wurde. Sie kann jedoch entfernt werden, falls der Benutzer eine falsche E-Mail eingegeben hat.

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

Bearbeiten 1: Das Modell wurde geändert, sodass nur das Radio deaktiviert aussieht

5
Mervin

Immer irre auf der Seite der Klarheit und und minimiere die Lernfähigkeit. Während Ihr zweites Design schön ist, ist es nicht so intuitiv. Benutzer werden mit zusätzlicher Verwirrung und zusätzlicher kognitiver Belastung frustriert sein.

Da es sinnvoll ist, nachdem Sie die Argumentation und Funktion der Gruppierung verstanden haben, anfangs wäre es ein Hotchpotch für Benutzer. Es ist nicht intuitiv, wenn "primäre E-Mail", "diese primäre E-Mail erstellen" und "Als verifiziert markieren" in derselben Spalte zusammengefasst sind. Und wie Sie bereits betont haben: "Es ist nicht sofort ersichtlich, dass Sie eine E-Mail als verifiziert markieren müssen, bevor Sie sie als primäre E-Mail festlegen können."

Verwenden Sie Ihr erstes Design und deaktivieren Sie diese bestimmten Schaltflächen nicht. Wenn sie deaktiviert sind, wird der Benutzer angewiesen, nicht auf sie zu klicken, aber er weiß nicht warum! Wenn der Benutzer auf sie klickt, informieren Sie ihn stattdessen mit einer Nachricht, dass nur verifizierte E-Mails primär sein können.

0
webdesignux

Eine genaue E-Mail-Überprüfung kann nicht erfolgen, ohne dass der Benutzer auf diesen Link klickt, der an seinen Posteingang gesendet wurde. Entfernen Sie die Überprüfungsschaltflächen und nicht verifizierten E-Mail-Adressen. Stellen Sie sicher, dass die Funktion "Neue E-Mail hinzufügen" auf dieser Seite vorhanden und offensichtlich ist.

0
Darragh

Es könnte funktionieren, wenn Sie die Spalte "Aktion" kennzeichnen, da dies die nächste verfügbare Aktion für diese E-Mail-Adresse ist. Sie sind beide zustandsgesteuerte Aktionen, sodass Sie den Status darstellen und die verfügbaren Aktionen aus diesem Status angeben.

Einige Arbeitsänderungen könnten dies klarer machen - "verifiziert - primär machen" könnte den Prozessablauf klar machen. Ich bin alles dafür, die Benutzeroberfläche zu verkleinern, und ich mag es nicht, wenn sich Informationen persönlich ausschließen. Ich frage "Was kann ich jetzt tun" und "In welchem ​​Zustand befindet sich das?" - das sind verwandte Fragen. Diese Option beantwortet beide in einem kompakten Format.

0