İçeriğe geç
Ali Akkaya
(Vaka 02 — SuperApp / Mobilite)Tüm projeler

Macellan SuperApp

(Giriş)

Macellan SuperApp, ben projeye dahil olduğumda uygulama mağazalarında zaten canlıydı. Benim asıl katkım, 2022'de V2 deneyiminin sıfırdan yeniden ele alınması, yayına taşınması ve sonrasında büyüyen kapsamın tasarım tarafında sürdürülmesi oldu. V2; ödeme, cüzdan, mağazada ödeme, uzaktan sipariş, abonelik, sadakat ve soft-play servislerini daha anlaşılır, ölçeklenebilir ve tutarlı bir mobil ekosistem altında toplamayı hedefliyordu.

(Bağlam)
Macellan · Tüketici superapp / mobil ekosistem
(Rol)
Senior UI/UX Tasarımcısı — V2 sürecinde tek tasarımcı; ana ekran mimarisi, çok servisli akışlar, cüzdan/ödeme, kiosk ve saha cihazı ekranları
(Kapsam)
V2 ana ekran mimarisi, servis hiyerarşisi, cüzdan/ödeme, mağazada ödeme, uzaktan sipariş, sadakat ve abonelik modülleri, soft-play, kiosk ve otobüs biniş/ödeme cihazı ekranları, ekran durumları ve geliştirici teslimatı
(Platform)
iOS / Android · kiosk & saha cihazları
(Durum)
Profesyonel proje
Kalabalık, çok cüzdanlı bir ana ekrandan net ve düzenli bir ana ekrana — V2 — net, düzenli ana ekran
V2 — net, düzenli ana ekran
Kalabalık, çok cüzdanlı bir ana ekrandan net ve düzenli bir ana ekrana — V1 — kalabalık, çok cüzdanlı ana ekran
V1 — kalabalık, çok cüzdanlı ana ekran
(Zorluk)

Problem

SuperApp büyüdükçe her servis ana ekranda görünür olmak ister. Macellan'da ödeme, cüzdan, mağazada ödeme, uzaktan sipariş, abonelik, sadakat ve soft-play gibi birçok servis aynı yüzey için yarışıyordu. Bu yüzden temel problem, ana ekranın kalabalık bir menüye dönüşmeden; kullanıcıyı en sık kullanılan aksiyonlara hızlıca götüren, yeni servisler eklendikçe de bozulmadan büyüyebilen bir yapıya kavuşmasıydı.

Seçili görseller

Ödeme, cüzdan, mağazada ödeme, uzaktan sipariş, sadakat ve abonelik servislerini; mobil, kiosk ve saha cihazları boyunca kalabalık bir menüye dönüşmeden tek ve net bir yapı altında toplayan çok servisli bir superapp.

(10)
Macellan SuperApp — 1
Macellan SuperApp — 2
Macellan SuperApp — 3
Macellan SuperApp — 4
Macellan SuperApp — 5
Macellan SuperApp — 6
Macellan SuperApp — 7
Macellan SuperApp — 8
Macellan SuperApp — 9
Macellan SuperApp — 10
(Etki)

Macellan SuperApp'in V2 deneyiminin yeniden tasarlanıp yayına alınmasında aktif rol aldım. V2 ile mağazada ödeme, uzaktan sipariş, abonelik paketleri, sadakat kartları, soft-play, kiosk ve saha cihazı ekranları daha net, ölçeklenebilir ve yeniden kullanılabilir bir ürün yapısı altında toplandı.

  1. 01App Store ve Google Play'de canlı; uygulama 1M+ kullanıcıyı geçti.
  2. 02Mağaza puan ortalaması 4,8.
  3. 03V2, yeniden kullanılabilir gezinme, kart, akış, servis modülü ve durum kalıpları üzerine kuruldu.
  4. 04Kapsam, 50+ sayfalık konsept setten mobil, kiosk ve saha cihazları boyunca 440+ ekrana genişledi.
(Rol & ekip)

