Interfeysning navigatsiya arxitekturasi

1) Navigatsiya arxitekturasi nima va nima uchun zarur

• Foydalanuvchi maqsadlarini kontent/fich tuzilishi bilan bogʻlaydi.
• Bashorat qilinadigan patternlar hisobiga kognitiv yuklamani kamaytiradi.
• Natijaga erishishni tezlashtiradi (kamroq bosish/sakrash).
• Mahsulot o’sishi bilan ko’payadi.

Tamoyillar: izchillik> kreativ, aniq yo’nalishlar> yashirin imo-ishoralar, asosiy maqsadga 3-4 ta harakatdan qisqa yo’l.

2) Navigatsiya qatlamlari (IA darajalari)

1. Global daraja - mahsulot bo’limlari (masalan: Lobbi, Live, Aksiyalar, Hamyon, Profil).
2. Bo’lim/toifa - kichik seksiyalar va asosiy funksiyalar (kataloglar, hisobotlar, sozlamalar).
3. Sahifa/tur - aniq mohiyat (o’yin, hisobot, shakl).
4. Lokal/kontekst - tablar, langarlar, «ko’proq ko’rsatish», paginatsiya.
5. Tarix va qaytish yo’li - non bo’laklari, back, «oxirgisiga».

Qoida: har bir darajada aniq «men qayerdaman?» (aktiv punkt, H1/maydalangan) va «keyingi nima?» (STA/havolalar/tavsiyalar).

3) Navigatsiya modellari va ularni qachon tanlash

Yuqori menyu (top-nav): Yuqori darajadagi 5-7 ta bo’lim. Iste’mol interfeyslari va mobayl uchun yaxshi (pastki tablarga aylanadi).
Pastki tablar (mobile): 5 punktgacha, qayd etilgan, ikona + yorliq. Asosiy harakatlar har doim bosh barmoq ostida.
Chap saydbar: chuqurligi 2-3 daraja, mahsulotlar va ma’murlarda ishlaydi. Tez-tez uchraydigan punktlar uchun kollaps/pinlar.
Mega-menyu: yirik kataloglar (do’konlar, kontent-pullar). Mavzular bo’yicha guruhlar, maslahatlar va tezkor havolalar qo’shadi.
Non parchalari: chuqur yo’llar va SEO-kontent uchun; H1 va top-navigatsiyani almashtirmaydi.
Kontekst navigatsiya: tablar, chip filtrlar, «related», longridlardagi mundarija (TOC).
Buyruq palitrasi/Global search ( K): mavzular va harakatlar boʻyicha tezkor oʻtishlar.
Shortkatlar va imo-ishoralar: power-users (issiq tugmalar, sviplar) - lekin har doim UI ekvivalenti bilan.

Tanlash quyidagilarga bog’liq: bo’limlar soni, chuqurligi, foydalanish chastotasi va qurilmalar.

4) Routing va URL strategiyasi

