Крипто казино
Torrent Gear
UI көшбасшы борт және миссия карточкалары: үздік тәжірибелер
1) Бұл не үшін: UI мақсаттары
Лидборд: «кім қайда» және одан әрі не үшін ойнайтынын бірден түсіндіру; жақын маңдағы мақсатты көрсету (+ апқа дейінгі N ұпай).
Миссиялардың карточкалары: ұзын ережелерді 10-30 минутқа түсінікті «әрекет бірлігіне» айналдыру.
2) Көшбасшы борттың ақпараттық иерархиясы
Бағандардың ең кіші жиыны:1. Ені тұрақты және ірі саны бар орын (#).
2. Ойыншы (аватар/рама/титул, қысқаша ник) - кликабельді → профиль.
3. Көзілдірік/рейтингтік метрика (SP/MMR/ивент көзілдірігі) - оң жақ шетімен түзету.
4. Жүлде/дәрежелік аймақ (сирек белгі/марапат диапазоны).
5. Уақыт/кезең (live/qualifier/finals), аяқталу таймері.
Үлгілер:- Өз жолын жарықтандыру (sticky row + «маған оралу»).
- «Мақсатқа дейінгі табалдырық»: «48 SP- − ТОП-100-ге дейін» шағын плашка.
- Ешкімді желімдеу (бірдей көзілдірік үшін «T-10»).
3) Басқару және навигация
Сүзгілер: лига/дивизион, өңір, достар, «тек менің провайдерім».
Сұрыптау: орны бойынша (үзіліс бойынша) , көзілдірік бойынша, кіру уақыты бойынша, жүлделі аймақ бойынша.
Пагинация vs шексіз скролл:- desktop - пагинация + «өзіне», mobile - шексіз скролл, бірақ «басына/өзіне».
- Jump-to Rank: жедел ауысу үшін дәрежені енгізу өрісі (ауқымды тақталар үшін маңызды).
4) Нақты уақыттағы жаңартулар («дірілсіз»)
Дифф-жаңарту: нақты жылжыған жолдарды ғана өзгертеміз.
120-200 мс, easing-out; секірусіз.
Анти-фликер: батч-жаңарту әрбір 1-2 сек сайын (жиі емес).
Оптимистік жаңартулар: жергілікті көзілдіріктерді қосып, «синхрондау»...
5) Көшбасшы борттың UI-дегі адалдық және қауіпсіздік
Ережелерді түсіндіру: «Көзілдірік қалай есептеледі?» түймешігі тақырыбының жанында.
Анти-буллинг: никтің бір бөлігін жасыру (опция), улы атауға шағым - 1 шерту.
Күдікті аккаунттардың маркерлері: басқалардан жасырылған; ойыншыға - «сіздің көзілдіріктеріңіз тексерілуде».
Дивизиондардың бөлінуі: күштілер старттармен араласпауы үшін лигалардың көзбен шолып әртүрлі бейдждері.
6) Миссия карточкасының анатомиясы (one-glance design)
Тақырып (40-50 таңбадан ≤), миссия түрінің белгісі.
Қысқаша сипаттама (не істеу керек, қайда, қанша үшін).
Прогресс-бар санмен/пайызбен + уақытты бағалау (20-25 минутқа ≈).
Награданың күрделілігі (1-3 нүкте) және сиректігі (түсі/қыры).
Наградалар: «ақшалай» мәнсіз токендер/косметика (шағын миниатюралар).
Мерзімі: таймер жұмсақ түспен аяқталғанға дейін (соңғы 10% -да оранж/қызыл).
CTA: «Бастау »/« Жалғастыру »/« Алу» - бір басты түйме.
Secondary: «Миссияны ауыстыру» (егер рұқсат етілсе), «Толығырақ» (ережелер модалы).
7) Миссия карточкаларының жай-күйі
Locked: сұр, «7 деңгейден кейін ашылады «деген белгісі бар; CTA = "Не керек? ».
Available: түрі бойынша түсі; CTA = «Бастау».
In-progress: прогресс-бар белсенді, CTA = «Жалғастыру».
Completed: жасыл чек; CTA = «Алу» (1 сек ≤ әсері).
Expired: бозғылт; CTA = «Жасыру «/« N маусымда қайталану ».
On hold (адалдықты тексеру): сары плашка «нәтижесін тексеру 1-3 мин».
8) Көрнекі тіл және қол жетімділік
Сирек кездесетін түстер: Common (бейтарап), Rare (көк), Epic (фиолет), Legendary (алтын), Mythic (қызғылт екпін).
Семантикалық түстер: жетістік/прогресс - жасыл, ескерту - янтарь, мерзімі - қызыл.
Контраст ≥ 4. 5:1, қаріптер ≥ 14-16 px mobile.
Барлық маңызды нәрсе - түсі ғана емес (иконалар/үлгілер).
Үнемді VFX: 0. 6–1. 2 с, бақылауды жабусыз.
Бейімдеу: кесте → карточкалар (2 баған tablet, 1 баған phone); бекітілген тақырыптар.
9) Жүктеу жағдайлары, бос орындар және қателер
Кестелер мен карточкаларға арналған скелетондар (3-5 жол/тайлдер).
Empty state: пайдалы мәтін + «Бастапқы миссияны алу».
Желі қателері: түсінікті, «Қайталау»; офлайн - кэшті көрсетеміз және «соңғы жаңарту: 14:02» деп белгілейміз.
10) Өнімділік
Тізімдерді виртуалдандыру (300 + жол).
Иконалар спрайт/Lottie сияқты (қажетсіз SVG-хайуанаттар бағы емес).
Debounce сүзгілер/іздеу (300-500 мс).
Тақталар/миссиялар үшін клиенттік кэштер мен ETag.
11) UI миссияларындағы адал контент және анти-абьюз
Қысқаша «Бұл қалай жұмыс істейді»: дроп, pity-логика, кепка, маркетингтік тұмансыз.
Анти-фарм үлгісі: «әртүрлілікті» атап өтеміз - провайдерді/мөлшерлемені ауыстырғанда алға жылдам жылжиды.
«Миссияны ауыстыру» батырмасына құлдаулар және қайтадан мүмкін болған кезде кеңес.
12) Нақты маңызды өлшемдер
Миссия карточкаларының CTR, Start Rate, Completion Rate, Median TTC.
Миссия арқылы алынған косметика үшін Equip Rate/Duration.
Leaderboard Engagement: «өзіңізге», «профильге өту», көріну уақыты.
VFX/хабарламадағы Complaint/Mute Rate.
Stickiness (DAU/MAU) және D7/D30 uplift.
Gini SP бойынша: ұқсас ойын уақытында прогрестің біркелкілігі.
13) A/B-идеялары
1. Прогресс-бар пішімі: сандық + визуалды vs тек визуалды.
2. Уақытты бағалау: көрсету/көрсетпеу; іске қосуға әсері.
3. CTA-беттеу: бір үлкен vs екі бірдей түймешік.
4. Әдепкі бойынша сұрыптау: vs жүлде аймағы бойынша.
5. Жарықтандыру шегі: T-10% vs T-20% уақыт.
6. Көшбасшы борттағы «Өзіңе»: vs түймешігі әрқашан бекітілген.
14) JSON-схемаларының мысалдары (контент → UI)
Миссия картасы
json
{
"id": "m. s4. provider. diversity «,» title «:» Үш провайдер ашыңыз «,» summary «:» 3 түрлі провайдерден 30 минут ішінде ойнаңыз «,» difficulty «:» medium «,» est_time_min": 25 «,» progress «: {» current «: 2,» target «: 3},» rewards «: {» tokens «: 10,» cosmetic_drop": {«rarity»: «Rare», «p»: 0. 1}}, «expires_at":» 2025-10-26T18: 00: 00Z «,» state «:» in_progress" «,» cta «: {» label «:» Жалғастыру «,» deeplink «:» app ://open/lobby? tab=providers"}
}Көшбасшы борт жолы
json
{
"rank": 124, "user": {"id": "u_59211", "name": "SeaFox", "avatar_frame": "legendary. wave"}, "score": 18420, "league": "Gold I", "prize_band": "Top 100", "delta_to_next": 47, "is_me": false, "stage": "qualifier", "ends_at": "2025-10-24T21:00:00Z"
}15) Микрокопия (қысқа және анық)
Миссия басталды - "Барайық! 20 минутқа ≈ қалды".
Прогресті ынталандыру - «Марапатқа дейін тағы 1 провайдер».
Мерзім - «уақыттың 10%, бір кіргенде үлгересіз».
Адалдықты тексеру - «Біз нәтижені тексереміз (3 минутқа дейін) - награда сақталды».
16) Шығарылым алдындағы чек-парақ
- Кестелер 320 px; «өзіме» және sticky header бар.
- Миссия карточкалары «бір қарағанда» түсінікті: мақсат, уақыт, марапат, CTA.
- Фликерсіз жаңартудың нақты уақыты; дифф-патчтар және батч-жиілік.
- «Бұл қалай жұмыс істейді» экраны: көзілдірік формулалары/кап/сирек.
- Шу бақылау: VFX/мин лимиттері, түнгі «тыныш режим».
- Қол жетімділік: қарама-қарсы, тек түс ғана емес, пернетақта навигациясы.
- Анти-абьюз: кулдауналар «Миссияны ауыстыру», вариативтілікті жарықтандыру.
- Метриктер және A/B-жоспары енгізілген; басу және үндестіру логтары.
Күшті UI көшбасшы тақтасы мен миссия карточкалары - бұл жылдам оқылушылық, жұмсақ динамика, әділ ашықтық және бақыланатын шу. Ойыншыға жақын мақсатты, түсінікті прогресті және ұқыпты VFX беріңіз, жаңартуларды тұрақты ұстаңыз, ал ережелер анық болады. Сонда тақта жарыстың қозғаушы күшіне айналады, ал миссия карточкалары - тартылу мен ұстап қалуды жүйелі түрде өсіретін ыңғайлы «әрекет бірлігі».