Ürün ben dahil olduğumda zaten canlıydı; rolüm V2 yeniden kurgusu ve büyüyen kapsamın tasarımıydı. UI/UX tarafında tek tasarımcı olarak çalıştım. Başlangıçta bir ekip liderim vardı; ayrılmasının ardından tasarım sorumluluğu büyük ölçüde bana geçti. Grafik tasarım tarafında destek veren bir ekip arkadaşım vardı. Erken aşamada Wlitz ajansıyla UX desteği alındı; kullanıcı testleri yapıldı ve V2 için 50+ sayfalık ilk konsept set oluşturuldu. Sonrasında kapsam 440+ ekrana büyüdü; bu ekranların üretimi, varyasyonları, durumları ve geliştiriciye teslimi benim sorumluluğumda ilerledi. Ürün sahipleri, mobil geliştiriciler, backend, pazarlama ve operasyon ekipleriyle birlikte çalıştım.

(Kararlar)

Temel ürün kararları

  1. 01Ana ekranı cüzdan görünürlüğü ve en sık kullanılan aksiyonlar etrafında kur.
  2. 02Bakiye, ödeme ve yükleme gibi yüksek frekanslı işlemleri yüzeye yakın tut.
  3. 03Sadakat, abonelik, uzaktan sipariş ve diğer servisleri öngörülebilir bir hiyerarşiye yerleştir.
  4. 04Servisleri tek tek ekranlar olarak değil, aynı sistemin modülleri olarak ele al.
  5. 05Mobil, kiosk ve saha cihazları arasında tutarlı bir ürün dili taşı.
  6. 06Yeni servisler eklendikçe ana ekran ve akışlar bozulmadan büyüyebilsin.
(Akış & sistem)

Akış ve sistem tasarımı

Yapı, hızlı aksiyonları servis keşfinden ayırır. Bakiye, ödeme ve yükleme kullanıcıya yakın dururken; sadakat, abonelik, uzaktan sipariş ve diğer modüller daha düzenli bir hiyerarşi içinde konumlanır. Aynı mantık kiosk ve saha cihazı ekranlarına da taşınarak ürünün farklı temas noktalarında tutarlı çalışması sağlandı.

(Arayüz)

Arayüz sistemi

Arayüz sistemi; cüzdan kartları, servis kutucukları, liste satırları, kampanya/modül blokları, onay ekranları, durum bileşenleri, kiosk ve cihaz ekranlarını kapsadı. Ortak boşluk, tipografi, kart, liste ve durum kuralları sayesinde iOS, Android ve cihaz yüzeyleri aynı ürün dilini koruyacak şekilde tasarlandı.

(Durumlar)

Uç durumlar & durumlar

  1. 01Boş cüzdan, bekleyen bakiye yükleme ve başarısız ödeme durumları.
  2. 02Sadakat seviyesi değişiklikleri ve abonelik yenileme / sona erme durumları.
  3. 03İlk kez kullanan kullanıcı ile çok sayıda aktif servisi olan kullanıcı arasındaki farklar.
  4. 04Uzun servis adları ve yerelleştirme ihtiyaçları.
  5. 05Kiosk kullanımı ve saha cihazı ekranlarındaki farklı işlem durumları.
(Handoff)

Geliştirici teslimatı

Ana ekran mimarisi, çok servisli akışlar, yeniden kullanılabilir mobil desenler, kiosk ve saha cihazı ekranları durum açıklamalarıyla birlikte teslim edildi. Teslimat; modüllerin sisteme nasıl ekleneceğini, aksiyonların nereden erişilebilir kalacağını ve her yüzeyin aynı etkileşim ritmini nasıl koruyacağını açıklayacak şekilde hazırlandı.

(Sonraki)

Sırada neyi geliştiririm

Ana ekranın gerçek kullanıma daha iyi yanıt verebilmesi için hafif bir kişiselleştirme katmanı eklerdim. Ayrıca cüzdan, sadakat ve abonelikler arasında geçişi daha sürekli hissettirmek için servisler arası gezinmeyi sıkılaştırırdım.