Farbbeschränkungen für Benutzereingaben

Was ist eine angemessene Einschränkung für eine Farbskala für benutzerdefinierte Farben?

Ich helfe beim Aufbau einer Website, die es Organisationen ermöglicht, ihre eigenen Seiten zu erstellen. Wir möchten ihnen die Möglichkeit geben, die Hintergrundfarbe sowie die Hervorhebungsfarbe auf ihrer Seite anzupassen.

Die „Highlight“-Farbe definiert die Farbe aller Symbole und Schaltflächen auf ihrer Seite. Aus diesem Grund können wir nicht zulassen, dass die Hervorhebungsfarbe zu hell/blass/hell ist.

Wir bieten die folgende Benutzeroberfläche zur Auswahl einer Farbe an:

Anpassung von https://bgrins.github.io/spectrum/#details-ieImplementation

Anpassung von https://bgrins.github.io/spectrum/#details-ieImplementation

Sie können sehen, dass sich die ausgewählte Farbe in der Schaltfläche „Auswählen“ widerspiegelt und auch auf andere Schaltflächen in der Benutzeroberfläche angewendet wird.

Mein möglicherweise naiver Plan war, das Farbspektrum auf zwei verschiedene Arten einzuschränken:

  1. Bewerten Sie die ausgewählte Farbe in RGB - prüfen Sie, ob der kombinierte Wert von R, G und B weniger als 255 beträgt (auf einer Skala von 0 bis 255).

  2. Bewerten Sie die ausgewählte Farbe in HSL - extrahieren Sie den L-Wert (Luminanz oder Helligkeit) und prüfen Sie, ob der Wert kleiner als 0,5 ist

Wenn ein Benutzer eine Farbe auswählt, die nicht im richtigen Bereich liegt, wird eine Fehlermeldung angezeigt, die darauf hinweist, dass er eine dunklere Farbe auswählen muss.

Diese Implementierung scheint ziemlich gut zu funktionieren. Alle hellen Farben werden mit wenigen Ausnahmen von den oben genannten Einschränkungen erfasst (volles Grün erscheint in meinen Augen heller als zum Beispiel volles Rot ... nicht sicher warum).

Meine Frage ist, ob es eine Standardbeschränkung gibt, die für ähnliche Auswahlen gilt. Gibt es eine bessere Möglichkeit, die ausgewählten Farben zu bewerten und einzuschränken?

OT, aber der Grund, warum 0x00FF00 heller aussieht als 0xFF0000, ist, dass das menschliche Auge am empfindlichsten für grünes Licht und am wenigsten empfindlich für rotes Licht ist. Aus diesem Grund ist Grün auf weißem Hintergrund oft schwerer und Rot auf schwarzem Hintergrund schwerer zu erkennen.
Können sie einen dunklen Hintergrund wählen? In diesem Fall würde es nicht funktionieren, sie auf dunkle Highlights zu beschränken. Sie möchten vielleicht, dass es wie Nachtmodus/Terminal/Geocities der 90er aussieht.
@ChrisH Wir haben unsere Inhalte so gestaltet, dass sie alle in Graustufen-„Karten“ verpackt sind, die leicht durchscheinend sind. Der Inhalt wird also nicht wirklich von der Auswahl der Hintergrundfarbe beeinflusst, es fügt nur einen Farbtupfer hinzu, der den Inhalt umgibt.

Antworten (2)

Ich würde aus mehreren Gründen davon absehen, alle Farboptionen in einem Farbwähler wie diesem anzuzeigen: 1) Es ist frustrierend für einen Benutzer, Optionen zu sehen (oder sogar auszuwählen), die er am Ende nicht haben kann. Und was noch wichtiger ist, 2) die meisten Leute wären zumindest anfangs durch dieses Setup verwirrt. Wenn ein Benutzer Ihr Produkt überhaupt verwendet, besteht die Möglichkeit, dass er etwas Einfacheres, aber weniger Leistungsstarkes bevorzugt.

Was ich stattdessen empfehlen würde, ist, ihnen entweder eine Auswahl aus vorgefertigten Farben zu geben oder ihnen eine Auswahl aus vorgefertigten Paletten (Farbkombinationen) zu geben. Sie könnten die Anpassung optional auch später zulassen oder für mehr "Power-User" versteckter machen. Ich mache solche Dinge ständig in meinen Anwendungen. Auf diese Weise haben Sie mehr volle Kontrolle, während Benutzer nicht (so oft) frustriert werden.

Ich werde sehr unverblümt sein.

Wir möchten ihnen die Möglichkeit geben, die Hintergrundfarbe sowie die Hervorhebungsfarbe auf ihrer Seite anzupassen.

Nicht. Im Ernst, nicht. Wenn Sie sich nicht sicher sind, dass die Redakteure der Website sehr versiert in der Farbtheorie sind und die allgemeine Farbpalette der Website verstehen, ist es eine schlechte Idee, Ihren Benutzern die Kontrolle über die Farbe zu geben.

Ich würde Ihnen raten, eine Reihe von vorgewählten Paletten zu erstellen, aus denen der Kunde dann als Set auswählen kann . Auf diese Weise geben Sie dem Benutzer die Vorstellung von Wahlmöglichkeiten und Freiheit, ohne die Möglichkeit solcher Schiffbrüche #ff0000zu #00ff00haben, glauben Sie mir, Ihr Benutzer wird irgendwann wählen wollen. Ihre vorgeschlagenen Regeln werden sie nur frustrieren, weil sie die Farben in der GUI sehen, aber nicht in der Lage sind, sie auszuwählen.

Danke für das Feedback und danke auch an zach! Ich verstehe, wie es zu einigen ziemlich schrecklichen Entscheidungen kommt, wenn man den Endbenutzern so viel Kontrolle über ihre Farbauswahl gibt. Das Gegenteil davon ist jedoch, dass eine Palette in ihren Optionen ziemlich restriktiv ist. Wir können (und haben) Paletten entwickelt, die auf unserer Website großartig aussehen würden. Das eigentliche Ziel dieser Anpassbarkeit besteht jedoch darin, dass Benutzer Farben auswählen können, die zu ihrem Branding passen. Eine andere Idee, die wir hatten, war, ihnen zu erlauben, ihre Hervorhebungsfarbe auszuwählen und basierend auf ihrer Auswahl automatisch eine Hintergrundfarbe zu generieren.
@ user3915135 Dieser Ansatz, eine Hintergrundfarbe für sie zu generieren, ist ebenfalls gültig, obwohl er meiner Meinung nach immer noch restriktiv ist, da sie keine verschiedenen Hintergrundstile auswählen können (dieselbe Primärfarbe kann manchmal mit vielen Hintergrundfarben funktionieren). Wie auch immer Sie sich entscheiden, es gibt Vor- und Nachteile
@ZachSaucier genau. Wir werden diese Vor- und Nachteile abwägen und von hier aus bestimmen, welche Lösung für unsere Endbenutzer am besten geeignet ist. Danke für die Eingabe!
Farbbeschränkungen für Benutzereingaben
AntwortenHierDatenschutz-Bestimmungen1y, 0v