Gamble Hub vizual identikası

1) Marka mahiyyəti və prinsipləri

Görünüş: texnoloji, dürüst, etibarlı, məlumatlara və məsuliyyətə yönəlib.
Ton: təmkinli və səriştəli; «qumar» hiperbola olmadan.
Prinsipləri: oxunabilirlik> bəzək, default mövcudluq, məhsullar arasında uyğunluq.

2) Logo: quruluş və istifadə

2. 1 variantları

Əsas (üfüqi): işarə + Gamble Hub sözü.
Kompakt (işarə): favikon/avatarlar üçün.
Şaquli: dar platformalar üçün.

2. 2 Dizayn və mühafizə sahəsi

8px. Mühafizə zonası = perimetri boyunca böyük G hündürlüyü.
Minimum ölçüsü: çap - 18 mm enində; ekran - 120 px.
Ölçüləri dəyişmək, əyilmək, palitradan kənar effektlər/qradiyentlər əlavə etmək olmaz.

2. 3 Fonda

Açıq fonda - rəngli loqo.
Mürəkkəb/fotoşəkillərdə - monoxrom (ağ/qara) 8-12 px yuvarlaqlaşdırılır.
Qaranlıq - tərs.

3) Rəng sistemi (tokenlər)

3. 1 əsas palitra

Primary / Indigo 600: `#2F6BFF`

Primary Dark / Indigo 700: `#1E54F0`

Success / Green 600: `#2EAE60`

Warning / Orange 600: `#FF9F1A`

Critical / Red 600: `#E53935`

FG Primary: `#11131A`

FG Muted: `#656D76`

BG Base: `#FFFFFF`

BG Subtle: `#F7F8FA`

BG Inverse: `#0E1116`

3. 2 Qradiyentlər (isteğe bağlı)

Brand Gradient: 'linear-gradient (135deg, #2F6BFF 0%, #1E54F0 50%, #2EAE60 100%)' - dozada istifadə.

3. 3 Kontrast və vəziyyət

primary düyməsi: fon '#2F6BFF', mətn ağ, hover '#1E54F0', disabled 40% alfa.
Mətnin kontrastı ≥ 4. 5:1 (AA). Inversiya üçün - böyük üçün ≥ 3:1.

4) Mətbəə

Başlıqlar: Inter/SF Pro/sistem, yağlılıq 600-700.
Mətn: Inter 14-16 px, line-height 1. 5.
Kod/mono: JetBrains Mono və ya sistem mono.
İyerarxiya: H1 32/40, H2 24/32, H3 20/28, Body 16/24, Caption 12/16.
Interfeys üçün dekorativ şriftlərdən istifadə etməyin.

5) Grid, girintilər və radiuslar

Grid: 8px; max-width 1120-1280 px ilə konteynerlər.
Kartlar: daxili 16-24 px, kartlararası 16 px.
Radiuslar: 8/12/16 px; default 12 px, 8 px düymələri üçün.
Тени: `0 1px 2px rgba(0,0,0,.08)` (sm), `0 4px 12px rgba(0,0,0,.10)` (md).

6) İkonoqrafiya və illüstrasiyalar

24 × 24 nişanlar şəbəkəsi, xətt 1. 75-2px, dairəvi razılaşdırılır.
Semantika birincidir, rəng ikincidir (rəng vəziyyətə görə dəyişir).
İllüstrasiyalar: düz, «təsadüfi» simvollar olmadan (çiplər/kartlar - yalnız neytral informasiya materiallarında və mülayim, həvəsləndirici olmayan kontekstlərdə).

7) Şəkillər və fotoşəkillər

Mövzular: texnologiya, məlumat, təhlükəsizlik, komanda.
«Jackpot/konfeti» klişesinden çəkinin.
Fotonun üstündə - mətn kontrastı üçün qradiyent/tünd qəlib (qaranlıq hissədə ən azı 60% qeyri-şəffaflıq).

8) Qaranlıq və parlaq mövzular

Qaranlıq: fon '#0E1116', mətn '#E6E8EB', sərhədlər '#2A2F37'.
Aksentlər kontrastı saxlayır (primary 8-12% aydınlaşır).
Qrafiklər: fon arxa plandan 2 addım yüngüldür, tor səssiz, imzalar kontrastlıdır.

9) Mövcudluq (A11y)

