Çoğu satıcı marka rengini bir zevk meselesi sanır. Panelin ayarlar ekranına girer, aklına gelen ilk lacivertin hex kodunu yazar, üstüne bir de kalın bir başlık fontu seçer ve işin bittiğini düşünür. Oysa bir dijital ürün satış yazılımı üzerinde renk ve tipografi, estetik değil ölçülebilir bir dönüşüm katmanıdır. Ziyaretçi siteye girdiği ilk saniyede fiyatı okumaz, teslimat metnini okumaz; sadece "burası güvenli görünüyor mu" sorusuna içgüdüsel bir cevap üretir. O cevabı üreten şey de büyük ölçüde renk kontrastı, yazı hiyerarşisi ve boşluk düzenidir.
İşin sessiz tarafı şu: aynı ürünü, aynı fiyattan, aynı teslimat hızıyla satan iki panel arasındaki fark genelde altyapı değil, görsel tutarlılıktır. Bir e-pin scripti kurarken renkleri tek tek elle değiştirmeye başlarsan altı ay sonra yedi farklı turuncu tonu, dört farklı buton yüksekliği ve iki farklı font ailesi olan bir Frankenstein sitesiyle kalırsın. Bu yazıda o tuzağa düşmeden markanı yazılıma nasıl oturtacağını, hangi rengin nerede kullanılacağını ve font seçiminin sepet terkine nasıl dokunduğunu adım adım anlatıyorum.
Renk Seçimini Zevk Sanıyorsun, Oysa Elinde Bir Dönüşüm Kolu Var
Marka rengi bir dekor değil, bir yönlendirme aracıdır. Panelde en doygun, en dikkat çeken tonun tek bir görevi olmalı: kullanıcının atmasını istediğin adımı işaretlemek. "Satın Al", "Bakiye Yükle", "Siparişi Tamamla" gibi eylemler o rengi taşır. Geri kalan her şey — kategori kartları, bilgi kutuları, menü — daha sakin tonlarda kalır. Çoğu satıcı bunun tersini yapar; marka rengini her yere serper, sonra da "buton neden fark edilmiyor" diye sorar. Cevap basit: her şey vurgulanıyorsa hiçbir şey vurgulanmıyor.
Pratik bir kural koy: ana marka rengin sayfanın en fazla yüzde onunu kaplasın. Kalan alan nötr zeminler, ince çizgiler ve metin renkleriyle dolsun. Bu oranı tuttuğunda ziyaretçinin gözü otomatik olarak eyleme kayar. İkinci bir kural daha ekle: uyarı, hata ve başarı renkleri marka renginden bağımsız olsun. Marka rengin kırmızıysa hata mesajını da kırmızı yapmak, kullanıcının "bu bir hata mı, yoksa buton mu" diye duraklamasına yol açar. Duraklama demek düşünme demek, düşünme demek de dijital ürün satışında çıkış demek.
| Renk rolü | Doğru kullanım alanı | Sık yapılan hata | Görünen sonuç |
|---|---|---|---|
| Birincil marka | Ana eylem butonları, aktif sekme | Tüm kart kenarlıklarına yayma | Buton fark edilmiyor, tıklama düşüyor |
| İkincil / destek | İkincil butonlar, etiketler | Birincil renkle aynı doygunluk | Hiyerarşi kayboluyor |
| Nötr zemin | Sayfa arkaplanı, kart yüzeyi | Saf beyaz üstüne saf beyaz kart | Kart sınırları görünmüyor |
| Metin rengi | Başlık koyu, gövde orta koyu | Açık gri gövde metni | Okunabilirlik ve mobil şikâyeti |
| Durum renkleri | Başarı, hata, bekleme bildirimi | Marka rengiyle birleştirme | Kullanıcı mesajı yanlış okuyor |
| Çizgi / ayraç | Tablo satırı, form bölümü | Kalın ve koyu ayraçlar | Panel kalabalık ve eski görünüyor |
Markanı Yazılıma Nasıl Sokacağını Bilmeyen Herkes Aynı Hatayı Yapıyor
En yaygın hata, renk değişikliğini şablon dosyalarının içine girip elle yapmaktır. Bugün üç dosyada değiştirirsin, yarın yeni bir modül eklenir, o modül eski rengi taşır. Doğru yol tek bir kaynakta tanımlamaktır: yazılımın tema ayarlarında rengi bir kez tanımla, arayüzün tamamı oradan beslensin. Pinova'nın tema katmanı tam olarak bunun için var; marka renklerini ve font ailesini merkezi olarak tanımlıyorsun, ürün kartından fatura ekranına kadar her bileşen aynı değeri okuyor. Detayları özellikler bölümünde görebilirsin.
Bu yaklaşımın ikinci faydası geri alınabilirlik. Kampanya döneminde geçici bir vurgu rengine geçmek istediğinde tek değeri değiştirip tüm siteyi dönüştürürsün, kampanya bitince eski değere dönersin. Elle müdahale eden satıcı bu esnekliği hiç yaşamaz; her sezon değişikliği onun için yarım günlük bir kazı çalışmasına dönüşür. Bir e-pin satış scriptinde marka uyarlaması, dosya düzenleme işi değil, konfigürasyon işidir. Bu ayrımı kavrayan satıcı yılda onlarca saat kazanır.
Font Seçimi Sepet Terk Oranını Neden Sessizce Yükseltiyor?
Dijital ürün satışında kullanıcı sürekli sayı okur: bakiye, fiyat, kupon kodu, sipariş numarası, e-pin dizisi. Dekoratif bir başlık fontunu gövdeye de uygularsan sıfır ile büyük O, bir ile küçük l birbirine karışır. Müşteri kodu yanlış okur, destek biletini açar, sen zaman kaybedersin. Bu yüzden gövde ve sayı alanlarında rakamları net ayrışan, mümkünse sabit genişlikli bir font tercih edilir. Başlıkta karakter isteyebilirsin ama gövdede tek amaç okunabilirliktir.
İkinci nokta boyut ve satır yüksekliği. Mobilde gövde metnini 14 pikselin altına düşürmek, kullanıcıyı yakınlaştırmaya zorlar; yakınlaştırma yapan kullanıcı düzeni bozar ve genelde geri döner. Gövde için 15-16 piksel, satır yüksekliği için 1,6 civarı bir değer neredeyse her epin yazılım arayüzünde güvenli sonuç verir. Font sayısını da ikide tut: bir başlık, bir gövde. Üçüncü font eklemek sayfanın yükleme süresini uzatır, tutarlılığı bozar ve profesyonel görünümü zedeler.
Marka uyarlamasında emeğin gerçek dağılımı
- Renk rolleri ve kontrast kurgusu 45%
- Tipografi ve okunabilirlik 25%
- Logo, ikon ve görsel varlıklar 20%
- Küçük düzeltmeler ve test 10%
Kontrast ve Erişilebilirlik: Kimsenin Konuşmadığı Para Kaybı
Açık gri zemin üstüne açık gri yazı, ekran parlaklığı yüksek bir ofiste güzel görünür. Aynı metin, güneş altında telefonla bakan kullanıcıda tamamen kaybolur. Dijital ürün alan kitlenin büyük kısmı mobilden ve hareket hâlinde alışveriş yapar. Gövde metni için 4,5:1, büyük başlıklar için 3:1 kontrast oranını sağlamak yasal bir zorunluluk değil, doğrudan ciro meselesidir. Okunmayan teslimat notu, okunmayan iade koşulu demektir; okunmayan iade koşulu da açılan destek bileti demektir.
Buton durumlarını da ihmal etme. Normal, üzerine gelme, basılı ve devre dışı durumlarının görsel olarak ayrışması gerekir. Özellikle devre dışı buton, gerçekten pasif göründüğünde kullanıcı boşuna tıklamaz; benzer görünen bir butona tıklayıp tepki alamayan kullanıcı ise siteyi bozuk sanır. Arayüz güveni, teknik güvenden önce gelir; çünkü müşteri altyapını göremez, sadece ekranını görür.
| Kontrol adımı | Nasıl bakılır | Beklenen durum | Durum |
|---|---|---|---|
| Marka rengi tek kaynakta tanımlı | Tema ayarı üzerinden değiştirip yenile | Tüm sayfalar aynı anda değişiyor | Zorunlu |
| Ana buton sayfada tek vurgu | Ekranı gözünü kısarak izle | İlk fark edilen öge buton | Zorunlu |
| Gövde metni kontrastı | Kontrast aracıyla ölç | 4,5:1 ve üzeri | Zorunlu |
| Rakamlar net ayrışıyor | 0-O ve 1-l karşılaştır | Karışma yok | Zorunlu |
| Font ailesi sayısı | Yüklenen font listesini kontrol et | En fazla iki aile | Önerilir |
| Buton durumları ayrışıyor | Hover ve pasif hâli dene | Görsel fark belirgin | Önerilir |
| Logo koyu ve açık zeminde çalışıyor | Her iki zeminde deneme | Kenar kaybı yok | Önerilir |
| Fatura ve e-posta şablonu uyumlu | Test siparişi oluştur | Site ile aynı marka dili | Kritik |
Ekranını gözünü kısarak izle. Bulanık görüntüde ilk fark ettiğin şey ana eylem butonu değilse renk hiyerarşin ters kurulmuş demektir. Bu test otuz saniye sürer ve pahalı tasarım denetimlerinin çoğundan daha isabetli sonuç verir.
Tek Renk Değil Renk Sistemi: Token Mantığını Kavrayınca Her Şey Değişiyor
Profesyonel yaklaşım renkleri ada göre değil role göre tanımlamaktır. "Turuncu" diye bir değişken tanımlarsan ileride yeşile geçmek istediğinde adı yanlış kalır. Onun yerine "birincil eylem", "yüzey", "metin güçlü", "metin yumuşak", "kenarlık" gibi roller tanımla ve her role bir değer ata. Bu yapı dijital ürün satış scriptinde yeni modül eklerken de işini kolaylaştırır: yeni bileşen rolleri kullanır, otomatik olarak markana uyar.
Aynı mantık tipografi için de geçerli. Tek tek piksel yazmak yerine ölçek tanımla: küçük etiket, gövde, alt başlık, başlık, dev başlık. Beş kademe çoğu panel için fazlasıyla yeter. Kademeleri sabitlediğinde sayfalar arasında ritim oluşur ve kullanıcı nerede ne bulacağını öğrenir. Bu öğrenme, ikinci siparişin ilkinden daha hızlı gelmesinin sessiz sebebidir. Paket seçenekleri ve neyin hangi sürümde açık olduğunu fiyat bölümünde karşılaştırabilirsin.
Uyarlamayı Bir Kere Yapıp Bitirmek Mümkün mü?
Hayır, ama sürekli uğraşmak da gerekmiyor. Doğru kurgu şu: ilk hafta renk rollerini ve tipografi ölçeğini kur, sonra üç ayda bir yarım saatlik bir gözden geçirme yap. Bu gözden geçirmede yeni eklenen sayfaların sisteme uyup uymadığını, kampanya için açtığın geçici renklerin kapandığını ve e-posta şablonlarının hâlâ site diliyle konuştuğunu kontrol edersin. Böyle bir ritim, markanın zamanla dağılmasını engeller.
Unutma, müşteri markanı bir logo olarak değil bir deneyim tutarlılığı olarak hatırlar. Ana sayfada gördüğü turuncu butonla ödeme ekranında gördüğü buton aynıysa, bakiyesini yüklerken duraksamaz. Aynı deneyim e-posta bildiriminde de sürüyorsa, bir sonraki alışverişte doğrudan sana gelir. Görsel tutarlılık, reklam bütçesi harcamadan elde edilen en ucuz müşteri sadakati aracıdır.
Markanı Yazılıma Yarım Günde Oturt
Renk rolleri, tipografi ölçeği ve marka varlıkları merkezi tema katmanından yönetilsin; sen ürün ve satışa odaklan.
Marka rengimi değiştirmek için kod bilmem gerekiyor mu?
Gerekmiyor. Renkler tema katmanında rol bazlı tanımlı olduğu için panelden değeri güncellemen yeterli; arayüzün tamamı yeni değeri okur.
Kaç farklı font kullanmalıyım?
İki aile idealdir: biri başlıklar, biri gövde ve sayısal alanlar için. Üçüncü font hem yükleme süresini uzatır hem görsel tutarlılığı bozar.
Koyu tema şart mı?
Şart değil. Tek temayı kusursuz yapmak, iki temayı yarım bırakmaktan daha iyi sonuç verir. Koyu temayı ancak kitlen açıkça talep ediyorsa ekle.
Logomu yükledim ama kenarları bozuk görünüyor, sebebi ne?
Genellikle düşük çözünürlüklü veya arkaplanı beyaz gömülü bir dosya kullanılıyor. Şeffaf arkaplanlı ve yüksek çözünürlüklü bir sürüm yüklemek sorunu çözer.
Renk ve font uyarlamasını okumakla yapmak arasındaki fark, on beş dakikalık bir denemeyle kapanır. Kendi marka renginin gerçek bir panelde nasıl durduğunu görmek istiyorsan canlı demo üzerinden ürün kartlarını, ödeme akışını ve buton hiyerarşisini kendi gözünle incele; sonra bu yazıdaki kontrol listesini kendi sitene uygula.

