Piktogramlar
Küçük, basit grafik ögeler; önemli web bileşenlerini geliştirir ve fikirleri hızlı ve etkili bir şekilde iletir.
Kelimesi kelimesine, işlevsel ve geometrik — piktogramlarımız fikirleri en saf hâline indirger, net bir amacı ve zamansız sadeliği ifade eder.
Tür
Spaceship piktogramları iki türde sunulur: regular ve comp. comp türü, regular bir piktogramı Spaceship’in Iconography Library’sinden bir simgeyle birleştirerek daha karmaşık ve daha özel kavramları ifade etmemizi sağlar.
Sürümler
Tüm Spaceship piktogramları iki sürümde sunulur: filled (birincil) ve outlined (ikincil). outlined sürüm yalnızca bir piktogramın yakındaki piktogramlara, metne veya UI bileşenlerine göre daha az görsel ağırlığa sahip olması gerektiğinde kullanılmalıdır. Bu, karmaşık düzenlerde görsel hiyerarşi oluşturmaya yardımcı olur.
Oluşturma
Piktogramlar, taban ızgaradan degrade ve çizgi parametrelerine kadar tutarlı ve dengeli sonuçlar sağlamak için 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 Design System 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. Çizgisel piktogramlar yalnızca varsayılan renkte sunulur.
Marka renkleri
SPS Blue, SPS Dark Gray veya beyaz, daha fazla görsel etki gerektiğinde ya da Spaceship kimliğini güçlendirmek için varsayılan rengin yerine de kullanılabilir. Daha fazla ayrıntı için renk sayfasına göz atın.
Ürün renkleri
Ana ürün rengi, mevcut ve yakında çıkacak tüm ürünler için ürüne özel bağlamlarda (ürün sayfaları, ürün kartları vb.) piktogramlarda kullanılmalıdır.
Bildirim renkleri
Bu renkler, bir bildirim mesajını güçlendirmek için kullanılmalıdır. comp sürümü 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ğıda verilmiştir.
Regular piktogramın temel öğelerinin sağ alt köşeye düşmesine izin vermeyin.
Dolu sürümlerde karmaşık veya çok renkli degradeler kullanmayın.
comp türünde dolu ve çizgisel öğeleri karıştırmayın.
Dolu sürümlerde yukarıda belirtilenler dışında başka renkler kullanmayın.
Çizgisel sürümlerde varsayılan renk dışında herhangi bir renk kullanmayın.
Varsayılan rengi, Spaceship marka ana renkleri ve Bildirim renkleri dışında herhangi bir renkle birleştirmeyin.