E-Ticaret Tasarım Paketleri
E-ticarette tasarımın işi güzel görünmek değil, sepete eklemeyi kolaylaştırmak.
- Dört kritik ekran
- Mobil öncelikli
- Varyant netliği
- Boş ve hata durumları
Bir e-ticaret arayüzü dört ekranda kazanır ya da kaybeder: kategori, ürün detay, sepet, ödeme. Ana sayfa önemlidir ama ziyaretçilerin çoğu aramadan doğrudan kategori ya da ürün sayfasına düşer.
Ekran ekran yaklaşım
Kategori
Filtrelerin mobilde nasıl açılacağı, kaç ürün gösterileceği, sıralama seçenekleri, stok bilgisinin kart üzerinde görünmesi. Otomotiv gibi uyumluluk gerektiren kataloglarda araç seçici en üstte ve kalıcı olur.
Ürün detay
Varyant seçimi tek bakışta anlaşılmalı; stokta olmayan varyant gri değil, açıklamalı olmalı. Kargo süresi, iade koşulu ve stok durumu sepete ekle butonunun yakınında durur — aşağı kaydırılarak bulunan bilgi yok sayılır.
Sepet
Ücretsiz kargo eşiğine ne kadar kaldığı, kupon alanı, tahmini teslim tarihi. Sepette yapılan her ek tıklama kayıp demektir.
Ödeme
Zorunlu alan sayısı minimumda, misafir alışverişi açık, hata mesajları alanın yanında. Ödeme adımı tasarımın en çok para kazandıran ve en çok ihmal edilen ekranıdır.
Mobil öncelikli
Trafiğin çoğu mobil; tasarım küçük ekrandan başlar. Dokunma hedefleri 44px’ten küçük olmaz, yapışkan sepet butonu uzun ürün sayfalarında ekranda kalır.
Teslim
- Figma kaynak dosyası ve bileşen kütüphanesi
- Mobil + masaüstü düzenler, boş durum ve hata ekranları dahil
- Altyapıda uygulanabilirlik notları
Öne çıkanlar
Dört kritik ekran
Kategori, ürün detay, sepet ve ödeme önce düşünülür.
Mobil öncelikli
Tasarım küçük ekrandan başlar; dokunma hedefleri 44px+.
Varyant netliği
Stokta olmayan varyant açıklamalı gösterilir, sessizce gizlenmez.
Boş ve hata durumları
Sonuç yok, stok yok, ödeme hatası ekranları da tasarlanır.
Uygulanabilir
Altyapının desteklediği ekranlar; “yapılamaz” tasarım yok.
Nasıl çalışıyoruz
- 01
Veri ve akış
Katalog yapısı, varyant modeli ve mevcut dönüşüm verisi inceleniyor.
- 02
Yerleşim
Dört kritik ekranın wireframe’i ve onayı.
- 03
Arayüz
Görsel dil ve ekran tasarımları.
- 04
Kütüphane ve teslim
Bileşenler, durum ekranları, geliştirici notları.