GH GambleHub

Sensor cihazlarda jestlər və UX

1) jestlər nə üçün və uyğun olduqda

Jestlər istifadəçinin hərəkət yolunu qısaltır: üç tapa əvəzinə bir swipe. Onlar sürət və saxlama artırır, əgər:
  • Proqnozlaşdırıla bilən (platforma gözləntilərinə uyğun).
  • Aşkar olunur (istifadəçi jest mövcud olduğunu təxmin edir).
  • Əks əlaqə ilə dəstəklənir (vizual/audio/toxunma).
  • Yanlış toxunma və cihazın müxtəlif tutmaları ilə etibarlıdır.

Prinsiplər: əvvəlcə açıq elementlər UI → sonra jestlər-ipuçları → sonra qabaqcıl gizli jestlər. Kritik hərəkətlər - həmişə açıq düymələrlə təkrarlamaq.

2) Jest taksonomiyası

Tap/Double-tap/Long-press - seçim/əlavə. menyu/genişləndirilmiş fəaliyyət.
Swipe (dağ ./vert.) - naviqasiya, silmə/arxivləşdirmə, hərəkətlərin açıqlanması.
Drag-and-drop - çeşidləmə, köçürmə, iyerarxiya dəyişikliyi.
Pinch/Spread (zoom) - miqyas (qalereya, xəritə, qrafika).
Rotate - nadir hallarda redaktorlar/baxışlarda uyğun gəlir.
Pull-to-refresh/Release-to-action - yeniləmə/ikincil hərəkət.
Edge-swipe - sistemli naviqasiya (geri/menyu), diqqətlə vebview.
Multi-touch - qabaqcıl ssenarilər üçün 2-3 barmaqlı jestlər.
System gestures - ekran görüntüləri, PiP, sistem «Geri» (Android) - münaqişələri nəzərə alın.

3) Erqonomika və baş barmaq zonaları

Thumb-zones: çatan zona - ekranın aşağı yarısı; açar CTA, çip filtrləri və sekmələr - aşağıda.
Hit-target: minimum 44 × 44 pt/48 × 48 dp. Kiçik elementlər üçün hit-slop (görünməz çatlama zonası) əlavə edin.
Kənarlardan sapmalar: saxta edge-swipe azaldın; kritik interaktsiyalar - kənara yaxın deyil.
Oriyentasiya: portret - default; landşaft - iki baş barmaq üçün optimallaşdırma (xüsusilə oyunlarda/videolarda).

4) Aşkarlama və öyrənmə

Affordance: jest işarələri (yan tərəfdə yarı görünən kart, sheet üçün alt «qələm»).
Mikro-bağlama: birdəfəlik ipuçları («silmək üçün silin»), obsesif deyil, «anladım».
Sınaq jest: nümunənin ilk görünüşündə nümayiş animasiyası.
Təkrarlanabilirlik: jestlər oxşar məzmunlu bütün yerlərdə eyni şəkildə işləməlidir.

5) Geribildirim: vizual, toxunma, səs

Vizual: kölgə, paralaks, kılavuzlara yapışma, pull-to-refresh zamanı irəliləyiş göstəricisi.
Taktil (haptics): drag tutarkən yüngül impuls, drop/uğur ilə daha «ağır».
Audio (orta): oyunlarda qısa klik/klik və ya əhəmiyyətli hadisələr (qazanmaq/səhv).
Ləğv vəziyyətləri: destructive-swipe zamanı vizual «qırmızı zona», çıxarılmadan əvvəl vibro-işarə.

6) Jest konfliktləri və prioritetlər

Tanıma iyerarxiyası: daxili scroll> swipe kartı> sistem edge-back (vebdə - əksinə). gesture-arena/prioritetlər konfiqurasiya.
Şaquli scroll vs üfüqi sürüşmə: 10-15 px hərəkətindən sonra bir oxu bloklayın.
Edge-swipe vs öz jestləri: sistem kəsilməməsi üçün daxili boşluq və ya jest- «qələm» əlavə edin.
Qlobal back-gesture (Android/iOS): gözlənilən naviqasiyanı pozmayın - vacib hərəkətləri «Geri» düyməsi ilə təkrarlayın.

7) Ssenari nümunələri

7. 1 Siyahılar və kartlar

Swipe-actions: qısa swipe - hərəkətlər (nişanlar), uzun - ani hərəkət.
Undo paradiqması: destructive jest sonra snackbar «ləğv» göstərin.
Drag-reorder: «qələm» üzərində çəkin; şaquli oxu düzəldir.

7. 2 Xəritələr, qalereyalar, qrafiklər

Pinch-zoom + ölçmək üçün ikiqat masa.
Inertia & bounds: elastik sərhədləri, hamar ətalət.
Tap-hold üçün «lupa «/nöqtə detalları qrafikdə.

7. 3 Naviqasiya və tikiş

Bottom-sheet: qələmdən «çəkin» jesti, collapsed/partial/full vəziyyəti; swipe-down bağlamaq üçün.
Tabs/Chips: tərəqqi göstərici ilə sekmələr arasında üfüqi swipe.

7. 4 Oyun və «sürətli» ssenarilər

One-hand play: aşağı kənarda böyük bahis/fəaliyyət zonaları.
İkiqat jestlər: «təkrarlanan bahis» (haptic təsdiq) kimi ikiqat sinif.
Destructive-də eşik: 300 ms-də barmağı «düzəldin» və ya yerinə yetirmək üçün «qırmızı zona» keçin.

8) Mövcudluq (A11y)

Bütün jestlər düymələr və ya menyu nöqtələri ilə təkrarlanır.
VoiceOver/TalkBack: düzgün təsvirlər və fokus qaydası.
Motor accessibility: long-press alternativləri («⋮» simvolu), artan toxunma zonaları.
Kontrast və miqyas: jestlər hərəkətə keçməyin yeganə yolu olmamalıdır.

