Мобилдик түзмөктөрдө Interface жана UX кантип ишке ашырылат
1) негиздери: мобилдик UX desktop айырмаланат
Бир колу башкаруу. Негизги CTA (коюм, кайталоо, тазалоо) - "манжа зонасында" (экрандын төмөнкү үчтөн бир бөлүгү).
тик биринчи. Вертикалдуу столдор/агымдар - негизги сценарий; горизонталдык "кино режими" катары колдоого алынат.
Аз чыкылдатуу - көбүрөөк мааниге ээ. Ар кандай коюм ≤ 2 иш-аракет талап кылынышы керек: талаада/уячада баа → тап тандоо.
ылдамдыгы сулуулук маанилүү болуп саналат. 60 fps бир UI, минималдуу layout shift, "жарык" анимация.
Ачык-айкындуулук. Таймер раунд, туташуу статусу, кечигүү - ачык жана көзгө көрүнбөгөн.
2) Экран алкагы: кайда жайгаштыруу керек
Жогорку зонасы:- Үстөлдүн аталышы, лимиттер, оюнчу эсептегич, тармактын индикатору/кечигүү, эрежелердин/жөндөөлөрдүн иконалары.
- Video агымы (WebRTC/LL-HLS) же 3D-стол, камера/белги бурчтарын өзгөртүү.
- Жүктөмөлөр: таймер, акыркы раунддардын жыйынтыгы, коюмдарды тастыктоо.
- Коюмдар панели: номиналдар, "Кайталоо", "Эки эсе", "Тазалоо" тез баскычтары.
- Капчыктын капчыгы (баланс, тез аманат - кассага өтүү).
- Стол/оюндарды которуу (горизонталдуу скролл).
- Минималдуу 48dp (Android )/44pt (IOS) боюнча interactive, 8dp ≥ баскычтарынын ортосундагы ажырым.
- safe areas эске алуу (notch, кыймыл багыттоо).
3) Fast чендер: микро иш-аракеттер
Эки кадам: номиналдык тандоо → стол боюнча талаа боюнча тап. Кайталап тап - ошол эле номиналдагы ченди жогорулатат.
Узак басуу (узун басма сөз): контексттик меню (алып салуу, эки эсе көп, бөлүштүрүү).
Номиналдык панелдин ылдый Swipe: кеңейтилген баалуулуктарды/коюмдардын тарыхын көрсөтүү.
Хаптика: коюмду кабыл алууда жеңил термелүү, катуураак - ийгиликсиз/кеч коюмда.
Статустун көрүнүшү: "Биз коюмдарды кабыл алабыз "/" Жабык "- түс/сөлөкөт + секундомер.
4) Video жана overley: тоскоолдук эмес, жардам берүү үчүн
Суроо-талап боюнча негизги кадр. Сапатты алмаштырууда - "самынды" болтурбоо үчүн заматта IDR.
Жарым тунук карталар. Таймер жана натыйжалар - 70-85% ачык-айкындуулук, таймер боюнча автоматтык түрдө жашыруу.
Ишараттар:- Video боюнча Double класс - камера/бурчун өзгөртүү.
- Pinch - Video масштабы (CTA бөгөт жок).
- "Четки" билдирүүлөр. Push-саптар утуштарды жана промо - жогору, коюм панелин жаап жок.
5) Тармак абалы жана кечигүү
Статус-таблетка: "Онлайн 1,3 c "/" Начар тармак 4,8 c". Сөлөкөттүн түсү босоголор боюнча өзгөрөт.
Жумшак деградация: биринчи FPS азайтуу (60 → 48 → 30), андан кийин чечим (1080p → 720p → 540p), + 200-300 ms буфер жогорулатуу.
Auto-folback: WebRTC → LL-HLS туруксуз тармак менен көрүүчүлөрдүн режими үчүн; "кеч" коюмдарды бөгөт коюу.
Оффлайн экран: коюмдун контекстин сактоо, түшүнүктүү себеп ("Байланыш жок") жана "Кайталоо" баскычы.
6) жоопкерчиликтүү оюн жана контролдоо
Лимиттер колдо. Баланстын жанындагы "Лимиттер" баскычы: депозит/убакыт/жоготуу, сессиянын таймери.
тыныгуу мүнөт. Сунушталган тыныгуу 30-45 мүнөттөн кийин оюн - жумшак баннер, жок "кызыл желектер".
Кеч коюмдун блогу. Эгерде e2e-кечигүү> босого - коюм кабыл алынбайт, UI себебин түшүндүрөт.
Тарых жана экспорт. Акыркы раунддар/чендердин лентасы, чыпкалар, чектерди тез экспорттоо.
7) Текст, түстөр, анимация
Типография: 17-20pt аталыштары, 14-16pt дене; контраст WCAG AA +.
Түс схемасы: "сигналдык" түстөр статустар үчүн сакталган (кабыл алынган/жабылган/ката).
Animation: 120-180ms микро иш-аракеттер үчүн; 240-320 мс - панелдер/перилери үчүн. Pokadrovo - 2-3 параллелдүү таасирлер көп эмес.
Скелеттер спиннерлердин ордуна. Тез прогрессивдүү download ipuçları.
8) Навигация жана маалыматтык архитектура
Төмөнкү навигация (tab bar): Лобби, Live, Акциялар, Профиль.
Live ичинде: фильтрлери бар столдордун тизмелери (тил, лимиттер, оюндун түрү, сүйүктүү дилерлер).
Терең шилтемелер: push/bot → стол/турнирге түз кирүү; аналитика үчүн UTM сактоо.
Back-stack: ишарат "артка" Android жана Swipe IOS - күтүлбөгөн жерден тегерек жабуу эмес, биринчи - эскертүү.
9) Локализация жана атайын тилдер
RTL (араб/иврит). Чендердин жана панелдердин симметриялуу чагылышы.
Сандык форматтар/валюталар. Миңдеген бөлгүчтөр, кыска кол тамгалар (орун жетишсиз болгондо 1 000 → 1k).
Тил столдору. желектерди/тилдерди көрсөтүү, дилердин тили боюнча чыпкалар, жергиликтүү бирдиктер (₺, R $, ).
Саптардын узундугу. Дескрипторлор көп чекиттүү авто кесип, тултиптер - long press боюнча.
10) Аппараттын өндүрүмдүүлүгү жана ресурсу
Батарея: 60 → 30 fps төмөн заряд менен чектөө, жогорку чыгым жөнүндө эскертип.
Эстутум: пайдаланылбаган ABR профилдерин түшүрүп, жогорку резолюциядагы 2-3 текстурадан ашык кармабайбыз.
WebView/browser: оор көлөкө жана CSS чыпкалар бөгөт коюу; жылмакай үчүн GPU-композиттик колдонот.
Сүрөттөрдү оптималдаштыруу: WebP/AVIF, спрайттар жана lazy-load.
11) Төлөм жана капчык-үлгүлөр
Mini капчык: балансы жана тез депозиттик (бир гана Web 3DS/KYC менен кассага байланыш).
Коопсуздук токендери: кыска TTL, учурдагы ченди жоготпостон кайра кирүү.
Каражат булагынын көрүнүшү: Коюм учурунда CASH/BONUS.
12) Жеткиликтүүлүгү (A11y) жана шайкештиги
VoiceOver/TalkBack: элементтер үчүн кол тамгалар, табиб-тартиби боюнча басым, статус жарыялоо үчүн роликтер.
Жогорку контрасттык/чоң шрифт: тор бузулбастан ылайыкташтыруу.
ишараттар ≠ гана жолу. Биз функционалдуулугун баскычтар менен кайталайбыз.
Test Matrix: iOS (учурдагы + n-1), Android (SDK деңгээл, популярдуу кабыктар), алсыз түзмөктөр, туруксуз тармактар.
13) Микрокопирайтинг: эмне жана кантип айтуу керек
Так жана кыска. "Коюмдар кабыл алынды", "Коюмдар жабылды", "Каражат жетишсиз", "Начар тармак".
Контекст. Ченди бөгөттөөдө - "Агымдын кечеңдеши босогодон ашат".
Тастыктоо. "Сиз ишенесизби?" "Артка/Жокко чыгаруу" аркылуу түшө турган жерде.
14) Аналитика жана RUM: жакшыртуу үчүн өлчөө
RUM-SDK: e2e-кечигүү, startup, buffers, сапатын өзгөртүү, декодер каталар.
WebRTC-stats: RTT, loss, jitter, NACK/PLI, доля TURN-relay.
Азык-түлүк окуялары: коюм/эки эсе/тазалоо, баш тартуу/кеч коюм, столдор жана дилерлер боюнча кармап туруу.
Кирүү фанели: телеграмма → лобби → стол → биринчи коюм → кайталоо/эки эсе.
15) мобилдик UI каршы ката
Кичинекей хиттер. Чечим: 48dp/44pt минимум, кошумча чегинүү.
Сапатты өзгөртүүдө кара экрандар. Чечим: keyframe-on-demand жана кийинки профилди алдын ала жүктөө.
Кокус Swipes "артка". Чечим: раунддан чыгаар алдында ырастоо + мазмундун ичиндеги жаңсоолор системалуу менен карама-каршы келбейт.
Клавиатуранын жабышуусу. Чечим: суммалар үчүн numeric keypad, киргенден кийин auto жашыруу, акылдуу скролл.
16) Production-ишке чек тизмеси
UI жана башкаруу
- Баш бармак зонасында CTA; коюмга чейин 2 кадам
- Хаптика жана түшүнүктүү статустар (кабыл алынган/жабык/ката)
- Артефактсыз вертикалдуу/горизонталдуу режимдер
Видео жана тармак
- SVC/симулякаст менен WebRTC, LL-HLS-folback
- Индикатор кечигүү/тармак, жумшак деградация
- которулганда "кара" экрандар жок
Жооптуу оюн
- Лимиттер/тыныгуу/1-2 чендердин тарыхы
- e2e босогосунан ашкан учурда "кеч" коюмдардын блогу
Локализация жана A11y
- RTL, чоң ариптер, карама-каршылык
- Толук alt/labels үчүн скринридерлер
Өндүрүмдүүлүк
- 60 fps UI, <100 ms TTI үчүн негизги экрандар
- Энергияны үнөмдөө режими, эстутумду көзөмөлдөө
Байкоо
- Камтылган RUM жана WebRTC-stats, SLO боюнча алерт
- Азык-түлүк окуялар жана чендердин Huni
17) Жыйынтык
Мобилдик UX Live оюндар Triad ылдамдыгы → тактык → контролдоо болуп саналат. Вертикалдуу столдор, бир колду башкаруу, тез коюмдар, хаптика жана түшүнүктүү статустар алаканыңызда "жандуу зал" сезимин жаратат. Техникалык дисциплина - жумшак деградация, LL-HLS боюнча фолбэк, тармак көрсөткүчтөрү, RUM-аналитика жана A11y - сулуу интерфейсти флагмандарда жана бюджеттик түзмөктөрдө, метродо жана үйдө, iOS жана Android боюнча бирдей жакшы иштеген ишенимдүү продуктуга айландырат.