Kullanıcıların gördüğü tüm sayfalar ve deneyim
Kullanıcıların müzik dinlerken etkileşime girdiği tüm frontend (ön yüz) sayfalarını tasarladık. Telefon, tablet ve bilgisayarda mükemmel görünen, hızlı ve kullanımı kolay bir arayüz oluşturduk.
Siteyi açtığında modern ve şık bir arayüz karşılar
Telefon, tablet veya bilgisayar - her cihazda rahat kullanır
Sayfa geçişleri hızlı ve akıcı, bekleme yok
Trend, yeni eklenenler, öneriler
Kategoriler, türler, ruh halleri
Şarkı bilgisi, şarkı sözleri
Favoriler, playlistler, ayarlar
Kullanıcı siteyi açtığında ve sayfa geçişlerinde perde arkasında şunlar gerçekleşir:
Livewire + wire:navigate ile sayfa geçişleri tam yenileme olmadan yapılır. Sadece değişen içerik güncellenir, player kesintisiz çalmaya devam eder.
Tailwind CSS utility sınıfları ile her ekran boyutuna uyum sağlanır. md:, lg: prefix'leri ile breakpoint kontrolü yapılır.
Modal, dropdown, accordion gibi interaktif öğeler Alpine.js ile yönetilir. Sayfa ağırlığı minimumda tutulur, JavaScript bundle küçük kalır.
CSS değişkenleri (--color-primary) ile tema renkleri merkezi yönetilir. Karanlık tema göz yorgunluğunu azaltır, müzik dinleme deneyimini artırır.
Görseller loading="lazy" ile gecikmeli yüklenir. WebP formatı, kritik CSS inline, font-display: swap ile performans optimize edilir.
İlk sayfa yüklemesi sunucuda render edilir (Blade + Livewire). SEO dostu, hızlı FCP (First Contentful Paint) sağlanır.
Kullanıcının gördüğü ön yüz
Butonlar, menüler, görseller - görünen her şey
Ekran boyutuna göre uyum sağlama
Telefon ve bilgisayarda farklı ama düzgün görünüm
Single Page Application - Tek Sayfa Uygulama
Sayfa yenilenmeden geçişler yapılır
Karanlık tema tasarımı
Gece kullanımda göz yormayan koyu renkler