AA/AAA kontrastı; fokus stilləri təmizləmək deyil.
Loqo və əhəmiyyətli şəkillərin mətn alternativləri.
Kliklərin minimum ölçüsü 40-48 px-dir.
Hörmət 'prefers-reduced-motion' - aşağı/off animasiyalar.

10) Ton və mikrokopiraytinq

Qısa, dəqiq, jarqon olmadan.
Səhvlər istifadəçinin nə edəcəyini izah edir.
Vahidlər və formatlar: istifadəçi lokalında tarixlər, giriş zamanı interfeysdə - ISO, kodlu valyuta (EUR, USD).
Məhsul mesajlarında «qumar» metaforalarından istifadə etməyin.

11) Token nümunələri (JSON və CSS)

json
{
"color": {
"primary": { "600": "#2F6BFF", "700": "#1E54F0" },
"success": { "600": "#2EAE60" },
"warning": { "600": "#FF9F1A" },
"critical": { "600": "#E53935" },
"fg": { "primary": "#11131A", "muted": "#656D76" },
"bg": { "base": "#FFFFFF", "subtle": "#F7F8FA", "inverse": "#0E1116" }
},
"radius": { "sm": 8, "md": 12, "lg": 16 },
"shadow": { "sm": "0 1px 2px rgba(0,0,0,.08)", "md": "0 4px 12px rgba(0,0,0,.10)" },
"font": { "family": "Inter, system-ui", "size": { "body": 16, "h1": 32, "h2": 24, "h3": 20 } }
}

css
:root {
--gh-color-primary-600:#2F6BFF; --gh-color-primary-700:#1E54F0;
--gh-color-success-600:#2EAE60; --gh-color-warning-600:#FF9F1A; --gh-color-critical-600:#E53935;
--gh-fg-primary:#11131A; --gh-fg-muted:#656D76;
--gh-bg-base:#FFFFFF; --gh-bg-subtle:#F7F8FA; --gh-bg-inverse:#0E1116;
--gh-radius-sm:8px; --gh-radius-md:12px; --gh-radius-lg:16px;
--gh-shadow-sm:0 1px 2px rgba(0,0,0,.08); --gh-shadow-md:0 4px 12px rgba(0,0,0,.10);
--gh-font-body:16px/1. 5 "Inter", system-ui;
}

12) Komponentlər və vəziyyətlər (UI nümunələri)

Primary düyməsi: fon primary-600, mətn #FFF, hover primary-700, disabled 40% alfa.
Nişanlar: oxunan mətn və ikona ilə success/warning/critical.
Kart: fon BG Base, kölgə sm, radius md, xeder 16 px, bədən 16-24 px.

13) Animasiya və hərəkət

120-200 ms keçid, 'ease-in-out' əyrisi.
Animasiya - yalnız 'transform '/' opacity'.
Kritik hallar üçün - animasiyasız (diqqəti yayındırmayın).

14) Sosial media, təqdimatlar, e-mail

Avatarlar/simgələr: primary-600 lövhəsindəki işarə, 12-16 px.
Slaydlar: işıqlı/qaranlıq fon, 8px mesh, H1 40-48, 18-24 məzmun.
E-mail: HTML şablon 600-720 px enində, sistem/Inter şriftləri, 44 px hündürlüyündə ≥ düymələri, qaranlıq mövzu nəzərə alınır.

15) Çap, ölçü və xarici

CMYK rəng profili, Pantone ekvivalentləri mətbəə ilə razılaşdırılır.
Minimum logo ölçüləri və radiusları saxlamaq.
Kağız - tutqun, «qışqıran» laklardan qaçın; döymə işarəsi üçün icazə verilir.

16) Hüquqi qeydlər və məsuliyyətli oyun

Lazım olduqda ®/™ nişanlı logo (yurd. ölkə).
Disleymerlər və yaş məhdudiyyətləri - maketlərin aşağı zonasında; AA oxunma qabiliyyəti.
Həddindən artıq davranışı təşviq edən məzmunlarda identikadan istifadə etməyin.

17) Lokalizasiya və RTL

Loqonun işarəsi/sözü tərcümə olunmur.
Mətn blokları - resurslarda; dəstək RTL (nişanlar/ikonlar güzgü).
Almanca/Türkcə/Ərəbcə sətirlərin uzunluqlarını maketlərdə nəzərə alın.

