Was genau sind Googles "500" -Farbmuster?

Ich habe über Googles Material Design nachgelesen, und während ich über Stil nachlese, erwähnen sie immer wieder die primären 500 Farben (sowie jede andere Zahl von 50, die fast weiß ist, bis 900), aber was macht das? Diese Durchschnitts?

Ich würde gerne versuchen, meine eigenen "Material inspirierten" Farbfelder zu erstellen, aber da die Benennung ihrer Farben mich verwirrt, bin ich mir nicht ganz sicher, wo ich anfangen soll. Ich habe versucht, nach einer Antwort zu suchen (was sich irgendwie ironisch anfühlt), aber bisher habe ich noch nicht viele schlüssige Antworten gefunden. Wenn ich raten müsste, hat es anscheinend etwas mit der Wellenlänge der Farbe zu tun?

Es gibt auch Erwähnungen von A100 bis A700 Farben ...

Ich habe mich das selbst gefragt.

Erstens scheint "500" nicht anzuzeigen, wie viele Farben es gibt, sondern das seltsame Nummerierungssystem, das sie verwenden. 500 ist die Basis, 400 ist heller als die Basis, 600 ist dunkler. Das ist ziemlich ähnlich der Nummerierung der Schriftschnitte ( Info ). Vielleicht hat das etwas damit zu tun.

Ich habe festgestellt, dass einige der Zahlen unter 500 gefunden werden, indem sie in Weiß (Mischmodus "Bildschirm" in Photoshop) oder Schwarz ("Multiplizieren") ausgeblendet werden.

• 900: 59% (nah)
• 600: 10% (fast genau)
• 500: Basis
• 400: 15% (genau)
• 300: 30% (genau)
• 200: 50% (genau)
• 100: 70% (schließen)
• 50: 88% (genau)

Ich sehe hier kein Muster. Und vielleicht gibt es keinen. Oder vielleicht ist etwas offensichtlich, das ich übersehen habe; Ich bin ziemlich schlecht im Farbschema.

Ich lasse das hier, weil es sich um neue Informationen zum Thema handelt.

https://www.youtube.com/watch?t=73&v=xYkz0Ueg0L4

Veröffentlicht am 28. Mai 2015

Ein bisschen rostig auf Ihrer Farbentheorie? Materialdesign macht Farbe einfach. Weitere Informationen zum Farb- und Materialdesign erhalten Sie unter www.google.com/design .

ETA: Die Primärfarben (die 500) sind Farben, die Google als "Hauptfarbe" (oder Hauptfarben) für Ihr Design ausgewählt hat. Sie beginnen mit dem primären 500 und skalieren dann von hell nach dunkel. Diese Farben werden auf verschiedene Elemente in der Benutzeroberfläche angewendet.

500er beschreiben das vorherrschende Thema im Produkt (und eignen sich hervorragend für Symbolleisten). Von hier aus können bis zu 700er für Statusleisten oder bis zu 300er für sekundäre Informationen skaliert werden. Die A-Farben sind Akzentfarben - hellere und gesättigtere Interaktion. Diese eignen sich perfekt zum Hervorheben von primären Aktionsschaltflächen, Standardschaltflächen, Schaltern und Schiebereglern.

Interessant ist, dass die Informationen in diesem Video im Widerspruch zu den Informationen zu stehen scheinen, die Google auf der oben genannten Palettenseite ( http://www.google.com/design/spec/style/color) bereitstellt, oder zumindest widersprüchlich zu erläutern scheint .html # color-color-palette ).

Auf der Palettenseite heißt es: "Google schlägt vor, die 500 Farben als Primärfarben in Ihrer App und die anderen Farben als Akzentfarben zu verwenden. " Im Video heißt es: "Die A-Farben sind Akzentfarben ..."

Zugegeben, subtiler Unterschied, aber wenn Google einen Styleguide entwickeln will, sollte er mit der Verwendung des Wortes " Akzent " vereinbar sein .

Vielleicht haben Sie diese Ressource bereits gefunden, aber Google hat einen unglaublich praktischen Leitfaden zusammengestellt, der Entwicklern und Designern hilft, sich mit dem neuen Material-Vibe abzustimmen.

Den gesamten Leitfaden finden Sie hier: http://www.google.com/design/spec/material-design/introduction.html#

Insbesondere werden auf dieser Seite alle bevorzugten Farben zum Download angeboten - http://www.google.com/design/spec/style/color.html#color-color-palette

Hier ist die Antwort auf Ihre Frage. Schauen Sie sich dieses Video an

Die 500er sind Primärfarben , die das dominierende Thema in Ihrem Produkt perfekt beschreiben und sich hervorragend für Symbolleisten eignen.

700er werden für Statusleisten verwendet

und 300s werden für sekundäre Informationen verwendet

Im Grunde genommen repräsentieren diese Zahlen vordefinierte Schattierungen und Farbtöne von Primärfarben für bestimmte Abschnitte / Teile des Designs.

Meiner Meinung nach basiert die Namenskonvention auf der Webfont-Gewichtsnamenskonvention:

• 500: Basis
• <500: dünner / leichter
• > 500: dicker / dunkler

Eine sehr nützliche und logische Art, etwas mit einer Grundlinie und Variationen zu benennen.

Referenzlink: Link zur GitHub-Seite von Inter font

Als Beispiel sehen Sie hier einen Screenshot von Mozillas "Inter" -Schrift, die eine solche Schriftgewichtungsbezeichnung verwendet, aber in diesem Fall wird die reguläre / Basis-Gewichtung mit 400 nummeriert. Viele Schriften verwenden tatsächlich 400 als "reguläre" Gewichtung, dies ist jedoch die ein anderes Thema.