Ana içeriğe geç
Altın Örümcek'te üç projemizle finaldeyiz.Oy verin ↗
Projelerimiz / Talkstar
Talkstar logo

Talkstar: İçerik Üreticilerini Kitleleriyle Canlı Buluşturan Bir Uygulama Tasarlamak

KULLANILAN HİZMETLERÜrün Ortaklığı
SEKTÖRİçerik Üretici Ekonomisi / Canlı Yayın
HİZMETMobil uygulama
DURUMyayında
Talkstar: İçerik Üreticilerini Kitleleriyle Canlı Buluşturan Bir Uygulama Tasarlamak
BRIEF

İçerik üreticilerinin canlı sohbetler düzenlemesini, bu sohbetlerle kitlelerini büyütmesini ve gelir elde etmesini sağlayan bir mobil platform.

Talkstar'ın vaadi basit: uzmanları canlı dinlemek. İçerik üreticilerinin dakikalar içinde oturum hazırlayabildiği, moderasyonu güvenle yönetebildiği ve ilgiyi kalıcı bir etkileşime çevirebildiği bir deneyim tasarladık. İzleyiciler içinse keşif doğal, katılım zahmetsiz: Dokunup katılıyor, tepki veriyor, bahşiş bırakıyor, abone oluyorlar.

Erken prototiplerde yeni kullanıcılar daha ilk dakikada takılıyordu: Uygulamanın ne vaat ettiği net değildi, canlı oturumlar da fazla yorucuydu. Bu yüzden ilk 30 saniyeyi kazanmak, işin en kritik parçası oldu.

iOS ve Android için uçtan uca UX ve UI tasarımını üstlendik. Bunu ölçeklenebilir bir tasarım sistemi ve geliştiricilere eksiksiz bir teslimle destekledik. Uygulama bugün App Store'da yayında ve içerik üreticilerini izleyicileriyle gerçek zamanlı buluşturuyor.

6
Ay süren çalışma
iOS ve Android
Tasarlanan platformlar
Uçtan uca
UX/UI tasarımı
İlk 30 saniyeyi kazanmak
01 · ODAK

Zorluk

Tasarım yaklaşımımızı birbirine bağlı üç zorluk şekillendirdi:

İlk 30 saniyeyi kazanmak. Erken aşama prototiplerde uygulamayı ilk kez açan kullanıcılar daha girişte duraksıyordu: değer önerisi yeterince net değildi ve tanıtım akışı çok erken, çok fazla şey istiyordu. Canlı oturum akışları teknik olarak sağlamdı ama zihinsel olarak fazla yorucuydu. Yeni içerik üreticileri nasıl canlı yayın başlatacağından, izleyiciler de bir oturuma katıldıktan sonra ne yapacağından emin değildi.

Canlı yayının enerjisini performansla dengelemek. Gerçek zamanlı arayüzler kullanıcıyı etkileşime çağırır: tepkiler, söz istekleri, bahşişler, anketler. Ama eklenen her özellik o anı yavaşlatabilir ya da ekranı kalabalıklaştırabilir. İlk bilgi mimarisi benzer işlemleri birden çok ekrana dağıtmıştı. Bu da mobilde hem kullanıcıyı elde tutmayı hem de uygulamanın kolayca öğrenilmesini zorlaştırıyordu.

Farklı roller, farklı ihtiyaçlar. İçerik üreticileri, moderatörler ve izleyiciler aynı ekranları kullanıyor ama hedefleri farklı. Roller arayüzde net biçimde ayrışmadığı için en yoğun anlarda (konuşmacı sırası, söz devri, susturma, şikâyet) kontrolün kimde olduğu belirsizleşiyordu.

F1Girişteki tereddüt
F2Zihinsel yükü azaltmak
F3Role göre farklılaşan ihtiyaçlar
Talkstar: İçerik Üreticilerini Kitleleriyle Canlı Buluşturan Bir Uygulama Tasarlamak · Zorluk
Canlılık, netlik ve özen
02 · UYGULAMA

Çözüm

Ürünü üç ilke üzerine kurduk: canlılık, netlik ve özen.

Canlılık – Orada olma hissini güçlendiren hareket ve geri bildirim:
Durum değişiklikleri (katılma, el kaldırma, mikrofonu açma/kapama) için hafif bir hareket sistemi kurduk: gecikmesiz hissettiriyor ve hiçbir zaman yalnızca süs için kullanılmıyor. Kritik işlemlerde (söz isteme, bahşiş) arayüz, sunucunun yanıtını beklemeden sonucu hemen gösteriyor (optimistic UI); bir hata olursa işlem sorunsuzca geri alınıyor.

Netlik – Her adımda daha az zihinsel yük:
İlgi alanı etiketleriyle tek bir yoldan ilerleyen bir tanıtım akışı tasarladık. Rol seçimi (İçerik Üretici / İzleyici), kullanıcı için sıradaki en uygun adımı belirliyor. Canlı kontrolleri tek bir panelde topladık: konuşmacı sırası, moderasyon, tepkiler ve gelir. Gezinme kalıpları öngörülebilir, iç içe ekranlar daha az ve bilgi mimarisi daha derli toplu.

