Marka Kimliğini Dijitalde Güçlendirmek İsteyen KOBİ’ler İçin UI/UX Tasarım
Sitede bir mavi, teklif belgesinde başka bir mavi, sunumda üçüncüsü… Marka dağıldığında sorun zevkte değil, ortak bir kaynağın olmamasında. Renk, tipografi ve bileşenleri tek bir tasarım sistemine bağlıyor; ekibinizin yeni ekranı ve belgeyi şablondan üretebildiği bir düzen kuruyoruz.
- Figma kaynak dosyaları sizin
- Ekip büyüklüğüne göre ölçeklenen kapsam
- Şablonlarla ekibiniz kendi üretir
- Kapsam netleşmeden fiyat vermiyoruz
Marka aslında var — ama her dosyada biraz farklı.
KOBİ'lerde marka tutarsızlığı çoğunlukla özensizlikten değil, herkesin elindeki en yakın dosyayı kopyalayarak ilerlemesinden doğuyor. En sık karşılaştığımız tablolar aşağıda.
- Renk kodu kimsede tam yazmıyorLogodan pipetle alınmış üç farklı mavi dolaşıyor. Aynı marka, ekrandan ekrana başka bir tonda görünüyor.
- Her belge sıfırdan yapılıyorYeni teklif, yeni sunum, yeni sosyal medya görseli… Her seferinde en son dosya kopyalanıp üstüne yazılıyor; hatalar da kopyalanıyor.
- Yazı tipi cihaza göre değişiyorKurumsal font lisansı ya da kurulum belli değil. Dosya başka bilgisayarda açıldığında düzen bozuluyor.
- Butonlar ve formlar her sayfada farklıAynı sitede üç farklı buton biçimi var. Ziyaretçi neyin tıklanabilir olduğunu her seferinde yeniden öğreniyor.
- Yeni gelen çalışan neyi kullanacağını bilmiyorDoğru logo dosyası, doğru şablon ve doğru ton bir kişinin bilgisayarında. O kişi izne çıkınca üretim duruyor.
- Ajans değişince her şey baştanKaynak dosyalar dışarıda kaldığı için her yeni iş birliği markayı biraz daha kaydırıyor.
Önce tek kaynak, sonra şablon, en sonda yeni tasarım.
Tasarım sistemini büyük bir proje gibi değil, ekibinizin günlük işini hızlandıran küçük bir altyapı gibi kuruyoruz. Sıra şöyle işliyor.
- Malzeme envanteriBugün kullandığınız site, belge, sunum ve sosyal medya görsellerini topluyor; kaç farklı renk, yazı tipi ve buton biçimi dolaştığını görünür kılıyoruz.TeslimMalzeme envanteriTutarsızlık listesiÖncelikli yüzeyler
- Token setiRenk, tipografi, spacing ve köşe yarıçapı gibi temel kararları tek bir kaynakta adlandırıyoruz. Bundan sonra herkes aynı adı kullanıyor.TeslimRenk ve kontrast paletiTipografi ölçeğiSpacing ve radius token'ları
- Bileşen kütüphanesiButon, form alanı, kart, tablo, uyarı ve navigasyon gibi günlük bileşenleri varyantlarıyla kuruyor; ne zaman hangisinin kullanılacağını yazıyoruz.TeslimBileşen kütüphanesiVaryant ve durum tablolarıKullanım notları
- ŞablonlarEn çok ürettiğiniz yüzeyleri şablona çeviriyoruz: teklif belgesi, sunum, sosyal medya düzeni, açılış sayfası, e-posta imzası.TeslimŞablon kütüphanesiÖrnek doldurulmuş sayfalarVarlık dosyaları
- Devir ve kullanım oturumuSistemi ekibinizle birlikte kullanarak devrediyor; kimin neyi güncelleyeceğini ve yeni ihtiyaçların sisteme nasıl ekleneceğini belirliyoruz.TeslimKullanım rehberiEkip oturumuHandoff dokümanı
Tasarım sisteminiz hangi olgunlukta?
Altı başlıkta bugünkü durumunuza en yakın seçeneği işaretleyin. Araç, bir olgunluk profili ve en zayıf başlıklar için önerdiğimiz ilk adımları gösterir. Hiçbir veri kaydedilmez; hesap tarayıcınızda yapılır.
Altı başlığın hepsini işaretlediğinizde olgunluk kademeniz ve önerilen ilk adım burada görünecek.
- Renk ve tipografi—
- Bileşenler—
- Şablonlar—
- Dil ve ton—
- Logo ve marka varlıkları—
- Sahiplik ve kullanım—
Puanınız ve zayıf başlıklarınız, keşif görüşmesinin gündemini doğrudan oluşturur. Görüşme ücretsizdir ve sizi bağlamaz.
Bu test yönlendirici bir öz değerlendirmedir; bir denetim veya sertifikasyon yerine geçmez. Puanlar, KOBİ ölçeğindeki tasarım sistemlerinde sık karşılaştığımız olgunluk kademelerine göre verilmiştir.
Küçük ekibe göre ölçeklenmiş bir sistem.
Aşağıdakiler bir paket değil, bir menü. İlk fazda genellikle token seti, temel bileşenler ve en çok ürettiğiniz üç dört şablon açılıyor.
- TokenRenk ve kontrast paletiMarka renklerinin adlandırılmış hâli; metin/zemin çiftleri okunabilirlik gözetilerek belirlenir.
- TokenTipografi ölçeğiBaşlık, gövde ve küçük metin için ölçek; yazı tipi lisans ve kurulum notlarıyla birlikte.
- TokenSpacing, radius ve gölgeBoşluk ve köşe kararlarının tek kaynakta toplanması; ekranlar arası ritim tutarlı olur.
- BileşenTemel bileşen kütüphanesiButon, form alanı, kart, tablo, uyarı, navigasyon; varyant ve durumlarıyla.
- ŞablonWeb şablonlarıAna sayfa, hizmet/ürün sayfası ve açılış sayfası düzenleri; yeni sayfa şablondan çıkar.
- ŞablonBelge ve sunum şablonlarıTeklif belgesi, sunum ve raporlama düzenleri; ekip kendi doldurur.
- ŞablonSosyal medya ve e-posta düzenleriTekrarlayan gönderi tipleri ve e-posta imzası için hazır kalıplar.
- TeslimKullanım rehberi ve teslimNe zaman hangi bileşen, hangi ton; handoff dokümanı ve ekip oturumu.
Sistem Figma üzerinde kuruluyor: token'lar, bileşenler ve şablonlar tek dosyada, ekibinizin erişebileceği biçimde duruyor. Geliştirme tarafına geçen kararlar için Figma Dev Mode ölçü ve token çıktıları ile bir handoff dokümanı veriyoruz. Logo ve kurumsal kimlik tarafında boşluk varsa grafik tasarım hizmetimizle aynı proje içinde tamamlanabiliyor.
Sistemi web tarafında uygulamak istediğinizde web tasarım ve web yazılım geliştirme hizmetlerimizle devam edebilirsiniz; site yenilemesi gündemdeyse SEO kaybetmeden taşıma rehberimiz planlamayı kolaylaştırır. Şablonların yaşayacağı ortak çalışma ortamını gözden geçiriyorsanız Microsoft 365 plan karşılaştırmamız küçük ekipler için pratik bir başlangıç noktası.
Küçük ekip için örnek bir 6 haftalık ilk faz
Aşağıdaki plan, token seti, temel bileşenler ve üç dört şablon içeren tipik bir ilk faz için hazırlanmış örnektir. Sizin planınız kapsam netleştikten sonra çıkar ve teklifte yazılı hâle gelir.
| Hafta | Ne yapılır | Hafta sonunda elinizde ne olur |
|---|---|---|
| 1. hafta | Malzeme envanteri | Tutarsızlık listesi, öncelikli yüzeyler |
| 2. hafta | Token seti | Renk paleti, tipografi ölçeği, spacing |
| 3. hafta | Temel bileşenler | Buton, form, kart, tablo, uyarı |
| 4. hafta | Web ve açılış sayfası şablonları | Sayfa düzenleri, örnek doldurulmuş sayfalar |
| 5. hafta | Belge, sunum ve sosyal medya şablonları | Şablon kütüphanesi, varlık dosyaları |
| 6. hafta | Kullanım oturumu ve teslim | Kullanım rehberi, handoff dokümanı |
İlk faz kapandığında ekibiniz yeni bir sayfayı veya belgeyi sıfırdan değil şablondan üretmeye başlıyor; sonraki yüzeyler aynı sisteme sırayla bağlanıyor.
- HizmetUI/UX TasarımHizmetin tamamı: araştırma, akış, prototip, design system ve teslim.
- HizmetGrafik TasarımLogo, kurumsal kimlik ve marka sisteminin temeli.
- HizmetWeb TasarımSistemi kurumsal sitede uygulamaya geçirme.
- HizmetWeb Yazılım GeliştirmeBileşenleri kodda karşılığıyla hayata geçirme.
- ProjeOpencartExtraKendi hizmet markamızı tek dilde kurma denemesi.
- RehberWeb sitesi yenileme: SEO kaybetmeden taşımaYeni tasarıma geçerken arama görünürlüğünü koruma.
- RehberYazılım firması seçerken dikkat edilmesi gerekenlerTeklif karşılaştırırken sorulacak sorular ve kırmızı bayraklar.
- RehberMicrosoft 365 plan karşılaştırmasıŞablonların yaşayacağı ortak çalışma ortamı için pratik başlangıç.
Sık sorulanlar
Kapsam, kurumsal kimlik, ekip kullanımı ve teslimat hakkında en çok sorulanlar.
Elinizdeki malzemelere birlikte bakalım
Bize sitenizi, son teklif belgenizi ve bir sunumunuzu gönderin; ilk görüşmede kaç farklı renk ve yazı tipi dolaştığını birlikte görelim, gerçekçi bir ilk faz kapsamı çıkaralım. Keşif görüşmesi ücretsizdir ve sizi bağlamaz.
- ✓ Keşif görüşmesi ücretsiz
- ✓ Kapsam netleşmeden fiyat vermiyoruz
- ✓ Figma kaynak dosyaları sizde
Büyük marka tutarlılığı, küçük ekip hızıyla
Token seti ve bileşen kütüphanesiyle başlıyor, en çok ürettiğiniz yüzeyleri şablona çeviriyor ve sistemi ekibinize devrediyoruz. Nereden başlayacağınızı birlikte belirleyelim.