Oʻqiladigan URL: ’/games/slot/[ slug]’, ’/reports/ngr? period=Q3`.
Barqarorlik: tahririyatlarsiz URLni o’zgartirmang; teskari moslikni saqlang.
Holat parametrlari: filtrlar/saralash - query; ID - yoʻlda.
Koʻrinishni saqlash: «Joriy filter/langar bogʻlamasini nusxa olish».
Chuqur havolalar (deep links): pochtadan nishonchaga, xavfsiz avtorizatsiya bilan.
Oflayn va tiklash: qaytarilganda, filtrlarni tiklang.

5) Axborot mo’ljallari va belgilari

Punktning aktiv holati (rang/chiziq, ikonka).
H1 va lead - sahifaning kontekstini ifodalaydi.
Bo’lim lokatori - parchalar, saydbardagi markerlar, tovoqning yoritilishi.
Boʻsh holatlar - qayerga borish kerakligini koʻrsatadi (CTA, yordamga havolalar).
Barqaror lugʻat - hamma joyda elementlarning nomlari bir xil.

6) Qidiruv va buyruq palitrasi

Global search: mohiyat indeksi (o’yinlar, provayderlar, hisobotlar) + tezkor harakatlar («/deposit », «/kyc»).
Avto- toʻldirish: soʻnggi va ommabop soʻrovlar, tor maslahatlar.
Semantika: natijalarning alohida «turlari» (mohiyati, ma’lumotnoma sahifalari, sozlamalar).
Buyruq palitrasi - nomlar va hotkeylar boʻyicha yoʻnaltirish, rus/ingliz/sinonimlarni qoʻllab-quvvatlash.

7) Holatlar, rollar va foydalanish

RBAC: faqat mavjud bo’limlarni ko’rsating; kulrang «qulflar» - tejamkorlik va tushuntirish bilan.
Mehmon rejimi: cheklangan menyu bandlari, CTA roʻyxatdan/loginni olib boradi.
Tenantlik: brendlar/operatorlar bo’yicha bo’shliqlar - global selektorda ajratish.
Huquqlarning kuchayishi: KYC/2FA keyin yangi yo’nalishlar ochiladi.

8) Mobil xususiyatlar

Pastki navigatsiya (5- ≤): Lobbi, Live, Aksiyalar, Hamyon, Profil.
Diplinklar po’stlog’idan: kerakli tab/tabka/langarga olib boradi; qaytarish - avvalgi holatiga.
Teskari imo-ishoralar: oʻq karusellari bilan ziddiyatli emas.
Sticky elementlari: mini-pleyer/joriy o’yin, «Depozit» - suzuvchi CTA.

9) Foydalanish imkoniyati va mahalliylashtirish

Fokus tartibi vizual ierarxiyaga mos keladi.
Tablar uchun ARIA atributlari. Ikonkalarning imzolari majburiydir.
Klaviatura navigatsiyasi :/Tab/Enter; koʻrinadigan fokus.
RTL/tillar: To’r va bandlar tartibini aks ettiring, mikro nusxani mahalliylashtiring.
Kontrast va o’lchamlari: WCAG AA minimal; tap-targetlar ≥ 44px.

10) Unumdorlik va barqarorlik

Progressiv navigatsiya yuklash: saidbar/menyu skeletonlari.
Menyu/lugʻatni keshlash: tarmoqni tortish ehtimoli kamroq, shoshilinch navigatsiya.
Yaqin yo’nalishlarni oldindan yuklash: hover/fokus bo’yicha; oqilona byudjetlar.
Barqarorlik: qo’shimcha yuklashda sakrab o’tmaslik (belgilangan o’lchamlari).
404/403 dan himoyalanish: do’stona sahifalar va tezkor «orqaga».

11) Telemetriya va metrika

• ’nav _ click’ (manba, punkt, pozitsiya),’route _ change’,’search _ query/select’,
• `breadcrumb_click`, `deeplink_open`, `back_used`, `not_found_view`.

• Time-to-Target (maqsadli ekran/amalgacha).
• Nav Error Rate (404/403/xatolar).
• Return Rate (bir vaqtning o’zida back bo’yicha qancha qaytib kelgani - aniq bo’lmagan yo’lning belgisi).
• Search Success% (natija 2 klik ≤).
• Buyruq paneli va issiq tugmalarni moslash.

• Saidbar vs mega-menyu; tablar yuqoridan vs chip-filtrlar; «qidirish har doim koʻrinadi» vs bosilgan.

12) iGaming uchun patternlar (misollar)

• Global: Lobbi/Live/Aksiyalar/Turnirlar/Hamyon/Profil.
• Lobbi ichida: chip-filtrlar (Yangi, Jekpotlar, Provayderlar, Buy-Bonus), qidiruv.
• Go’shtlar - lobbida emas, balki provayderlar/maqolalar sahifalarida.

• Saydbar: Dashbordlar/Kontent/Hamkorlar/Hisobotlar/Compliance/Sozlamalar.
• Bo’limlar ichida - tablar (Ro’yxat/Relizlar/Sertifikatlash).
• Buyruq palitrasi: «ID boʻyicha oʻyin ochish», «Reliz yaratish», «Hisobotni eksport qilish».

13) Antipatternlar

Guruhsiz 20 + punkt uchun menyu (vizual shovqin).
Bir xil boʻlimning turli joylardagi nomlari.
Faqat burger menyusida (ish stolida) yashirin tanqidiy navigatsiya.
Tablardan filtr sifatida qayta foydalanish (turli ma’nolar - bitta tur).
Holatni buzadigan oʻtishlar (filtrlarni «orqaga» tashlash).
«Yopishqoq» panellar kontent va CTAni qoplaydi.

14) Joriy etish chek-varaqasi (sprintlar bo’yicha)

Sprint 1 - Xarita: bo’limlarni inventarizatsiya qilish, maqsadli yo’llar (top-tasks), atamalar lug’ati.
Sprint 2 - IA: guruhlash, darajalar, model tanlash (top-nav/side/mega/tabs). Prototip.
Sprint 3 - Routing/URL: o’qish yo’llari, filtrlarni saqlash, diplinklar, 404/403.
Sprint 4 - Qidirish/K: mohiyat indeksi, avtomatik toʻldirish, tezkor harakatlar.
Sprint 5 - Foydalanish imkoniyati/lokal: klaviatura, ARIA, RTL, kontrast.
Sprint 6 - Telemetriya/A-B: Time-to-Target, Search Success, back-bounces; modellar testi.
Sprint 7 - Ishlash: lugʻat/menyu kesh, qoʻshni yoʻnalishlar prefetch, skeletonlar.

15) Glossariy

IA (Information Architecture) - bo’limlar/kontentning mantiqiy tuzilishi.
Top-nav/Side-nav/Tabs/Mega-menu - navigatsiya modellari.
Breadcrumbs - chuqur ierarxiya uchun «non parchalari».
Deep link - muayyan holat/boʻlimga chuqur havola.
Command Palette - global qidiruv/xatti-harakatlar.
Time-to-Target - maqsadli ekranga/harakatga yetish vaqti.

16) Jami

1. aniq ko’p darajali IA,

2. barqaror o’qish URLlari va

3. navigatsiyaning kombinatsiyalashgan modellari (menyu + tablar + qidiruv/ K),

4. foydalanish imkoniyati va mahalliylashtirish,

5. metrika va A/B doimiy silliqlash uchun.

Shunday qilib, interfeys funksionallik o’sib borayotgan paytda ham tushunarli va tezkor bo’lib qoladi.