GH GambleHub

Interfeýsiň nawigasiýa arhitekturasy

1) Nawigasiýa arhitekturasy näme we näme üçin zerur?

Nawigasiýa arhitekturasy (NA) önümde ulanyjyny ugrukdyrmagyň ulgamlaýyn usulydyr: nirede ýerleşýändigine, nirä gidip biljekdigine we nädip dolanyp biljekdigine düşünýär. Gowy NA:
  • Ulanyjynyň maksatlaryny mazmun/surat gurluşy bilen baglanyşdyrýar.
  • Öňünden aýdyp boljak nagyşlaryň hasabyna aň-düşünjäni peseldýär.
  • Netijäniň gazanylmagyny çaltlaşdyrýar (az basmak/bökmek).
  • Önüm ulalanda ulalýar.

Ýörelgeler: yzygiderlilik> döredijilik, aç-açan görkezmeler> gizlin yşaratlar, esasy maksada çenli 3-4 hereketden gysga ýol.

2) Nawigasiýa gatlaklary (IA derejeleri)

1. Global dereje - önüm bölümleri (mysal üçin: Lobbi, Live, Paýnamalar, Gapjyk, Profil).
2. Bölüm/kategoriýa - kiçi bölümler we esasy funksiýalar (kataloglar, hasabatlar, sazlamalar).
3. Sahypa/görnüş - anyk zatlar (oýun, hasabat, görnüş).
4. Lokal/kontekst - tablar, labyrlar, "has köp görkezmek", paginasiýa.
5. Taryh we gaýdyp gelmek - çörek bölekleri, "soňkusyna".

Düzgün: Her derejede aç-açan "Men nirede?" (işjeň nokat, H1/bölek) we "indiki näme?" (STA/salgylanmalar/teklipler).

3) Nawigasiýa modelleri we olary haçan saýlamaly

Ýokarky menýu (top-nav): 5-7 ýokary derejeli bölüm. Sarp ediş interfeýsleri we mobaýl üçin gowy (aşaky tablara öwrülýär).
Aşaky tagtalar (mobile): 5 nokada çenli, kesgitlenildi, nyşan + bellik. Esasy hereketler hemişe baş barmagyň aşagynda.
Çep saýdbar: çuňlugy 2-3 dereje, önümlerde we adminkalarda işleýär. Ýygy-ýygydan nokatlar üçin çökmek/pinler.
Mega menýu: uly kataloglar (dükanlar, mazmun howuzlary). Mowzuklar boýunça toparlaýar, maslahatlary we çalt baglanyşyklary goşýar.
Çörek bölekleri: çuňňur ýollar we SEO mazmuny üçin; H1 we top-nawigasiýa çalyşmaýar.
Kontekst nawigasiýasy: tablar, çip-süzgüçler, "related", longridlerde mazmuny (TOC).
Topar palitrasy/Global search ( K): tebigat atlaryna we hereketlerine görä çalt geçişler.
Gysga we yşaratlar: power-users (gyzgyn düwmeler, swipler) - ýöne hemişe UI-ekwiwalenti bilen.

Saýlamak: bölümleriň sanyna, çuňlugyna, ulanylyş ýygylygyna we enjamlara baglydyr.

4) Marşrut we URL strategiýasy

Okalýan URL: '/games/slot/[ slug] ', '/reports/ngr? period=Q3`.
Durnuklylyk: redaktirlemezden URL-ni üýtgetmäň; ters laýyklygy saklaň.
Ýagdaý parametrleri bolan ugurlar: süzgüçler/sortlar - query; ID - ýolda.
Görnüşi saklamak: "Baglanyşygy häzirki süzgüçden/labyrdan göçürmek".
Çuňňur baglanyşyklar: toplardan/poçtadan - nyşana, ygtybarly ygtyýarnama bilen.
Awtonom we dikeldiş: Yzyna gaýtarylanda - pozisiýany/süzgüçleri dikeldiň.

5) Maglumat görkezmeleri we bellikleri

