Crypto Casino
Torrent Dişli
Arayüz ve UX mobil cihazlarda nasıl uygulanır
1) İlkeler: Mobil UX'in masaüstünden farkı
Tek elle kontrol. Ana CTA'lar (bahis, tekrar, net) "başparmak bölgesinde" (ekranın alt üçte biri).
Önce dikey. Dikey Tablolar/Akışlar - Temel Durum; Yatay bir "film modu'olarak korunur.
Daha az tıklama daha mantıklı. Herhangi bir bahis ≤2 işlem yapmalıdır: bir değer seçmek - alana/hücreye göre dokunun.
Hız güzellikten daha önemlidir. UI'de 60 fps, minimum düzen kayması, "hafif" animasyonlar.
Şeffaflık. Yuvarlak zamanlayıcı, bağlantı durumu, gecikme - açıkça ve göze çarpmayan bir şekilde.
2) Ekran çerçevesi: nereye yerleştirileceği
Üst bölge (bilgi):- Tablo adı, limitler, oyuncu sayacı, ağ/gecikme göstergesi, kurallar/ayarlar simgeleri.
- Video akışı (WebRTC/LL-HLS) veya 3D tablo, bir hareketle kameraları/açıları değiştirme.
- Overlays: zamanlayıcı, son turların sonuçları, bahislerin açılır onayı.
- Bahis paneli: mezhepler, hızlı düğmeler "Tekrarla", "Çift", "Temizle".
- Gizli cüzdan perdesi (denge, hızlı para yatırma - kasiyere git).
- Tablo/oyun anahtarı (yatay kaydırma).
- Etkileşimli, düğmeler arasındaki girinti ≥8dp başına en az 48dp (Android )/44pt (iOS).
- Güvenli alanları dikkate alıyoruz (çentik, hareket navigasyonu).
3) Hızlı bahisler: Mikro etkileşimler
İki adım: bir yüz değeri seçmek - masanın üzerindeki alana dokunun. Tekrarlanan dokunuş - bahsi aynı yüz değeriyle artırır.
Uzun basın: bağlam menüsü (sil, çift, dağıt).
Mezhep panelinde aşağı kaydırın: genişletilmiş değerleri/bahis geçmişini gösterin.
Haptika: Bir bahsi kabul ederken hafif titreşim, daha belirgin - reddederken/geç bahis yaparken.
Durum görünürlüğü: "Bahisleri kabul et "/" Kapalı "- renk/simge + kronometre.
4) Video ve bindirmeler: müdahale etmemek, yardım etmek için
İsteğe bağlı anahtar kare. Kalite değiştirirken - "sabun'dan kaçınmak için anında IDR.
Yarı saydam kartlar. Zamanlayıcı ve sonuçlar - %70-85 şeffaflık, zamanlayıcıya göre otomatik gizleme.
Hareketler:- Videoya çift dokunun - kamera/açı değiştirme.
- Çimdik - video ölçeği (CTA ile çakışmadan).
- "Edge" bildirimleri. Kazanç ve promosyonun push hatları - en üstte, bahis paneliyle çakışmaz.
5) Ağ koşulları ve gecikmeler
Durum hapı: "Online 1. 3 c "/" Kötü ağ 4. 8 c." Simgenin rengi eşiklere göre değişir.
Yumuşak bozulma: önce FPS'yi azaltın (60 - 48 - 30), sonra çözünürlük (1080p - 720p - 540p), arabelleği + 200-300 ms artırın.
Otomatik folback: WebRTC - Kararsız bir ağa sahip seyirci modu için LL-HLS; "Geç" bahisleri bloke etmek.
Çevrimdışı ekran: bahis bağlamını, anlaşılabilir bir nedeni ("Bağlantı yok") ve "Tekrarla" düğmesini kaydetme.
6) Sorumlu oyun ve kontrol
Eldeki sınırlar. Bakiyenin yanındaki "Limitler" düğmesi: depozito/zaman/kayıp, oturum zamanlayıcısı.
Duraklama dakikası. Oyunun 30-45 dakika sonra önerilen duraklama "kırmızı bayraklar" olmadan, yumuşak bir banner.
Geç teklif bloğu. E2e-delay> eşikler - teklif kabul edilmezse, UI nedenini açıklar.
Tarih ve ihracat. Son turlar/bahisler besleme, filtreler, hızlı kontrol dışa aktarma.
7) Metin, renkler, animasyonlar
Tipografi: başlıklar 17-20pt, vücut 14-16pt; WCAG AA +'nın kontrastı.
Renk şeması: "Sinyal" renkleri durumlar için ayrılmıştır (kabul edilen/kapalı/hata).
Animasyonlar: Mikro etkileşimler için 120-180 ms; 240-320 ms - paneller/perdeler için. Kare kare - en fazla 2-3 paralel efekt.
İplikçiler yerine iskeletler. Hızlı aşamalı yükleme istemleri.
8) Navigasyon ve bilgi mimarisi
Alt gezinme (sekme çubuğu): Lobi, Canlı, Promosyonlar, Profil.
Canlı İçinde: Filtre tablolarının listeleri (dil, sınırlar, oyun türü, favori satıcılar).
Derin bağlantılar: push/bot - masaya/turnuvaya doğrudan giriş; UTM'yi analitik için kaydetme.
Geri yığın: Android "geri" hareketi ve iOS kaydırma - turu aniden kapatmayın, önce - bir uyarı.
9) Yerelleştirme ve özel diller
RTL (Arapça/İbranice). Ayna bahis ızgaraları ve panelleri.
Sayı biçimleri/para birimleri. Binlerce ayırıcı, kısa imzalar (alan eksikliği nedeniyle 1.000 - 1k).
Dil tabloları. Ekran bayrakları/dilleri, bayi dil filtreleri, yerel birimler (₺, R $, ₴).
Satırların uzunluğu. Tanımlayıcılar elipsis, tultips ile otomatik olarak kesilir - uzun baskı ile.
10) Cihaz performansı ve kaynak
Pil: şarj düşük olduğunda fps 60 - 30 sınırlayın, yüksek tüketim hakkında uyarın.
Bellek: Kullanılmayan ABR profillerini boşaltın, 2-3'ten fazla yüksek çözünürlüklü dokuyu tutmayın.
WebView/tarayıcı: blok ağır gölgeler ve CSS filtreleri; Pürüzsüzlük için GPU birleştirme kullanın.
Görüntü optimizasyonu: WebP/AVIF, sprite ve lazy-load.
11) Ödeme ve cüzdan kalıpları
Mini cüzdan: bakiye ve hızlı para yatırma (yalnızca Web'de 3DS/KYC ile kasiyere bağlantı).
Güvenlik belirteçleri: kısa TTL, mevcut bahsi kaybetmeden yeniden giriş yapın.
Para kaynağının görünürlüğü: Bahis sırasında CASH/BONUS.
12) Kullanılabilirlik (A11y) ve uyumluluk
VoiceOver/TalkBack: elemanlar için imzalar, sekme sırası odağı, durum duyuruları için videolar.
Yüksek kontrast/büyük yazı tipi: ızgarayı bozmadan düzeni uyarlar.
Jestler tek yol ≠. Düğmelerle işlevselliği çoğaltıyoruz.
Test matrisi: iOS (geçerli + n-1), Android (SDK seviyeleri, popüler kaplamalar), zayıf cihazlar, kararsız ağlar.
13) Mikro metin yazarlığı: ne ve nasıl konuşulur
Açık ve kısa. "Bahisler kabul edildi", "Bahisler kapandı", "Yetersiz para", "Kötü ağ".
Bağlam. Teklif engellenirse, "Akış gecikmesi eşiği aşıyor" istemi.
Onaylar. Kaldır "Emin misin?" "Geri/Geri Al" seçeneğine geri dönebilirsiniz.
14) Analitik ve RUM: geliştirmek için önlem
RUM-SDK: e2e gecikme, başlatma, tamponlar, kalite anahtarları, kod çözücü hataları.
WebRTC-stats: RTT, loss, jitter, NACK/PLI, доля TURN-relay.
Ürün Etkinlikleri: Fiyat/Çift/Net, Feragat/Geç Fiyat, Masa ve Bayi Bekletme.
Giriş Faneli: Telgraf, lobi, masa, ilk bahis, tekrar, çift.
15) Mobil UI Anti-Bugs
Küçük vuruşlar. Çözüm: 48dp/44pt minimum, ek girintiler.
Kaliteyi değiştirirken siyah ekranlar. Çözüm: isteğe bağlı anahtar kare ve aşağıdaki profili önceden yükleyin.
Rastgele "geri" kaydırmalar. Çözüm: içeriğin içindeki yuvarlak + hareketlerden çıkmadan önce onay, sistem hareketleriyle çakışmaz.
Klavye yapışıyor. Çözüm: miktarlar için sayısal tuş takımı, girişten sonra otomatik gizleme, akıllı kaydırma.
16) Üretim başlatma kontrol listesi
UI ve Yönetim
- Başparmak bölgesinde CTA; Bahis için 2 adım
- Dokunsal ve anlaşılabilir durumlar (kabul edilmiş/kapatılmış/hata)
- Artefaktsız dikey/yatay modlar
Video ve ağ
- WebRTC ile SVC/simulacast, LL-HLS folback
- Gecikme/ağ göstergesi, yumuşak bozulma
- Geçiş yaparken siyah ekran yok
Sorumlu oyun
- Sınırlar/duraklatır/tarih 1-2 tapa bir mesafede
- E2e eşiği aşıldığında "geç" bahislerin bloke edilmesi
Yerelleştirme ve A11y
- RTL, büyük yazı tipleri, kontrast
- Ekran okuyucular için tam alt/etiketler
Performans
- 60 fps UI, anahtar ekranlar için <100 ms TTI
- Güç tasarrufu modu, bellek kontrolü
Gözlemlenebilirlik
- Dahili RUM ve WebRTC-istatistikleri, SLO uyarıları
- Ürün etkinlikleri ve oran hunisi
17) Alt satır
Mobil UX canlı oyunlar bir hız üçlüsü - netlik - kontrol. Dikey masalar, tek elle kontroller, hızlı bahisler, dokunsal ve anlaşılabilir durumlar, avucunuzun içinde bir "oturma odası" hissi yaratır. Teknik disiplin - yumuşak bozulma, LL-HLS'de geri dönüş, ağ göstergeleri, RUM analitiği ve A11y - güzel bir arayüzü, amiral gemileri ve bütçe cihazlarında, metroda ve evde eşit derecede iyi çalışan güvenilir bir ürüne dönüştürür. iOS ve Android'de.