Özen – Erişilebilirlik ve güven en baştan tasarımın içinde:
AA/AAA kontrast hedefleri için renk ve tipografi token'ları tanımladık, dinamik yazı boyutunu destekledik ve titreşimli geri bildirimi işlemin önemine göre ayarladık. Güvenlik akışlarını (şikâyet et, engelle, moderatöre devret) kolayca bulunacak ama göze batmayacak şekilde tasarladık.

Talkstar: İçerik Üreticilerini Kitleleriyle Canlı Buluşturan Bir Uygulama Tasarlamak · Çözüm
Deneyimi belirleyen dört an
03

Deneyimden öne çıkanlar

Güçlü karşılama: cesur bir ilk izlenim
Degrade ağırlıklı bir görsel ve kısa bir değer önerisi ("Katıl. Öğren. Yayına gir.") uygulamanın amacını saniyeler içinde anlatıyor. İlk ekran uygulamanın özelliklerini değil, canlı sohbet odasındaki deneyimi öne çıkarıyor.

Rehberli tanıtım akışı: yeni kullanıcılar için zahmetsiz başlangıç
İlgi alanı etiketleri ve rol seçimi, ilk işleme giden yolu kısaltıyor. İçerik üreticilerinin karşısına, varsayılan ayarları hazır bir "Oturum Başlat" adımı çıkıyor. İzleyiciler ise doğrudan ilgi alanlarına uygun canlı yayınların listesine geçiyor.

Akıllı ana ekran: doğal bir keşif deneyimi
Tek bir akış gündemdeki uzmanları, kategorileri ve şu anda canlı olan yayınları bir araya getiriyor. Yaklaşan oturumlara ve kaydedilen içerik üreticilerine ikincil ama net yollarla ulaşılıyor. Kartlar, hızlı karar vermeye yetecek kadar bilgi taşıyor.

Canlı oda: karmaşasız kontrol
Konuşmacı sırası, el kaldırma, mikrofon, tepkiler, bahşiş ve moderasyon tek bir panelde bir araya geliyor. Öncelikli işlemler başparmağın kolayca ulaştığı yerde duruyor, daha seyrek kullanılanlar ise ayrı bir menüde toplanıyor.

Talkstar: İçerik Üreticilerini Kitleleriyle Canlı Buluşturan Bir Uygulama Tasarlamak · Deneyimden öne çıkanlar
Netlik ve etki için Deneyim Döngüsü
04

Tasarım süreci

Deneyim Döngüsü yöntemini izledik. Bu yöntemi, tasarımın her aşamasında netliği, uyumu ve ölçülebilir etkiyi güvence altına almak için kurguladık.

1. Odak: Doğru sorunu tanımlamak
Paydaşlarla Talkstar'ın temel vaadi üzerinde uzlaştık: insanın kendini orada hissettiği canlı öğrenme. Keşif atölyeleri ve rakip analizleriyle, hem içerik üreticilerinin hem izleyicilerin yolculuğunda takıldıkları noktaları haritaladık.

2. Araştırma: Bağlamı ve davranışı anlamak
Canlı ses ve video platformlarında (Twitter Spaces, Clubhouse, TikTok Live) kullanıcı davranışlarını inceledik ve zihinsel olarak takıldıkları üç alan belirledik: girişteki tereddüt, canlı yayındaki belirsiz hiyerarşi ve gözden kaçan işlevler.

3. Mimari: Akışı ve etkileşimi kurgulamak
Bilgi mimarisini, kullanıcının canlı anı kesintisiz yaşaması fikri üzerine yeniden kurduk. Katılmaktan tepki vermeye ve konuşmaya kadar her işlem tek bir akışın parçası gibi hissettirmeliydi. İçerik Üretici, Moderatör ve İzleyici rollerini tek ve ortak bir akışta bir araya getirdik.

4. Üretim: Deneyimi tasarlamak
Tekrarlayan tasarım döngüleriyle tanıtım akışı, canlı oda ve keşif ekranları için orta ve yüksek doğrulukta prototipler hazırlayıp test ettik. Görsel ve hareket tasarımında enerjiye ve netliğe odaklandık.

5. Gelişim: Sistemleştirmek ve ölçeklemek
Son aşamada tasarım mantığını modüler, token tabanlı bir sisteme ve iOS ile Android için kapsamlı bir dokümantasyona dönüştürdük.

Talkstar: İçerik Üreticilerini Kitleleriyle Canlı Buluşturan Bir Uygulama Tasarlamak · Tasarım süreci
GALERİ
Talkstar
Talkstar — gallery 1
1 / 4
SONUÇ
İçerik üreticileri için canlı sesli sohbet.
Canlıda görün ↗
PAYLAŞLinkedInWhatsApp
✓ Deneyim Döngüsü · Araştırma metodolojisi
✓ iOS ve Android · Uçtan uca mobil UX/UI
✓ Tasarım sistemi · Bileşen tabanlı
✓ Prototipler · Etkileşimli akışlar