Google’ın '500' renk örneği tam olarak nedir?


36

Google’ın Materyal Tasarımı’nı okudum ve Stil’i okuduğum için, birincil 500 renkten bahsetmeye devam ediyorlar (50’den, neredeyse beyaz olan, 900’e kadar değişen herhangi bir sayı). bu demek ki?

Kendi "Materyallerden ilham alan" renk örneklerini oluştururken elimi denemeyi çok isterdim, ancak renklerinin isimlendirilmesi beni şaşırttığı için nereden başlayacağımdan emin değilim. Bir cevap için googling'i denedim (bu bir şekilde biraz ironik geliyor), ama şimdiye kadar çok kesin cevaplar bulamadım. Tahmin etmek zorunda olsaydım, rengin dalga boyuyla bir ilgisi var gibi görünüyor?

Ayrıca A100 ila A700 renklerinden de bahsediyoruz ...


8
Yalnızca Google, grafik tasarımcılarının çözemediği bir renk sistemi bulabilirdi.
Simon White

Yanıtlar:


21

Bunu kendim merak ediyordum.

İlk olarak, "500" kaç renk olduğunu gösteriyor gibi görünmüyor, ancak kullandıkları garip numaralandırma sistemini kullanıyor. 500 tabandır, 400 tabandan daha hafiftir, 600 koyudır. Yazı tipi ağırlıklarının nasıl numaralandırıldığına ( bilgi ) oldukça benzer, bu yüzden bununla bir ilgisi olabilir.

500'den daha az sayıların bazılarının beyaza (Photoshop'ta "Ekran" karıştırma modu) veya siyah ("Çarp") olarak göründüğünü tespit ettim.

  • 900:% 59 (yakın)
  • 600: 10% (neredeyse kesin)
  • 500: Baz
  • 400: 15% (kesin)
  • 300: 30% (kesin)
  • 200: 50% (kesin)
  • 100: 70% (yakın)
  • % 50: 88 (kesin)

Burada bir model göremiyorum. Ve belki bir tane yoktur. Ya da belki göz ardı ettiğim bir şey vardır; Renk düzeninde oldukça kötüyüm.


1
Hm, aslında daha özel bir şeyin yerine geçeceğini umuyordum. Ama sanırım sadece Google’ın renkleri isimlendirme şekli. Cevap için teşekkürler, en azından!
Cleverbird

1
bu renk numaralandırma defacto endüstri standardı mı?
Youngjae

2
@Youngjae no. Bir şey değil.
DA01,

11

Bunu burada bırakacağım çünkü konuyla ilgili yeni bilgiler.

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

Yayınlandı 28 Mayıs 2015

Renk teorisinde biraz paslanmış mı? Malzeme tasarımı rengi kolaylaştırır. Renk ve malzeme tasarımı hakkında daha fazla bilgiyi www.google.com/design adresinde bulabilirsiniz .

ETA: Birincil renkler (500), Google'ın tasarımınızı temel alan "ana renk" (veya renkler) olarak seçtiği renklerdir. Birincil 500 ile başlayın, sonra aydınlıktan karanlığa ölçeklendirin; bu renkler UI'deki farklı öğelere uygulanır.

500'ler üründeki baskın temayı (ve araç çubukları için mükemmeldir) tanımlar. Oradan durum çubukları için 700'lere kadar veya ikincil bilgi için 300'e kadar ölçeklenebilir. A renkleri vurgu renkleridir - daha parlak ve daha doymuş teşvik edici etkileşimdir. Bunlar, birincil işlem düğmelerini, standart düğmeler, düğmeler ve sürgüleri vurgulamak için mükemmeldir.

İlginç olan, bu videodaki bilgilerin Google’ın yukarıda belirtilen palet sayfalarında sağladığı bilgilerle çelişkili ya da en azından tutarsızca açıklandığı görülüyor ( http://www.google.com/design/spec/style/color) .html # renk-renk paleti ).

Palet sayfasında "Google, uygulamanızdaki ana renkler ve diğer renkleri vurgu renkler olarak kullanmanızı önerir. " Videoda "A renkler vurgu renkleri ..."

Verilmiş, ince bir fark var, ancak Google bir stil kılavuzu geliştirecekse, " aksan " kelimesinin kullanılmasıyla tutarlı olmalıdır .


5

Belki de bu kaynağı zaten buldunuz, ancak Google, geliştiricilerin ve tasarımcıların yeni Material vibe ile senkronize olmalarına yardımcı olmak için inanılmaz derecede kullanışlı bir rehber hazırladı.

Kılavuzun tamamını burada bulabilirsiniz - http://www.google.com/design/spec/material-design/introduction.html#

Özellikle, bu sayfa en sevdikleri tüm renkleri indirmeye hazır hale getirir - http://www.google.com/design/spec/style/color.html#color-color-palette


3
Tam olarak 'Birincil 500 renk' terimini bulduğum yer burasıydı, ancak anlamaya çalıştığım şey, bu sayının ifade ettiği şey.
Cleverbird

4

İşte sorunuzun cevabı .. Bu videoyu izleyin

500s İlköğretim Renkler ürününüz baskın temayı açıklayan mükemmel ve araç çubukları için mükemmeldir.

Durum çubukları için 700'ler kullanılıyor

ve 300'ler İkincil bilgiler için kullanılır

Temel olarak, bu sayılar, tasarımın belirli bölümleri / bölümleri için Ana renklerin önceden tanımlanmış renk tonlarını ve renk tonlarını temsil eder.


0

Benim görüşüme göre, adlandırma kuralı webfont ağırlık adlandırma kuralı dayanmaktadır:

  • 500: taban
  • <500: tiner / çakmak
  • > 500: daha kalın / daha koyu

Temel ve çeşitlemeli bir şeyi adlandırmanın çok kullanışlı ve mantıklı bir yolu.

Inter fontun GitHub sayfasından ekran görüntüsü

Referans bağlantı: Inter fontunun GitHub sayfasına bağlantı

Örnek olarak, Mozilla’nın böyle bir font ağırlığı adlandırma kullanan "Inter" fontunun ekran görüntüsüdür, ancak bu durumda normal / taban ağırlığı 400 olarak numaralandırılmıştır. Birçok font aslında 400'ü "normal" ağırlık olarak kullanır, ancak bu başka bir konu.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.