Nokadyň işjeň ýagdaýy (reňk/zolak, nyşan).
H1 we lead - sahypanyň mazmunyny aýdýarlar.
Bölümiň ýerleşişi - döwükler, seýdbardaky bellikler, tabagyň yşyklandyrylyşy.
Boş ýagdaýlar - nirä gitmelidigini görkezýär (CTA, kömege salgylanmalar).
Durnukly sözlük - ähli ýerlerde elementleriň atlary birmeňzeş.

6) Gözleg we buýruk palitrasy

Global search: tebigat indeksi (oýunlar, üpjün edijiler, hasabatlar) + çalt hereketler ("/deposit ", "/kyc").
Awtomatiki doldurmak: soňky we meşhur haýyşlar, dar maslahatlar.
Semantika: netijeleriň aýry-aýry "görnüşleri" (mazmuny, salgylanma sahypalary, sazlamalar).
Topar palitrasy ( K): atlar we hotkeýler boýunça ugrukdyryş, rus/iňlis/sinonimlere goldaw.

7) Ýagdaýlar, rollar we elýeterlilik

RBAC: diňe bar bolan bölümleri görkeziň; çal "gulplar" - tygşytly we düşündirişli.
Myhman re modeimi: çäkli menýu nokatlary, CTA hasaba alynmaga/girişe eltýär.
Tenantlyk: markalar/operatorlar boýunça giňişlikler - global selektorda bölünişik.
Hukuklaryň güýçlenmegi: KYC/2FA soň - täze ugurlar açylýar.

8) Ykjam aýratynlyklary

Aşaky nawigasiýa (≤ 5): Lobbi, Live, Paýnamalar, Gapjyk, Profil.
Sütükden ýasalan diplinkler: zerur tab/goýma/labyra eltýär; yzyna gaýtarmak - öňki ýagdaýa.
Yza yşaratlar: aýlawly karuseller (okly lok) bilen gapma-garşy bolmaýar.
Sticky elementleri: Kiçi oýunçy/häzirki oýun, "Depozit" - ýüzýän CTA.

9) Elýeterlilik we lokalizasiýa

Fokus-tertip wizual iýerarhiýa laýyk gelýär.
Menýu/bölekler/tablar üçin ARIA atributlary. Nyşanlaryň gollary hökmanydyr.
Klawiatura nawigasiýasy: oklar/Tab/Enter; görünýän hile.
RTL/diller: tory we nokatlaryň tertibini görkeziň, mikro-göçürmäni lokallaşdyryň.
Kontrast we ölçegler: WCAG AA minimal; tap-nyşanlar ≥ 44px.

10) Öndürijilik we durnuklylyk

Progressiw nawigasiýa ýüklemek: Sydbar/menýu skeletleri.
Menýuny/sözlügini kesmek: tory az çekmek, derrew nawigasiýa.
Iň ýakyn ugurlary ýüklemek: hover/fokus boýunça; akylly býudjetler.
Durnuklylyk: goşmaça ýüklenende bökmezlik (kesgitlenen ölçegler).
404/403-den gorag: dostlukly sahypalar we çalt "yzyna".

11) Telemetriýa we metrika

Wakalar:
  • 'nav _ click' (çeşme, nokat, pozisiýa), 'route _ change', 'search _ query/select',
  • `breadcrumb_click`, `deeplink_open`, `back_used`, `not_found_view`.
KPI:
  • Time-to-Target (maksatly ekrana/herekete çenli).
  • Nav Error Rate (404/403/dogry ýalňyşlyklar).
  • Return Rate (näçeräk yzyna gaýdyp gelendigi - düşnüksiz ýoluň alamaty).
  • Search Success% (2 basmak ≤ netije).
  • Buýruk palitrasyny we gyzgyn düwmeleri adoption.
A/B:
  • Sydbar vs mega menýu; ýokarky tablar vs çip-süzgüçler; "gözleg hemişe görünýär" vs basmak.

12) iGaming üçin patternler (mysallar)

Web-kazino operatory (B2C):
  • Global: Lobbi/Live/Mahabat/Ýaryşlar/Gapjyk/Profil.
  • Lobbiniň içinde: çip-süzgüçler (Täze, Jekpotlar, Üpjün edijiler, Buy-Bonus), gözleg.
  • Bölekler - lobbide däl-de, üpjün edijileriň/makalalaryň sahypalarynda.
