مركز مقامرة الهوية المرئية

1) جوهر العلامة التجارية والمبادئ

الصورة: تكنولوجية وصادقة وموثوقة وقائمة على البيانات ومسؤولة.
النغمة: محفوظة وذات كفاءة ؛ بدون مبالغة «القمار».
المبادئ: إمكانية القراءة> الزخارف، التوافر الافتراضي، الاتساق بين المنتجات.

2) الشعار: الهيكل والاستخدام

2. 1 الخيارات

Main (أفقي): sign + word Gamble Hub.
Compact (sign): for favicon/avatars.
عمودي: للمناطق الضيقة.

2. الهيكل 2 والمنطقة الأمنية

شبكة 8px. منطقة الحراسة = ارتفاع العاصمة G حول المحيط.
الحد الأدنى للحجم: 18 مم ؛ شاشة - 120 بكسل.
لا يمكنك تغيير النسب أو الانحراف أو إضافة تأثيرات/تدرجات من خارج اللوحة.

2. 3 معلومات أساسية

على خلفية خفيفة - شعار اللون.
على معقد/صورة - أحادي اللون (أبيض/أسود) على لوحة 8-12 px جولات.
في الظلام - مقلوب.

3) نظام الألوان (الرموز)

3. 1 لوحة أساسية

الابتدائي/Indigo 600: «# 2F6BFF»

Primary Dark/Indigo 700: '# 1E54F0'

النجاح/الأخضر 600: «# 2EAE60»

تحذير/برتقالي 600: # FF9F1A

حرجة/حمراء 600: # E53935

FG Primary: '# 11131A'

FG Smuted: '# 656D76'

قاعدة BG: # FFFFF

BG Subtle: # F7F8FA

معكوس BG: # 0E1116

3. 2 التدرجات (اختياري)

تدرج العلامة التجارية: «التدرج الخطي (135 ديسيبل، # 2F6BFF 0٪، # 1E54F0 50٪، # 2EAE60 100٪)» - استخدام الجرعة.

3. 3 التباين والحالات

الزر الأساسي: الخلفية «# 2F6BFF»، النص الأبيض، تحوم «# 1E54F0»، معطل 40٪ ألفا.
تباين النص ≥ 4. 5:1 (أ أ). للانعكاس - ≥ ٣:١ للكبير.

4) الطباعة

العناوين: Inter/SF Pro/system، محتوى الدهون 600-700.
النص: Inter 14-16 px، line-height 1. 5.
الرمز/الأحادي: JetBrains Mono أو النظام الأحادي.
التسلسل الهرمي: H1 32/40، H2 24/32، H3 20/28، Body 16/24، التسمية التوضيحية 12/16.
لا تستخدم الخطوط الزخرفية للواجهة.

5) الشبكة والفواصل ونصف القطر

الشبكة: 8px ؛ حاويات ذات عرض أقصى 1120-1280 px.
البطاقات: المسافات الداخلية 16-24 px، البطاقات البينية - 16 px.
Radii: 8/12/16 px ؛ افتراضي 12 px، ل 8 أزرار px.
Тени: «0 1px 2px rgba (0,0,0، .08)» (sm)، «0 4px 12px rgba (0,0,0، .10)» (md).

6) الأيقونات والرسوم التوضيحية

شبكة الرموز 24 × 24، السطر 1. 75-2px، الجولات متطابقة.
الدلالات أساسية، واللون ثانوي (تغيرات اللون على الحالات).
الرسوم التوضيحية: مسطحة، بدون رموز «غير رسمية» (رقائق/بطاقات - فقط في مواد معلومات محايدة وفي سياقات معتدلة وغير حوافز).

7) الصور والصور

المواضيع: التكنولوجيا والبيانات والأمن والفريق.
تجنب الجائزة الكبرى/قصاصات الورق.
يوجد فوق الصورة لوحة متدرجة/داكنة للتباين النصي (على الأقل 60٪ عتامة في الجزء المظلم).

