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.