Üpjün edijiniň B2B-administratory:
  • Saýdbar: Daşbordlar/Mazmun/Hyzmatdaşlar/Hasabatlar/Utgaşyk/Sazlamalar.
  • Bölümleriň içinde - tablar (Sanaw/Relizler/Sertifikat).
  • Buýruk palitrasy: "Oýny ID boýunça açyň", "Çykyşy dörediň", "Hasabaty eksport et".

13) Antipatternler

Toparlanmazdan 20 + bal üçin menýu (wizual ses).
Bir bölümiň dürli ýerlerdäki atlary.
Gizlin möhüm nawigasiýa diňe burger menýusynda (desktop).
Tagtalary süzgüç hökmünde gaýtadan ulanmak (dürli manylar - bir görnüş).
Ýagdaýy bozýan geçişler ("yza" süzgüçleri taşlamak).
Mazmuny we CTA-ny gurşap alýan "ýelmeşýän" paneller.

14) Giriş çek-sanawy (sprintlar boýunça)

Sprint 1 - Kart: bölümleri, maksatly ýollary (top-tasks), terminleriň sözlügi.
Sprint 2 - IA: toparlanma, derejeler, modeli saýlamak (top-nav/side/mega/tabs). Prototip.
Sprint 3 - Marşrut/URL: okalýan ýollar, süzgüçleri saklamak, diplinkalar, 404/403.
Sprint 4 - Gözleg/ K: jandarlaryň görkezijisi, awtomatiki doldurma, çalt hereket etmek.
Sprint 5 - Elýeterlilik/lokal: klawiatura, ARIA, RTL, kontrast.
Sprint 6 - Telemetriýa/A-B: Time-to-Target, Search Success, back-bounces; modelleriň synagy.
Sprint 7 - Öndürijilik: Sözlük/menýu keş, goňşy ugurlar prefetch, skeletler.

15) Sözlük

IA (Information Architecture) - bölümleriň/mazmunyň logiki gurluşy.
Top-nav/Side-nav/Tabs/Mega-menu - nawigasiýa modelleri.
Breadcrumbs - çuňňur iýerarhiýa üçin "çörek bölekleri".
Çuňňur baglanyşyk - belli bir ýagdaýa/bölüme çuňňur baglanyşyk.
Command Palette - hotkey boýunça global gözleg/hereket.
Time-to-Target - maksatly ekrana/herekete ýetmek üçin wagt.

16) Jemleýji

Nawigasiýa arhitekturasy, ulanyjynyň ýoluny gysga we öňünden aýdyp boljak önümiň kartasydyr. Üstünlik berýär:

1. aç-açan köp derejeli IA,

2. durnukly okalýan URL-ler we ýagdaýy saklamak,

3. birleşdirilen nawigasiýa modelleri (menýu + tab + gözleg/ K),

4. elýeterlilik we lokalizasiýa,

5. metrikler we hemişelik ýalpyldawuk üçin A/B.

Şonuň üçin interfeýs funksionallyk ýokarlananda-da düşnükli we çalt bolup galýar.

Contact

Biziň bilen habarlaşyň

Islendik sorag ýa-da goldaw boýunça bize ýazyp bilersiňiz.Biz hemişe kömek etmäge taýýar.

Telegram
@Gamble_GC
Integrasiýany başlamak

Email — hökmany. Telegram ýa-da WhatsApp — islege görä.

Adyňyz obýýektiw däl / islege görä
Email obýýektiw däl / islege görä
Tema obýýektiw däl / islege görä
Habar obýýektiw däl / islege görä
Telegram obýýektiw däl / islege görä
@
Eger Telegram görkezen bolsaňyz — Email-den daşary şol ýerden hem jogap bereris.
WhatsApp obýýektiw däl / islege görä
Format: ýurduň kody we belgi (meselem, +993XXXXXXXX).

Düwmäni basmak bilen siz maglumatlaryňyzyň işlenmegine razylyk berýärsiňiz.