8) موضوعات مظلمة وخفيفة

الظلام: الخلفية «# 0E116»، نص «# E6E8EB»، الحدود «# 2A2F37».
تحتفظ اللهجات بالتباين (السطوع الأساسي بنسبة 8-12٪).
الرسومات: الخلفية أخف 2 من الخلفية، والشبكة مكتومة، والتعليقات التوضيحية متباينة.

9) التوافر (A11y)

تباين AA/AAA ؛ لا يمكن إزالة أنماط التركيز.
البدائل النصية في الشعار والصور المهمة.
الحد الأدنى لحجم النقرة هو 40-48 px.
احترام «prefers-reduced-motion» - تقليل/تعطيل الرسوم المتحركة.

10) النغمة وكتابة الإعلانات الدقيقة

قصير، بالضبط، بدون مصطلحات.
تشرح الأخطاء ما يجب فعله للمستخدم.
الوحدات والأشكال: التواريخ في موقع المستخدم، في الواجهة - المنظمة الدولية للتوحيد القياسي عند الدخول، العملات ذات الرمز (اليورو، الدولار الأمريكي).
لا تستخدم استعارات «المقامرة» في رسائل البقالة.

11) أمثلة رمزية (JSON و 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) المكونات والحالات (أمثلة واجهة المستخدم)

الزر الأساسي: الخلفية الأولية -600، النص # FFF، التحليق الابتدائي -700، المعاق 40٪ ألفا.
الشارات: النجاح/التحذير/النقد مع نص مقروء وأيقونة.
البطاقة: BG Base background، sm shadow، md radium، 16 px header، 16-24 px body.

13) الرسوم المتحركة والحركة

التحولات 120-200 مللي ثانية، منحنى «السهولة في الخروج».
الرسوم المتحركة - فقط «تحويل »/« عتامة».
للحالات الحرجة - بدون رسوم متحركة (لا تشتت الانتباه).

14) وسائل التواصل الاجتماعي والعروض التقديمية والبريد الإلكتروني

Avatars/icons: علامة على primary-600 die، indents 12-16 px.
الشرائح: خلفية فاتحة/مظلمة، شبكة 8px، H1 40-48، المحتوى 18-24.
البريد الإلكتروني: نموذج HTML عرض 600-720 px، خطوط النظام/إنتر، أزرار ≥ ارتفاع 44 px، سمة مظلمة تؤخذ في الاعتبار.

15) الطباعة والبضائع والشكل الخارجي

ملف تعريف لون CMYK، يتفق معادلات Pantone مع غرفة الطباعة.
احتفظ بالحجم الأدنى للشعار ونصف القطر.
الورق - غير لامع، تجنب ورنيش «الصراخ» ؛ النقش مقبول بالنسبة للعلامة.

16) التربيعات القانونية واللعب المسؤول

شعار مع إشارة ®/™ إذا لزم الأمر (urd. البلد).
إخلاء المسؤولية والقيود العمرية - في المنطقة السفلى من المخططات ؛ AA.
لا تستخدم الهوية في المحتوى الذي يشجع على السلوك المفرط.

17) التوطين و RTL

رمز/كلمة الشعار غير مترجم.
القطع النصية - في الموارد ؛ دعم RTL (انعكاس السهم/الأيقونة).
ضع في اعتبارك أطوال الخطوط باللغة الألمانية/التركية/العربية للتخطيطات.

18) افعل/لا تفعل

• حافظ على التباين، مناطق الحراسة، تسلسل الخط، شبكة 8px.
• تحقق من الرؤية في الصور/مقاطع الفيديو ؛ استخدام الموت.
• اتبع الرموز - لا توجد ألوان «عشوائية».

• قم بتمديد/جز الشعار، وقم بتطبيق الظلال/الضربات «للجمال».
• استخدم صور «المقامرة» كخلفية في المنتجات.
• امزج الخطوط غير القياسية أو كسر التباين أو إزالة التركيز.

