it-swarm.com.de

Wie kann man einen Knopf drehen, um ihn zu erhöhen?

Ich mache eine App mit einem Skeumorph-Knopf, den Sie im und gegen den Uhrzeigersinn drehen können, um einen Betrag zu erhöhen/zu verringern.

Aber welche Richtung ist die richtige? Ich wette, dass es einen hohen Grad an kulturellen Unterschieden zwischen Ländern/Regionen gibt und einen hohen Grad an Unterschieden je nach Nutzungskontext.

Ich lebe in Dänemark und "alle" gängigen Heizkörper haben einen Knopf zum Erhöhen der Hitze - Sie müssen ihn gegen den Uhrzeigersinn drehen, um die Hitze zu erhöhen. Dies könnte nur eine Heizkörper-Sache oder nur eine Dänemark-Sache sein.

Nehmen wir an, die App, die ich mache, steuert einen Heizkörper über WLAN. Soll ich der lokalen Norm folgen oder mich einfach für einen "richtigen" globalen Weg entscheiden ...?

82
astalabandi

Ich bin mir nicht sicher, ob es einen kulturellen Unterschied gibt, sondern einen mechanischen Unterschied. Kühlerthermostate sind Ventilmechanismen, die durch Schrauben im Uhrzeigersinn angezogen und durch Schrauben gegen den Uhrzeigersinn gelöst werden. Das heißt, Sie lösen das Ventil, indem Sie es gegen den Uhrzeigersinn drehen, damit mehr heißes Wasser in den Kühler gelangt.

Knöpfe und Wählscheiben an elektrischen Geräten (zum Ändern von Lautstärke, Zeit, Geschwindigkeit usw.) arbeiten fast universell in die entgegengesetzte Richtung und drehen sich im Uhrzeigersinn, um einen Wert zu erhöhen, und gegen den Uhrzeigersinn, um einen Wert zu verringern. Diese Zunahme/Abnahme wird typischerweise visuell auf einer linearen Skala von links nach rechts, niedrigster Wert bis höchster Wert dargestellt.

Elektrische Thermostatsteuerungen, einschließlich der alten und der modernen digitalen und App-basierten Thermostate, folgen in der Regel der elektrischen (gegen den Uhrzeigersinn/links, um die Wärme zu verringern, im Uhrzeigersinn/rechts, um die Wärme zu erhöhen).

197
Matt Obee

Ich denke, die direkten Antworten auf Ihre Frage werden von den anderen abgedeckt, aber es kann nützlich sein, dem Benutzer einen visuellen Hinweis zu geben. Zum Beispiel haben Sie in einer Autoheizung eine visuelle Anzeige von Änderungen, wenn sich der Knopf bewegt.

Car Temp Knob

Eine alternative Lösung könnte darin bestehen, einen vertikalen Schieberegler/Schaltflächen zu verwenden, bei denen ein deutlicheres Erhöhen der Temperatur bedeutet.

153
Christophe

Eine gute Sache, die Sie hier nutzen können, ist die Zahlenreihe . Die Zahlenreihe nimmt fast universell von links nach rechts zu. Sie können diese Analogie verwenden, um Ihrem Benutzer eindeutig zu zeigen, wie Sie die Menge des „Dings“, mit dem sich Ihre Anwendung befasst, erhöhen oder verringern können.

Drehknopf

