Errate mein RGB: Guess My RGB

 (susam.net)
2 Punkte von GN⁺ 2024-04-01 | 1 Kommentare | Auf WhatsApp teilen
  • Guess My RGB ist ein einfaches Farben-Ratespiel, bei dem man die RGB-Werte der Hintergrundfarbe direkt errät
  • Nutzer bewegen die Slider oben, um die R-, G- und B-Werte anzupassen und eine Kombination zu finden, die der Hintergrundfarbe möglichst nahekommt
  • Auf dem Bildschirm werden Hexadezimalzeichen von 0 bis 9 und von A bis F sowie die Labels R, G und B angezeigt
  • Mit dem Button New Game kann ein neues Spiel gestartet werden
  • Punktestand, Art der Auflösung, Schwierigkeitsgrad und Implementierungsweise lassen sich anhand der bereitgestellten Zusammenfassung nicht feststellen

Bildschirm und Ziel

  • Der Titel lautet Guess My RGB
  • Ziel ist es, per Slider die RGB-Hintergrundfarbe zu erraten
  • Auf dem Bildschirm werden die Zeichen von 0 bis 9 und von A bis F angezeigt
  • Die Labels R, G und B werden ebenfalls angezeigt, sodass die einzelnen Farbkanäle unterschieden werden können

Bedienung

  • Der Hinweistext lautet: „Move the sliders above to guess the background RGB colour.“
  • Nutzer passen die R-, G- und B-Werte über die Slider oben an
  • Mit dem Button New Game wird ein neues Spiel gestartet

Verwandte Beiträge