19) الأصول والتسمية والنسخ

التسمية: "gh-logo-hz-color. svg، 'gh-logo-vt-mono-white. svg '،' gh-icon-24-alert. svg '.
Пакеты: «/العلامة التجارية/الشعارات/»، «/العلامة التجارية/الأيقونات/24/»، «/العلامة التجارية/القوالب/»، «/العلامة التجارية/الخطوط/».
الأشكال: SVG للشعارات/الأيقونات ؛ PNG/WebP للشاشات ؛ PDF للطباعة.
الإصدار: SemVer لحزمة رمزية/رمزية ؛ مع «إضافة/تغيير/نقض/إزالة».
مصدر الحقيقة: → ببناء مستودع رمزي للويب/iOS/Android.

20) مراقبة الجودة والعملية

مراجعة العلامة التجارية في العلاقات العامة: التحقق من الرموز والتباين.
ألف/باء للصور الأساسية المثيرة للجدل (سهولة القراءة/التحويل).
البطانة: حظر الألوان خارج الرموز المميزة، والتحقق من النص البديل للصور.
التدقيق الفصلي: اتساق مجموعة الألوان/الطباعة/الرموز.

21) قوالب

الشرائح الرئيسية: العنوان، القسم، المحتوى، «البيانات/الرسم البياني»، النهائي.
وسائل التواصل الاجتماعي: 1:1 صورة رمزية، 16:9 لافتة، قصص 9:16.
البريد الإلكتروني: تحية، CTA، إخطار، خلاصة.

الهبوط: كتلة البطل، 3 امتيازات، عرض، CTA، الطابق السفلي

22) قائمة مرجعية للتطبيق

• الشعار: الخيار الصحيح، المنطقة الأمنية، التباين، الحجم.
• الألوان: الرموز فقط ؛ تباين AA.
• الخطوط: التسلسل الهرمي، سطرًا بسطر، أحجام الأهداف.
• الأيقونات: الشبكة 24 × 24، سمك الخط الموحد.
• الصور: موضوعات صالحة، إمكانية قراءة النص في الأعلى.
• موضوع الظلام/الضوء: تم التحقق منه، بدون قطع أثرية.
• التوطين/RTL: الخطوط لا «تكسر» التصميم.
• توجد علامات الترميز القانونية/المسؤولة للألعاب.

23) خطة التنفيذ (3 تكرارات)

• الشعارات، اللوحة، الطباعة، الرموز الأساسية، مجموعة من الأيقونات 24 × 24 (40-60 pcs.) ونماذج العرض والبريد الإلكتروني.

• السمة المظلمة، مكونات واجهة المستخدم على الرموز (الأزرار والبطاقات والجداول)، دليل الرسوم البيانية، حزمة الوسائط الاجتماعية، صفحة الهبوط.

• حزمة أيقونات موسعة، رسوم توضيحية، تخطيطات مطبوعة، بطانة/CI للرموز، عمليات تدقيق منتظمة للعلامة التجارية.

24) الأسئلة الشائعة المصغرة

هل من الممكن إعادة طلاء الشعار لعمل خاص ؟

فقط في المواضيع الموسمية المعتمدة ودون انتهاك منطقة التباين/الأمن.

ما هو الأساسي - الرموز أو التصميم ؟

الرموز. يجب أن يستخدم التصميم متغيرات لون النظام/المسافة البادئة/الطباعة.

كيف تتصرف في القضايا المثيرة للجدل ؟

افتح RFC في مستودع الهوية، وأرفق أمثلة، وأجري مراجعة للعلامة التجارية.

المجموع

هوية Gamble Hub ليست «مجموعة صور»، ولكنها نظام: الشعار واللوحة والطباعة وحزمة الأيقونات والرموز وعمليات مراقبة الجودة. اتبع قواعد التباين والتوافر والاتساق، واستخدم الرموز والنماذج - وستكون العلامة التجارية معروفة وحديثة وموحدة في جميع المنتجات والقنوات.