9) Performans və etibarlılıq

INP (Interaction to Next Paint) ≤ əsas jestlər üçün 200 ms.
Touch latency: hədəf <50-100 ms ilk cavab (vizual tutma/işıqlandırma).
60 FPS: drag/scroll üçün hamarlığı; hərəkət edərkən ağır kölgələri və blur söndürün.
Hit-testing: üst-üstə düşməkdən çəkinin (z-index/overflow) - tələlər «susur».
Tutma testləri: sağ/sol, baş/kiçik barmaq, ayaq/nəqliyyat.

10) Web vs Native

Web/PWA: passive dinləyicilər ('passive: true') scroll üçün, 'touch-action' oxları bloklamaq üçün, ehtiyac olmadan sistem jestlərinin qarşısını almaq.
iOS/Android nativ: Sistem tanıdıcılarından (UIGestureRecognizer/Android GestureDetector), ştat haptics, proqnozlaşdırılan «Geri» (Android 14 +) istifadə edin.
Vebview: körpülər və təhlükəsiz zonalar, əvvəlcədən bağlanması - sistem «Geri» sındırmadan veb daxilində.

11) Multi-taç və qabaqcıl jestlər

İki barmaq: zoom bloklandıqda panorama; kartlarda - əlavə təbəqə üçün «iki barmaq aşağı» jest.
Üç barmaq: yalnız power-users üçün; həmişə alternativ verin.
Kombinasiyalar: diapazon/qrup hərəkət seçmək üçün long-press + drag.

12) Validasiya, telemetriya, metrika

События: `gesture_start`, `gesture_commit`, `gesture_cancel`, `latency_ms`, `distance_px`, `overscroll`, `misfire` (ложный жест), `undo_used`.
KPI: Success Rate, Misfire Rate, Undo Rate, INP, Time-to-Action, Drop-off.

13) Lokalizasiya və mədəni fərqlər

RTL dilləri: üfüqi jestləri və simvolları əks etdirin.
Simvolika: «sola sil = sil» universal deyil - onbording təsdiqləyin.
Toxunma nümunələri: sistem profillərindən istifadə edin, onlar artıq istifadəçiyə tanışdır.

14) Təhlükəsizlik və səhvlər

Destructive jestləri - yalnız undo/təsdiq ilə.
Edge svipləri təsadüfən kritik prosesləri (ödəniş/KUS) bağlamamalıdır.
Titrəmədən qorunma: jest başlamazdan əvvəl hərəkət həddi (5-10 px).
Bloklama vəziyyətlərində jestlərin bağlanması (ödəniş loaderi, təsdiq modalı).

15) Sensor masaları/planşetlər üçün patternlər

İki əlli ssenarilər: nəzarət zonalarının ayrılması.
Multiplayer rejimi: jestlər toqquşmur, toxunma vaxtı prioriteti.
Böyük hittargets: 56-64 dp; drag əməliyyatları üçün vizual istiqamətləndiricilər.

16) Antipattern

Gizli kritik hərəkətlər yalnız jestlə (düyməsiz).
Sistem ilə ziddiyyətli jestlər (edge-back, notification shade).
vizual «döyüş» və səs/vibro olmadan uzun mətbuat.
Eksenel lok olmadan şaquli skroll daxilində üfüqi qıvrım.
drag → lag və FPS düşməsi ilə «ağır» kölgələr/blur.
Proqramın müxtəlif hissələrində razılaşdırılmamış jestlər.

17) Giriş çek siyahısı (addım-addım)

1. Jestlər xəritəsi: harada və hansılar - A11y üçün alternativlərlə.
2. Tanınma prioritetləri: oxlu lok, edge-safe zonası, gesture-arena.
3. Geribildirim: vizual tələ, haptics profilləri, animasiyalar ≤ 200 ms.
4. Performans: INP/60 FPS, drag/scroll zamanı profil.
5. Bağlama: söndürmək imkanı ilə ipuçları və sınaq jestləri.
6. Telemetriya: success/misfire/undo, toxunma heatmap.
7. Test matrisi: cihazlar, sıxlıq, sol/sağ, pis şəbəkə halları.
8. Sənədləşmə: dizayn sistemində jest bələdçisi, nümunələr və anti-cases.

18) Yekun

Səriştəli jest tez, aydın və etibarlıdır. Sistem gözləntilərini pozmadan və hər kəs üçün əlçatanlığı təmin etmədən məqsədə gedən yolu qısaltır. Jestləri dizayn sisteminin bir hissəsi kimi dizayn edin: vahid nümunələr, aydın prioritetlər, zəngin rəy və ciddi performans nəzarəti - sonra sensorlu UX hər hansı bir cihazda və hər hansı bir ssenaridə eyni dərəcədə xoş olacaq.

Contact

Bizimlə əlaqə

Hər hansı sualınız və ya dəstək ehtiyacınız varsa — bizimlə əlaqə saxlayın.Həmişə köməyə hazırıq!

Telegram
@Gamble_GC
İnteqrasiyaya başla

Email — məcburidir. Telegram və ya WhatsApp — istəyə bağlıdır.

Adınız istəyə bağlı
Email istəyə bağlı
Mövzu istəyə bağlı
Mesaj istəyə bağlı
Telegram istəyə bağlı
@
Əgər Telegram daxil etsəniz — Email ilə yanaşı orada da cavab verəcəyik.
WhatsApp istəyə bağlı
Format: ölkə kodu + nömrə (məsələn, +994XXXXXXXXX).

Düyməyə basmaqla məlumatların işlənməsinə razılıq vermiş olursunuz.