1 Kommentare

 
GN⁺ 2024-04-01
Meinungen auf Hacker News

  • Ich frage mich, was die optimale Strategie wäre, wenn man die Farbe nicht sehen kann und erst nach dem Absenden nur die Punktzahl sieht.
    Schon einfaches Hill Climbing ist ziemlich effizient: Man startet jeden Slider bei 0, verschiebt ihn nach rechts, bis die Punktzahl sinkt, und geht dann einen Schritt nach links zurück.
    Im Schnitt dürften etwa 9 Versuche pro Slider nötig sein, also rund 27 Versuche pro Farbe.
    An der Punktedifferenz beim Verschieben von 0 auf 1 kann man grob abschätzen, wie weit man nach rechts gehen sollte, aber wegen der Rundung bekommt man nicht die exakte Distanz.
    Mit einer optimalen Strategie sollten im Mittel etwa 4 Versuche pro Slider reichen, also ungefähr 12 Versuche pro Farbe.

    • Als Automatisierungsversuch für Arme könnte man die RGB-Eingabe auf 0 setzen, jeden Farbkanal schrittweise erhöhen, jeweils absenden und, sobald die Punktzahl nicht mehr steigt, einen Schritt zurückgehen.
      Wegen der Rundung des Ergebnisprozentsatzes können benachbarte Farben dieselbe Punktzahl haben, daher muss man mindestens zweimal iterieren.
    • Wenn man annimmt, dass die Punktzahl 100 minus euklidische Distanz ist, kann man nach drei zufälligen Schätzungen die Antwort per Triangulation eingrenzen.
      Die Triangulation liefert zwei mögliche Antworten; wenn man zufällig eine davon wählt, dürfte man im Schnitt nach 4,5 Versuchen richtig liegen.
    • Wenn man die Information der Punktzahl selbst ignoriert und nur vergleicht, welche Seite die höhere Punktzahl hat, kann man nicht per binärer Suche, sondern per ternärer Suche oder Golden-Section Search optimieren.
      https://en.wikipedia.org/wiki/Golden-section_search
      Im Bereich 0–F misst man 6 und 9 und grenzt je nach höherer Punktzahl auf 0–9 oder 6–F ein.
      Wenn man danach bereits gemessene Werte wiederverwendet und den Bereich weiter verkleinert, kommt man im schlechtesten Fall auf 6 Versuche pro Slider, im Mittel auf etwa 5.
      Wahrscheinlich lässt sich das noch weiter optimieren, aber ich habe es nur bis hierhin betrachtet.
    • Es gibt eine Lösung, die im Gesamtdurchschnitt mit etwa 3,27 Versuchen auskommt.
      Dabei wählt man Schätzungen so, dass die möglichen Farben möglichst gleichmäßig auf 100 Punkte-Buckets verteilt werden, also die Varianz minimiert wird.
      Mehr als die Hälfte aller Farben lässt sich mit nur 2 Schätzungen identifizieren.
      Wenn man den Code so ändert, dass die größte Bucket-Größe minimiert wird, wird der Durchschnitt etwas schlechter, aber man braucht in keinem Fall mehr als 4 Versuche.
      Die Lösung kann man in die Browser-Konsole der Website einfügen und ausführen.
    • Die tatsächliche Berechnung ist eine Distanz im dreidimensionalen Raum und wird auf die größtmögliche Distanz skaliert.
      Wenn man Skalierung und Rundung kurz ignoriert, grenzen die Distanzen von der Zielfarbe zu drei beliebigen, nicht kollinearen Punkten die Kandidaten unabhängig von der Genauigkeit der einzelnen Achsen auf höchstens zwei ein.
      Daher liegt die Trefferwahrscheinlichkeit bei der dritten Schätzung bei 50 % und bei der vierten ebenfalls bei 50 %.
      Mit Skalierung kann man es immer noch als Schnittproblem von Kugeln betrachten, aber die Distanzfunktion ist nicht symmetrisch, sodass die Kugeln eine merkwürdige Form bekommen.
      Wenn die erste Schätzung zum Beispiel eine Ecke des Würfels ist, hat man damit den am weitesten entfernten Punkt gewählt, sodass 1/8 des Raums dieselbe Punktzahl von 0 % hat.
      Wenn man auch den Präzisionsverlust durch Rundung berücksichtigt, sollte man es eher als diskretes Problem betrachten und Tupel von Punkten suchen, die alle Farben unterscheiden können; nach ein paar Versuchen funktionierten die vier Punkte [11,7,4], [4,4,8], [11,8,11], [4,11,7].
      Es könnte eine kleinere Menge geben, aber um per Brute Force zu prüfen, ob drei Punkte alles unterscheiden können, wären wohl ungefähr 2^48 Operationen nötig; es könnte auch besser werden, wenn man den zweiten Punkt abhängig vom ersten Ergebnis wählt.

  • Das ist mein Partytrick.
    Wenn man mir eine Farbe beschreibt, kann ich den Hex-Farbcode nennen.
    Wie man sich denken kann, bin ich auf Partys unglaublich beliebt.

    • Es gibt dazu auch ein Brettspiel.
      Der erste Hinweis ist ein Wort, der zweite Hinweis sind zwei Wörter, und alle platzieren ihre Spielfigur dort, wo sie die Farbe vermuten.
      Die Punkte werden nach Distanz vergeben, daher ist es leicht zu spielen.
      https://boardgamegeek.com/boardgame/302520/hues-and-cues
    • Jetzt müsste man als Antwort einfach die Farbe nehmen, die entsteht, wenn man Wörter mit dem Netscape-Algorithmus interpretiert.
      Ich habe früher einen Artikel darüber gelesen, wie Netscape Wörter, die nicht in der offiziellen Liste der Farbnamen stehen, als Farben interpretiert hat: Nicht-hexadezimale Zeichen werden verworfen, die übrigen Zeichen werden gepaddet und in Chunks zerlegt, um RGB-Zahlen zu bilden.
      So kann „dumptruck“ zu DC0 werden und wie Gelb aussehen.
      Daraufhin habe ich sofort eine kleine App gebaut, die alle Wörter aus /usr/share/dict/words interpretiert und zusammen mit ihrer Lab-Farbdarstellung in eine sqlite-DB schreibt.
      Sie zeigte die 100 dem gewünschten RGB-Wert nächsten Pseudo-Farbwörter als echte Farben an und sortierte sie nach Nähe; für ein spontan gebautes Abendprojekt war das ziemlich unterhaltsam.
    • Ein Foto, aufgenommen Ende der 1980er mit einer sowjetischen Kamera, Parfüm und Teddybär, ein Teppich an der Wand, das Gefühl dunklen Holzes im Kontrast zur Leichtigkeit der Jugend.
    • Ein koloriertes melancholisches Violett, das an die Abenddämmerung in einem Kinderbuch von 1910 erinnert.
    • Okay, probieren wir es.
      Ein trübes Gelb, das an eine süß-saure Frucht aus Mittelamerika und dem Süden der USA erinnert.
      Das stammt aus einer Farbbeschreibung.

  • Nach dem Absenden ändert sich die Hintergrundfarbe der Box, die das Übereinstimmungsergebnis anzeigt, zu der Farbe, die ich geschätzt habe.
    Je nach gesuchter Farbe mag das offensichtlich sein, aber in meinem Fall war die Farbe ziemlich grau, sodass ich diesen wichtigen visuellen Hinweis erst nach ein paar Schätzungen bemerkt habe.

  • Unbeabsichtigt ist das eine großartige Werbung für wahrnehmungsbasierte Farbräume.
    Sobald ich mich einigermaßen angenähert hatte, war es einfacher, die Farbe zu ignorieren und nur auf die Prozentänderung zu achten.
    Ich frage mich, ob ein Spiel wie Guess My OKLCH anders wäre.

    • Wenn die Farbe wirklich nahe dran ist, scheint der Prozentsatz nicht ganz mit der Wahrnehmung übereinzustimmen.
      Es fühlt sich an, als gäbe es bei 95 % eine Obergrenze.

  • Auf der Seite ist es nicht verlinkt, aber für Interessierte gibt es hier das GitHub-Repository:
    https://github.com/susam/myrgb

  • Ich hatte gerade erst Unterrichtsmaterial zu verschiedenen Farbformaten fertiggestellt, daher fand ich das witzig
    Darin hatte ich erklärt, wie schwierig es ist, Farben über RGB-Werte auszuwählen, weil Menschen Farben nicht so denken
    Dieses Spiel ist ein gutes Beispiel dafür
    HSL ist viel intuitiver, und wenn man ein Gefühl für den Farbkreis hat, lässt sich eine Farbe sehr leicht über Sättigung und Helligkeit definieren

    • Ich stimme völlig zu, dass HSL ein gut denkbarer Farbraum ist
      Ich lasse Studierende als Übung die Unterschiede der Farben ihrer Kleidung in HSL definieren
      Wenn einem RGB schwer zu konzeptualisieren erscheint, sollte man auch einmal Lab ausprobieren

  • Ich habe die erste Farbe auf Anhieb getroffen, und jetzt habe ich Angst, dass es von hier an nur noch bergab gehen kann

  • Wo ist das Problem? Einfach in den Entwicklerwerkzeugen die Hintergrundfarbe nachsehen und auf 16 Stufen normalisieren, haha
    Im Ernst: sehr gut gemacht, ein spaßiges und herausforderndes Spiel

  • Ich würde auch gern ein Spin-off Guess my HSL ausprobieren

  • Die Idee ist wirklich großartig
    Bei den ersten beiden Versuchen kam ich schnell auf 94 %, danach hing ich komplett fest
    94 % sah wie ein lokales Optimum aus, und es fühlte sich so an, als würde kein Slider, um einen Schritt nach oben oder unten bewegt, die Lösung bringen
    Kann jemand erklären, warum? Außerdem wäre es schön, wenn es eine Möglichkeit gäbe, aufzugeben und die richtige Antwort zu sehen

    • Ich hatte dasselbe Problem
      Auf dem Handy habe ich wegen meiner dicken Finger nicht gemerkt, dass ich den Slider nicht exakt um einen Schritt, sondern immer um zwei Schritte bewegt habe
    • Der Score ist so definiert
      Zuerst wird der maximal mögliche Fehler von der Zielfarbe berechnet, dann wird die euklidische Distanz zum tatsächlichen Tipp durch diese maximale Distanz geteilt und Math.floor(100 * (1 - dist / maxDist)) zurückgegeben
      Das ist sinnvoll, damit sich die Prozente in jeder Runde ähnlich anfühlen
      Andernfalls würde ein mittleres Grau bei jeder Schätzung relativ hohe Punktzahlen bekommen
      Um die Frage zu beantworten: Die beschriebene lokale-Optimum-Situation scheint mir nicht möglich zu sein
      Ich bin kein Mathematiker, aber wenn man nur diese Funktion betrachtet, sollte es, solange es nicht die richtige Antwort ist, immer eine Richtung geben, in der man durch Bewegen eines Sliders eine höhere Punktzahl erzielt
      Wahrscheinlich hast du diese Ein-Schritt-Bewegung übersehen, und je näher man der Antwort kommt, desto eher passiert das
    • 94 % bedeutet, dass man nur einen Schritt nach oben oder unten bewegen muss, also gibt es 6 Möglichkeiten
      Wenn du einen bewegst und es nicht die Lösung ist, musst du den ersten Slider wieder auf seine ursprüngliche Position zurücksetzen, bevor du einen anderen bewegst
    • Das scheint mir nicht möglich zu sein
      Als ich es ausprobiert habe, stieg oder fiel die Übereinstimmung schon, wenn ich nur eine Zahl geändert habe