Piktogramlar
Küçük, basit grafik ögeler; önemli web bileşenlerini geliştirir ve fikirleri hızlı ve etkili bir şekilde iletir.
Literal, işlevsel ve geometrik — piktogramlarımız fikirleri en saf hâline indirger, net bir amaç ve zamansız bir sadelik iletir.
Tür
Spaceship piktogramları iki türde gelir: düzenli ve comp. Comp türü, düzenli bir piktogramı Spaceship’in İkonografi Kütüphanesi’nden bir ikonla birleştirerek daha karmaşık ve özel kavramları iletmemizi sağlar.
Versiyonlar
Tüm Spaceship piktogramları iki versiyonda mevcuttur: dolu (birincil) ve çerçeveli (ikincil). Çerçeveli versiyon yalnızca bir piktogramın yakınındaki piktogramlardan, metinden veya UI bileşenlerinden daha az görsel ağırlığa ihtiyaç duyduğu durumlarda kullanılmalıdır. Bu, karmaşık düzenlerde görsel hiyerarşi oluşturmaya yardımcı olur.
Yapı
Piktogramlar, tutarlı ve dengeli sonuçlar sağlamak için temel ızgaradan geçiş ve çizgi parametrelerine kadar bir dizi kurala dayanır.
Boyut
Spaceship piktogramları ölçeklenebilir olacak şekilde tasarlanmıştır, görsel tutarlılığı korur ve en iyi okunabilirliği sağlar. Tasarım sistemimizde beş piktogram boyutu vardır.
Renkler
Piktogramlar genellikle tek bir ton kullanır. Tek istisna, marka veya bildirim renklerini içerebilen comp türüdür; bununla ilgili daha fazla bilgiyi aşağıda bulabilirsiniz. UI bağlamlarında tutarlılığı sağlamak için piktogramlar Spaceship Tasarım Sistemi renk referanslarını takip eder.
Varsayılan renk
Gri, piktogramlar için varsayılan renktir ve mesajları, eylemleri veya özellikleri temsil etmek için kullanılmalıdır. İstisnai durumlarda ürünler için de kullanılabilir. Çerçeveli piktogramlar yalnızca varsayılan renkte mevcuttur.
Marka renkleri
Daha fazla görsel etki gerektiğinde veya Spaceship kimliğini güçlendirmek için varsayılan renk yerine SPS Mavi, SPS Koyu Gri veya beyaz da kullanılabilir. Daha fazla ayrıntı için renk sayfasına göz atın.
Ürün renkleri
Ana ürün rengi, ürünlere özel bağlamlarda (ürün sayfaları, ürün kartları vb.) tüm mevcut ve gelecek ürünler için piktogramlarda kullanılmalıdır.
Bildirim renkleri
Bu renkler bir bildirim mesajını güçlendirmek için kullanılmalıdır. Comp versiyonu yalnızca genel sistem mesajlarında kullanılmalı, uyarı durumlarında kullanılmamalıdır.
Yönergeler
Piktogram oluştururken ve kullanırken kaçınılması gereken bazı örnekler aşağıdadır.
Düzenli piktogramın anahtar öğelerinin sağ alt köşeye gelmesine izin vermeyin.
Dolu versiyonlarda karmaşık veya çok renkli geçişler kullanmayın.
Comp türünde dolu ve çerçeveli öğeleri karıştırmayın.
Yukarıda belirtilenler dışında dolu versiyonlarda başka renkler kullanmayın.
Çerçeveli versiyonlarda varsayılan renk dışında herhangi bir renk kullanmayın.
Varsayılan rengi, Spaceship marka ana rengi ve Bildirim renkleri dışında başka bir renkle birleştirmeyin.