Das Problem mit einem Drehknopf (von nun an das Tap-Modell) ist, dass Sie die Zahlenlinie mit der Mitte nach oben oder unten biegen können, was zu der Mehrdeutigkeit führt, die Ihre Frage zu lösen versucht. (knobs with center up and down turn opposite directions for "plus"

Ein weiteres Problem mit dem Tap-Modell ist, dass es mit einer Maus sehr schwer zu bedienen ist.

Linearer Knopf (*)

(photo of sliders on audio mixer

Eine Option, die sowohl intuitiv als auch einfach mit der Maus zu bedienen ist, ist die lineare Schaltfläche zum Erhöhen und Verringern (von nun an das Soundmixer-Modell). Denken Sie an den Windows Sound Volume Controller.

(Windows volume control vertical track bar

Mit einem horizontalen Linienknopf haben Sie die Möglichkeit, die Zahlenlinie direkt zu nutzen.

Verwenden Sie einen vertikalen Linienknopf , und Sie können die Tatsache ausnutzen, dass “ up ”kann mit“ more ”und“ down verknüpft werden ”Mit“ weniger ”. Sie können jedoch immer eine Seitenleiste haben, in der ( + ) oder ( - ); 0,1,2,…, 10; -5, -4,…, 0,…, 4,5; um Ihrem Benutzer objektiv zu zeigen, wie Sie das, was Sie steuern möchten, erhöhen/verringern können (ein rechteckiges Dreieck, das in Plusrichtung dicker wird, funktioniert ebenfalls).

(Vertical and horizontal track bars

Für einen skeumorphischen Knopf hängt es wirklich davon ab, welche Art von „Ding“ gesteuert werden soll.

Die meisten „materiellen“ Flüssigkeiten arbeiten mit dem Hahnmodell.

Für elektrische oder ähnliche Dinge wurden jedoch beide Optionen in der realen Welt verwendet, daher können Sie in diesem Fall einen linearen skeumorphischen Knopf haben.

Dennoch kann eine Option zum Einstellen von Dingen immer in die Hände des Benutzers gelegt werden. Die Lösung, die ich gebe, sollte grundsätzlich nur als Standard verwendet werden.

[~ # ~] ps [~ # ~] : Möglicherweise möchten Sie in den Ländern, in denen von rechts nach links geschrieben wird, nach der Zahlenreihe suchen (wie Arabisch) oder Auf-Ab-Schreiben (wie Chinesisch), um zu sehen, ob es eine andere Art der Interpretation gibt. Diese Probleme können jedoch mithilfe der Globalisierungsklassen des Betriebssystems behoben und automatisch die Standardeinstellung für die zunehmende/abnehmende Richtung festgelegt werden.


(*): In Visual Studio wird es als Spurleiste bezeichnet. in vielen anderen Dingen ist es ein Schieberegler (aus dem Kommentar von wizzwizz4).


[~ # ~] edit [~ # ~] : Für mechanische oder in diesem Fall thermische Maschinen können Sie einen Hebel als skeumorphischen Knopf und verwenden Nutzen Sie die zweite Option.

21
J. Manuel

Ich glaube, Sie können den Knopf visuell erstellen, wie Sie möchten, ohne die Benutzer zu verwirren, indem Sie ein gemeinsames Bewegungsmuster erstellen. Die meiste Audioproduktionssoftware, die ich verwendet habe (dh die Art von Software, bei der Sie oft viele Regler haben, die viele Dinge tun und die in Bezug auf den Bildschirmplatz einfach außer Kontrolle geraten, wenn sie alle lange Schieberegler wären). hat einfach "hoch" und "runter" für Knöpfe. Sie klicken oder drücken auf den Knopf, und dann ist das Aufwärtsbewegen eine Zunahme und das Abwärtsbewegen eine Abnahme. Zu diesem Zeitpunkt spielt die Richtung, in die sich der visuelle Knopf dreht, keine Rolle. Die Benutzer wissen nur, bewegen Sie sich nach oben, um zu erhöhen und nach unten, um zu verringern:

(Softtube Tape Effect Plugin

Bildquelle

Die größten Vorteile dieses Ansatzes sind, dass es sich um eine natürlichere Bewegung handelt, die mit einer Maus oder einem Finger ausgeführt werden kann, und dass sie sehr häufig vorkommt. Jeder Software-Synthesizer, den ich jemals verwendet habe, verwendet dieses Muster und es wird wahrscheinlich für Ihre Benutzer unabhängig davon intuitiv sein von welcher Art von Knöpfen sie im wirklichen Leben gewohnt sind.

Um sicher zu gehen, sollten Sie als Teil des Trailers oder des ersten Tutorials der App eine Videodemonstration der Regler (wie das obige GIF) in Betracht ziehen, damit Benutzer im Voraus wissen, dass sie linear gleiten sollten, anstatt dies zu versuchen Drehen Sie tatsächlich die Knöpfe.

13
wavemode

Einige Konventionen werden von lokalen Gepflogenheiten beeinflusst, andere können sich auf ein Feld oder ein Framework beziehen.

Im Bereich der Mathematik wird beispielsweise der Drehung gegen den Uhrzeigersinn eine positive Richtung zugewiesen, und die negative Richtung ist die Richtung im Uhrzeigersinn. Wenn Ihre App den Winkel eines Teleskops steuern würde, sollten Sie diese Konvention befolgen.

(In the field of mathematics and physics, counterclockwise rotation is positive and clockwise rotation is negative

In drei Dimensionen wird die positive Richtung durch die Richtung der Achse senkrecht zur Rotationsebene angegeben.

(enter image description here

Diese Konvention tritt auch häufig auf, wenn Ihre Anwendung mit Sensoren wie den in Smartphones verwendeten Gyroskopen arbeitet.

Sensor.TYPE_GYROSCOPE :

Alle Werte sind im Bogenmaß/Sekunde angegeben und messen die Rotationsgeschwindigkeit um die lokale X-, Y- und Z-Achse des Geräts. Das Koordinatensystem ist das gleiche wie für den Beschleunigungssensor. Die Drehung ist gegen den Uhrzeigersinn positiv. Das heißt, ein Beobachter, der von einer positiven Position auf der x-, y- oder z-Achse auf ein Gerät schaut, das auf dem Ursprung positioniert ist, würde eine positive Drehung melden, wenn sich das Gerät scheinbar gegen den Uhrzeigersinn dreht. Beachten Sie, dass dies die mathematische Standarddefinition der positiven Rotation ist und nicht mit der zuvor angegebenen Definition der Rolle übereinstimmt.

Dieser Rat ist in erster Linie für wissenschaftliche/technische Anwendungen gedacht. In allen Fällen sollten Sie prüfen, ob es bereits eine vorherrschende Konvention für ähnliche Anwendungen gibt. Zum Beispiel ist die vorherrschende Konvention für Thermostate im Uhrzeigersinn = heißer. Für die Temperaturregelung würde ich diese Konvention wahrscheinlich auch in wissenschaftlichen Anwendungen befolgen.

8
Scott Lawson

Es gibt Unterschiede auf der ganzen Welt - hier in Großbritannien nehmen wir im Allgemeinen eine Zunahme der Bewegung im Uhrzeigersinn wahr, während in Dänemark, wie Sie bereits betont haben, das Gegenteil der Fall ist.

Wenn Sie etwas für ein internationales Publikum erstellen (oder etwas, das irgendwann für ein internationales Publikum freigegeben wird), sollten Sie in Ordnung sein, wenn Sie sicherstellen, dass klare verbale und nonverbale Hinweise vorhanden sind, die zeigen, was beim Wählen passieren wird Wird gedreht. Dies kann leicht mit einer Skala und Symbolen erfolgen.

BEARBEITEN Nach einer Notiz von @MattObee (siehe Kommentare unten) Es kann durchaus sein, dass das Paradigma immer noch im Uhrzeigersinn erhöht werden muss, aber dass der zu erhöhende Wert nicht dem entspricht, was Sie denken. In diesem Fall kann eher die Dichtheit des Ventils als die Temperatur ansteigen.

3
Andrew Martin

Sprechen Sie streng aus der Perspektive der Benutzererfahrung: Denken Sie nur daran, wie Menschen Radios verwenden (oder, wenn Sie älter sind als ich, ihre Fernseher).

  • Im Uhrzeigersinn erhöht sich die Lautstärke und der Sender wird auf höhere Zahlen oder Frequenzen eingestellt.

  • Gegen den Uhrzeigersinn wird die Lautstärke verringert oder der Sender auf niedrigere Zahlen oder Frequenzen zurückgesetzt.

Das ist es, was die Menschen am meisten erwarten.

Flüssigkeits- und Gasventile unterscheiden sich vermutlich im Kontext. Ich habe noch nie jemanden gefragt, warum ein Wasserventil den Durchfluss verringert, wenn es im Uhrzeigersinn gedreht wird, und ein Radioknopf die Lautstärke erhöht, wenn es im Uhrzeigersinn gedreht wird oder digitale Welt, wir denken nie an Mechanismen wie Ventile.

Sie können sich wahrscheinlich bei Old-School-TV und -Radio dafür bedanken. In guten alten Zeiten verwendete das Radio eine Zeichenfolge, um einen Zeiger entlang der Frequenztabelle zu bewegen. Da Englisch sprechende (und sehr viele andere) links lesen- nach rechts wurde der Zeiger so konstruiert, dass er sich nach rechts bewegt, um höhere Zahlen zu finden. Einen Knopf nach links zu drehen, um einen Zeiger nach rechts zu bewegen, macht keinen Sinn ... daher wurde wahrscheinlich im Uhrzeigersinn für größere geboren!

3
JBH

Wenn Sie eine App für einen Kühler erstellen, sollten Sie diesen bestimmten Kühler überprüfen und sicherstellen, dass Sie dieselbe Richtung verwenden. Dies sollte kein Problem sein, da die Software wissen muss, in welche Richtung der physische Knopf gedreht werden soll, den sie steuert.

Aber ich denke, Sie haben dies nur als Beispiel gemeint. Im Allgemeinen: Stellen Sie sicher, dass Sie den Benutzer eindeutig informieren.

Ich bin der Meinung, dass die anderen Antworten dies nicht genug betonen, wenn sie ausdrücklich alles erwähnen: Gehen Sie nicht davon aus, dass der Benutzer es weiß!

Die schiere Menge an Antworten, die diese Frage bisher hat, macht deutlich, dass die Richtung nicht offensichtlich ist, und wenn nicht für jeden etwas absolut offensichtlich ist, hilft eine gute Benutzeroberfläche dem Benutzer.

2
Nobody

Liegt die Antwort am Ende des Tages nicht im Wort "im Uhrzeigersinn"? Zeit wird nur in einer Richtung erlebt - sie schreitet voran und die Werte steigen entsprechend. Dies ist meiner Meinung nach die natürlichste Sichtweise.

2
Simon Drew

UI/UX-Designer mit einem früheren Abschluss und einer Karriere in der Audioaufnahme, die zu den Abstimmungen nach rechts beiträgt ... :) Nach rechts drehen = erhöhen und dem Benutzer definitiv die Erhöhung anzeigen :)

(enter image description here
enter image description here
enter image description here
enter image description here

0
EricPowell