18) Do / Don’t

• Kontrast, mühafizə zonaları, şrift iyerarxiyası, 8px grid saxlayın.
• Şəkil/video görünürlüyünü yoxlayın; kalıp istifadə edin.
• Tokenləri izləyin - «təsadüfi» rənglər yoxdur.

• Logonu uzatmaq/biçmək, «gözəllik üçün» kölgə/kontur tətbiq etmək.
• Məhsullarda fon kimi «qumar» şəkillərindən istifadə edin.
• Qeyri-standart şriftləri qarışdırın, kontrastı pozun və ya fokusu silin.

19) Assetlər, neyminq və versiyalar

Neyminq: 'gh-logo-hz-color. svg`, `gh-logo-vt-mono-white. svg`, `gh-icon-24-alert. svg`.
Пакеты: `/brand/logos/`, `/brand/icons/24/`, `/brand/templates/`, `/brand/fonts/`.
Formatlar: SVG loqotiplər/nişanlar üçün; Raster üçün PNG/WebP; Çap üçün PDF.
Version: Token/Simge paketi üçün SemVer; chenclog ilə 'added/changed/deprecated/removed'.
Həqiqət mənbəyi: web/iOS/Android üçün token → yığma anbarı.

20) Keyfiyyətə nəzarət və proses

Brand Review in PR: tokenlərin və kontrastın yoxlanılması.
Mübahisəli fon görüntüləri üçün A/B (oxuculuq/çevirmə).
Linter: tokenlər xaricində rənglərin qadağan edilməsi, şəkillər üçün alt mətnin yoxlanılması.
Rüblük audit: palitranın/mətbəənin/ikonpakın sabitliyi.

21) Şablonlar

Keynote/Slides: başlıq, bölmə, məzmun, «məlumat/qrafik», final.
Sosial media: 1:1 avatar, 16:9 banner, hekayələr 9:16.
E-mail: salam, CTA, bildiriş, digest.
Lending: hero-blok, 3 üstünlükləri, vitrin, CTA, zirzəmi.

22) Check-list tətbiqi

• Logo: düzgün seçim, mühafizə zonası, kontrast, ölçüsü.
• Rənglər: yalnız tokenlər; AA kontrastı.
• Şriftlər: iyerarxiya, sətirlərarası, hədəflərin ölçüləri.
• Nişanlar: 24 × 24 mesh, vahid xətt qalınlığı.
• Şəkillər: məqbul mövzu, yuxarıda mətn oxunması.
• Qaranlıq/parlaq mövzu: yoxlanılmış, heç bir artefakt.
• Lokalizasiya/RTL: sətirlər maketi «sındırmır».
• Hüquqi/Responsible Gaming qeydlər mövcuddur.

23) Tətbiq planı (3 iterasiya)

• Loqotiplər, palitralar, tipoqrafiya, əsas tokenlər, 24 × 24 nişanlar dəsti (əsas 40-60 ədəd), təqdimat şablonları və e-mail.

• Qaranlıq mövzu, tokenlərdə UI komponentləri (düymələr, kartlar, cədvəllər), qrafiklər üçün bələdçi, sosial media paketi, lendinq şablonu.

• İkonpack genişləndirilmiş, illüstrasiyalar, çap tərtibatları, tokenlər üçün linter/CI, müntəzəm marka auditləri.

24) Mini-FAQ

Xüsusi promosyon üçün loqotipi yenidən rəngləmək mümkündürmü?
Yalnız təsdiqlənmiş mövsümi mövzularda və kontrast pozulmadan/mühafizə zonası.

Əsas nədir - tokenlər və ya maket?
Tokenlər. Düzən sistem rəng/girinti/tipoqrafiya dəyişənlərindən istifadə etməyə borcludur.

Mübahisəli hallarda necə hərəkət etmək olar?
RFC-ni identika anbarında açın, nümunələr əlavə edin, Brand Review keçirin.

Yekun

Gamble Hub identikası «şəkil dəsti» deyil, loqo, palitra, tipoqrafiya, ikonpak, tokenlər və keyfiyyətə nəzarət prosesləri kimi sistemdir. Kontrast, əlçatanlıq və uyğunluq qaydalarına əməl edin, token və şablonlardan istifadə edin və marka bütün məhsul və kanallarda tanınan, müasir və vahid olacaq.