it-swarm.com.de

Lassen Sie Benutzer die Einheit eines Werts neben dem Werteingabefeld auswählen

In unserer Anwendung können Benutzer/Entwickler ihre eigenen Weblayouts über den Editor erstellen. Daher müssen sie Containergrößen entweder mit Prozent (%) oder Pixel (px) definieren. Derzeit kann diese Auswahl im Eingabefeld getroffen werden. Ich wusste das erst, als mir ein Mitarbeiter davon erzählte - die Platzierung der Einheitenauswahl im Eingabefeld war für mich einfach nicht offensichtlich und für neue Benutzer schwer zu erlernen.

Aktuelle Lösung:

(enter image description here

Ich habe zwei alternative Lösungen gefunden:

(1) Wählen Sie die Werteinheit über den Umschalter

(2) Wählen Sie die Einheit des Werts per Dropdown

(enter image description here

Ein Nachteil, den ich kenne, ist, dass das Formular unübersichtlicher aussieht.

Welche Erfahrungen haben Sie mit solchen Anwendungsfällen gemacht? Was denken Sie über diese Alternativen?

12
Fabian Kuenzli

Idealerweise sollte Ihr Feld beide Einheiten in allen Kombinationen akzeptieren:

10px, 10 px, 10%, 10% -> alles sollte funktionieren; Sie können jedoch eine Inline-Validierung hinzufügen

Anschließend können Sie am Anfang des Formulars oder mit jedem Feld einen kurzen erläuternden Text hinzufügen, je nach Ihren Zielen.

Ich schlage vor, inkrementelle Pfeile im Zahlenfeld auszublenden (sie sind sowieso zu klein - siehe Fitts Gesetz). Ihre Felder können auch gekürzt werden, da die Eingabe maximal 10 Symbole umfasst.

Teilen Sie die zugehörigen Eingaben nach Gruppen auf und überlegen Sie zweimal, bevor Sie das zweispaltige Layout in Form bringen.

Dropdowns und Toggle Suck würde ich sagen.

(no dropdowns or toggles

8
Runnick
  1. Gute Standardeinstellungen. Behalten Sie als Standard das hauptsächlich verwendete Gerät bei.
  2. Schalter funktionieren nicht, man kann nicht schnell erkennen, welcher eingeschaltet und welcher ausgeschaltet ist.
  3. Im aktuellen Setup können Sie nicht wissen, dass es andere Optionen gibt. Nichts sagt dir "Hey, du kannst hier für andere Optionen klicken"

Ich würde mit Dropdowns gehen. Jeder weiß, wie man sie benutzt und sie arbeiten. Sie sind vielleicht nicht so hübsch, aber sie funktionieren.

8
Bobby Tables

(1) der Kippschalter:

  • +1 Zum Umschalten ist nur ein Klick erforderlich
  • -1 Es sieht etwas chaotisch aus, wenn verschiedene Einheiten ausgewählt werden.
  • -1 Möglicherweise sind einige Benutzer verwirrt, welches Gerät derzeit als grau oder weiß ausgewählt ist.

(2) Dropdown:

  • +1 Es sieht sauber aus und ist beabsichtigt.
  • -1 Sie müssen zwei Aktionen ausführen: Zielen und klicken Sie auf die Dropdown-Liste, klicken Sie auf die gewünschte Einheit

(3) Tastenumschalter: Eine einfache Taste, die die aktuelle Einheit anzeigt. Wenn gedrückt, wechselt es zur anderen Einheit.

(enter image description here

  • +1 Keine Auf/Ab-Taste
  • +1 Es sieht sauber aus und ist beabsichtigt.
  • +1 Zum Umschalten des Geräts ist nur ein Klick erforderlich
4
Chriss

Ein Problem bei der Verwendung von Dropdown- oder Umschalttasten besteht darin, dass der Benutzer einen Wert eingibt, der für das neue Gerät nicht gültig ist.

Zum Beispiel gibt der Benutzer Folgendes ein:

Width: 800 [px]

und wechselt zu Prozent:

Width: 800 [%]

Sie können den Wert automatisch auf 0% zurücksetzen. Wenn der Benutzer jedoch wieder zu px wechselt, hat er die zuvor eingegebenen 800 verloren.

Verwenden Sie für jeden Wert eine andere Eingabe und möglicherweise auch für dieses Szenario eine andere Art der Eingabe. Ein Vorschlag ist ein Bereichsschieberegler für die prozentuale Eingabe (möglicherweise möchten Sie dem Benutzer dennoch die Möglichkeit geben, einen Wert einzugeben).

3
Alvaro

Wenn Sie eine Funktion zur Verwendung des Einheitentyps auf Feldebene bereitstellen, können Sie die Wiederholung dieser Elemente nur vermeiden, wenn Sie daran denken, sie beim Mouseover anzuzeigen.

Betrachten Sie das Formular oben; Ich denke, Sie sollten die Option auf Formularebene beibehalten, damit der Benutzer entweder px oder% für das gesamte Formular verwendet. Machen Sie eine kleine Recherche darüber, welche Einheiten die Benutzer am häufigsten verwenden, und behalten Sie sie als Standard bei und geben Sie dann einen Link/eine Schaltfläche über dem Formular an zwischen den Einheiten wechseln:

(enter image description here

Nach meiner Erfahrung verhält sich die prozentuale Einheit in verschiedenen Browsern unterschiedlich. Daher gehe ich davon aus, dass der oben erwähnte Benutzertyp Pixel auswählt.

2
DPS

Da die Dropdown-Option hierfür am meisten bevorzugt wird, zeigt beispielsweise Adobe Photoshop -> Neues Dokumentfenster die Auswahl Breite/Höhe mit dem Dropdown-Menü Einheit wie folgt an. (enter image description here

Wenn der Benutzer eine Einheit für wenige Werte auswählen möchte, können Sie die Werte kategorisieren und ein allgemeines Dropdown-Menü für die Auswahl der Einheit bereitstellen. Auf diese Weise reicht es aus, dem Benutzer eine Texteingabe zu geben, um den Wert einzugeben, da das Gerät bereits eingestellt wurde.

0
NPN