Vela, “wellness” ve “vitality” kelimelerinin birleşiminden adını alan, sağlığa dair her şeyi takip edebileceğiniz, kendinizi geliştirmek için hedef koyabileceğiniz ve yapay zeka asistanı ile desteklenen kişiselleştirilebilir bir evrensel takipçi uygulamasıdır. Farkındalık, egzersiz, beslenme ve uyku verilerinizi tek bir yerden yöneterek yaşam kalitenizi artırmanıza yardımcı olur.
Renk Paleti ve Tasarım Dili
Ana renkleri, eşit hue aralıklarıyla OKLCH renk uzayında seçtim. OKLCH, insan odaklı ve ton kayması yaşamayan özel bir renk uzayıdır, dolayısıyla seçilen dört ana rengin parlaklığı insan gözünde aynı şekilde algılanır (Bu siteyi görüntülediğiniz ekran ve tarayıcı bu durumu etkileyebilir). Seçilen renkleri uygulamanın dört ana kategorisine atadım, böylece kullanıcılar yazıları okumadan bile fonksiyonları birbirinden ayırabilir. İkincil ve üçüncül tonlarını ise yalnızca eşit olarak parlaklık değeri değiştirilerek elde ettim.
Giriş Ekranı
Fiziksel ve mental sağlığı birleştirmek amacıyla; EKG nabız çizgisi, yaprak, ve kalp formlarını harmanlayan bir lineart logo tasarladım. Logotipi ise hazır bir font yerine geometrik olarak çizilen özel harflerle oluşturdum. Uygulamanın ana rengi olarak egzersiz temasını öne çıkaran zümrüt yeşilini tercih ettim.
Dört konuyu (egzersiz, diyet, farkındalık, uyku) aynı anda ele alan bir yapı olduğu için “everything tracker” yani “evrensel takipçi” sloganını türettim. Kullanıcının boy-kilo gibi temel bilgileri olmadan uygulamanın çalışamayacağı düşüncesiyle, “xyz ile devam edin” yerine doğrudan kayıt olma butonları yerleştirdim. Buton boyutları, Google ve Apple tasarım kılavuzlarına uygun şekilde belirlenmiştir.
Onboarding
Kullanıcı kaybını önlemek adına onboarding sürecini minimal tuttum. Girilen bilgiler, uygulamanın sensör verilerini toplayarak çalışır hale gelmesi için yeterli; ek bilgiler kullanıcı tarafından profil sayfasından doldurulabilir. Veri girişini, uygulamanın genelinde kullanılan standart kart ve buton sistemiyle sundum; kartları ve ikonları kategorilerine göre renklendirdim.
Ana Ekran
Koyu tema üzerine tasarlanan arayüzde, kartların “elevated” (yükseltilmiş) duruşunu alt kısımlardaki renkli stroke’larla vurguladım. Bu detay, arayüze hafif bir 3D derinlik kattı. Ekran düzeni oluşturulurken, kullanıcının parmak erişim ergonomisini ve öncelik sıralamasını temel aldım. En zor ulaşılabilen üst kısma günlük motivasyon sözünü yerleştirirken, asıl etkileşimin gerektiği kartları daha erişilebilir bölgelere aldım. Düzen hiyerarşisi şu şekildedir:
- En üst kısma günlük/periyodik motivasyon sözü.
- Uygulama ilk açıldığında en çok ihtiyaç duyulan günlük liste, adım ve kalp verileri.
- Gün içinde sıkça kullanılan kartlar, tek bir kaydırma ile ulaşılabilen ikinci ekran alanı.
- En alt kısımda günde sadece bir kez kullanılması gereken uyku kartı.
Ana Ekran – Bottom Drawer
Görsel karmaşıklığı azaltmak ve kullanıcı deneyimini iyileştirmek amacıyla, kategori kartlarına ait detaylı bilgiler ana ekrana değil, kartlara tıklandığında açılan “bottom drawer” yapılarına yerleştirdim. Bu sayede daha kompakt bir arayüz sunulurken, menü derinliği sadece bir tıklama artırılarak hıza odaklanıldı. Drawer yapılarının yükseltilmiş hissiyatı, yukarı yönlü gölgelendirme (drop shadow) teknikleriyle desteklendi.
Keşfet Sayfası
Keşfet sayfası, favoriler, isim ile arama ve detaylı filtreleme seçeneklerini içeren bir başlık yapısına sahip. Hızlı filtreleme için sık kullanılanları gösteren etiket (tag) sistemi kullandım. Kartlar kısmında kullanıcının uygulama içi aktivite ağırlığına göre, günlük, haftalık veya aylık rekabet yarışmaları dinamik olarak gösterilmekte. Sayfa içeriği, “infinite scroll” özelliğine sahip masonry (duvar örgüsü) düzeninde sunuldu. Kullanıcılar kartların renkleri ve üzerindeki etiketler üzerinden hızlıca görsel bilgi alıp, ilgi duydukları içeriklere tıklayarak tam ekran detayları görebilirler. Sosyal özellikler ve ürün/reklam yerleştirmeleri bu sayfada konumlandırılabilir.
VelAI – Yapay Zeka Asistanı
VelAI, kullanıcıyı yapay zeka kullanımına teşvik etmek adına farklı kategorilerde örnek sorular sunar. Sorular, uygulama her açıldığında rastgele değişerek yapay zeka kullanmaya çekingen kullanıcıları cesaretlendirebilir. Yapay zeka mesajları, düz metin formatında iletilmek yerine “tool calling” veya “structured json output” özellikleri kullanılarak uygulama formatına uygun bir yapıda iletilir. Bu sayede formatlı veriler, doğrudan günlük hedeflere aktarılabilir ve kullanıcı açısından işlevsellik önemli ölçüde artırılır.
Profil
Profil bölümünde uygulama ayarları (bildirim tercihleri, hesap bilgileri), kişisel tercihler (günlük kalori-adım hedefleri, streak gereksinimleri) ve rozet tabanlı bir başarım sistemi yer alır. Belirli seviyelere ulaşan kullanıcıların profillerinde belirgin etiketler görünerek sosyal etkileşim ve kullanıcı bağlılığı artırılır.
Profilde de tasarım konseptine sadık kalarak; kartlarda özet bilgi, tıklama ile açılan bottom drawerlarda detay bilgilerini sundum.
Duolingo ve Snapchat gibi uygulamaların ekiplerinin yaptığı analizlere göre, en basit “streak” özelliği bile kullanıcının etkileşim süresini artırdığı gözlemlenmiştir. Bu nedenle oyunlaştırma öğeleri ve görsel rozetler uygulamada önemli yer ayırdım.
Profil – Bottom Drawer
Ana ekrandaki gibi, profilde de detaylı bilgiler tıklama ile açılan bottom drawer içinde gösterdim. Kullanıcı buradan haftalık hedef ilerlemesini ve istatistiklerini takip edebilir.