نظام واحد
لكل ما تراه العين.One system
for everything
the eye sees.
الألوان والخطوط والمكوّنات والحركة التي يُبنى بها موقع عين الصقر وتطبيقه ولوحة تحكم الملاعب والعرض التقديمي — بالعربي والإنجليزي، وبالوضعين الداكن والفاتح.
The colours, type, components and motion behind the Falcon Eye website, app, venue dashboard and pitch deck — in Arabic and English, dark and light.
الشعارLogo
رأس صقر فضّي بخطوط حادة، وعين ليمونية هي نقطة التركيز الوحيدة. الحرف A بدون خط أفقي (Λ) ليشبه رأس السهم. لكل شعار نسخة للخلفية الداكنة وأخرى للفاتحة — بدّل الوضع من الأعلى لترى الفرق.
A silver falcon head in sharp sweeps, with a lime eye as the single point of focus. The A drops its crossbar (Λ) to read like an arrowhead. Every logo has a dark-background and a light-background version — switch the theme above to see both.
الرمز والنسخ أحادية اللونMark and one-colour versions
المساحة الآمنةClear space
مسافة فارغة تساوي ارتفاع حرف E على الأقل من كل جهة.At least the height of the E, clear on every side.
أصغر مقاسMinimum size
الرمز 20 بكسل · الشعار الأفقي 120 بكسل. تحت 160 بكسل احذف «SEE FURTHER» واستخدم الكلمة فقط.Mark 20 px · horizontal logo 120 px. Below 160 px, drop "SEE FURTHER" and use the wordmark.
ممنوعاتMisuse
الألوانColour
داكن أولًا. الليموني هو اللون المميّز الوحيد — تعبئة للأزرار الرئيسية والمؤشرات المهمة، ولا يُستخدم كنص على الخلفيات الفاتحة. اضغط أي لون لنسخه.
Dark first. Lime is the only accent — a fill for primary actions and key indicators, never text on light backgrounds. Click any colour to copy it.
تدرّج المحايدNeutral scale
تدرّج الليمونيLime scale
الرموز الدلالية (Semantic tokens)Semantic tokens
استخدم هذه الأسماء في الكود دائمًا، لا الألوان الخام — هي التي تتبدّل تلقائيًا بين الداكن والفاتح.Always use these names in code, not raw hex — they're what switch automatically between dark and light.
| Token | داكنDark | فاتحLight | الاستخدامUse |
|---|
الخطوطTypography
Montserrat للإنجليزي و Alexandria للعربي: خطّان هندسيان عريضان يتناسقان معًا. يتبدّل الخط تلقائيًا مع اللغة عبر --font.
Montserrat for English and Alexandria for Arabic: two wide geometric faces that sit together. The family switches with the language through --font.
الأرقام إنجليزية دائمًا (0123456789) — في العربي أيضًا. ولا تُستخدم الأرقام الهندية أبدًا.
Western digits always (0123456789) — in Arabic too. Never Arabic-Indic numerals.
abcdefghijklmnopqrstuvwxyz · 0123456789
0123456789
سُلّم الأحجامType scale
المسافات والزوايا والارتفاعSpace, radius & elevation
كل المسافات من مضاعفات 4 بكسل. الزوايا معتدلة — ليست حادة ولا دائرية جدًا.
All spacing is a multiple of 4 px. Corners are moderate — neither sharp nor bubbly.
الحركةMotion
سريعة وحاسمة مثل انقضاض الصقر. لا حركة بلا سبب: كل حركة تشرح تغيّرًا. تتوقف كلها تلقائيًا عند تفعيل «تقليل الحركة» في الجهاز.
Fast and decisive, like a falcon's dive. No motion without a reason: every animation explains a change. All of it switches off when the device asks for reduced motion.
منحنيات التسارعEasing
ease-out
ease-in-out
ease-snap
الأيقوناتIcons
شبكة 24 بكسل، خط بسماكة 1.6، أطراف دائرية، بدون تعبئة. تأخذ لون النص المحيط، وتصبح ليمونية للتمييز في الوضع الداكن. اضغط أي أيقونة لنسخ كود SVG.
24 px grid, 1.6 stroke, round caps, no fills. They inherit the text colour and turn lime for emphasis in dark mode. Click any icon to copy its SVG.
المقاسات: 16 داخل الأزرار الصغيرة، 20 الافتراضي، 24 في القوائم، 32 للعرض. لا تستخدم أيقونة بدون نص إلا مع تلميح (tooltip).Sizes: 16 in small buttons, 20 default, 24 in navigation, 32 for display. Never use an icon alone without a tooltip.
التصويرPhotography
ليل الملعب تحت الأضواء. معظم الصورة داكن، ونقطة واحدة مضيئة تجذب العين — تمامًا مثل الشعار. صور حقيقية من ملاعبنا، لا صور «ستوك» مبتسمة.
The pitch at night under floodlights. Mostly dark, with one bright point that pulls the eye — just like the logo. Real photos from our venues, never smiling stock.

منخفض الإضاءةLow-key
70% من الصورة ظلال. الضوء يأتي من الكشافات أو الشاشة، لا من فلاش.70% of the frame is shadow. Light comes from floodlights or a screen, never a flash.
نقطة تركيز واحدةOne point of focus
الكرة، الزر، أو وجه لاعب يشاهد جواله. ليس أكثر من واحدة في كل صورة.The ball, the button, or a player's face lit by their phone. Never more than one per frame.
ألوان هادئةMuted colour
العشب أخضر رمادي لا فاقع. الليموني لا يُضاف في التعديل — يأتي فقط من الواجهة أو ضوء حقيقي.Grass is grey-green, not neon. Lime is never added in the edit — only from UI or real light.
لحظة حقيقيةReal moments
لاعبون حقيقيون في مباراة حقيقية. حركة، عرق، احتفال — بدون وقوف أمام الكاميرا.Real players in a real game. Motion, sweat, celebration — no posing.
معالجة الألوان (Falcon grade)Colour grade (Falcon grade)
في الويب: On the web: filter: saturate(.65) contrast(1.12) brightness(.88)
قائمة اللقطات لكل ملعبShot list for every venue
✓افعلDo
- صوّر بعد المغرب، تحت الكشافاتShoot after sunset, under the floodlights
- اترك مساحة داكنة للنصLeave dark space for text
- استخدم إطارات حقيقية من مقاطع الإعادةUse real frames from replay clips
- احصل على موافقة اللاعبين قبل النشرGet players' consent before posting
✕لا تفعلDon't
- صور ستوك أو أشخاص يبتسمون للكاميراStock photos or people smiling at the camera
- صور نهارية بألوان مشبّعةDaylight, over-saturated shots
- توهّج، عدسات «HUD» وهمية، أو مؤثرات تقنية مزيّفةGlows, fake HUD overlays or sci-fi effects
- صور أطفال بدون إذن وليّ الأمرMinors without a guardian's consent
المقاسات والنص فوق الصورCrops and text on photos
الموقعWeb hero
منشورFeed
ستوريStory
صورةAvatar
النص يوضع فوق أغمق جزء من الصورة. عند الحاجة أضف تظليلًا من الأسفل بلون Obsidian لا يتجاوز 60% من الارتفاع — لا إطارات ولا صناديق خلف النص.Text sits on the darkest part of the photo. If needed, add an Obsidian scrim from the bottom, no taller than 60% of the frame — no boxes or panels behind text.
زر الإعادة — المكوّن الأساسيReplay button — the signature
المكوّن الذي يمثّل المنتج كله: الزر الموجود خلف المرمى، والزر نفسه داخل التطبيق ولوحة التحكم. جرّبه.
The component that is the product: the button behind the goal, and the same button in the app and the dashboard. Try it.
الأزرارButtons
زر رئيسي واحد (ليموني) في كل شاشة. البقية ثانوية أو حدود أو شفافة.
One primary (lime) button per screen. Everything else is secondary, outline or ghost.
الحقول والاختياراتForms & selection
الحالات والشاراتStatus & badges
الأحمر للبث المباشر فقط. الليموني للنجاح والجاهزية.
Red means live, nothing else. Lime means ready or done.
التنبيهات والتقدّمAlerts, toasts & progress
البطاقات والجداولCards & tables
مرّر المؤشر فوق بطاقة المقطع وصفوف الجدول.
Hover the clip cards and the table rows.
| المقطعClip | الملعبPitch | الوقتTime | الحالةStatus | |
|---|---|---|---|---|
| #1284 | ملعب 2 · الشمالPitch 2 · North | 21:47 | جاهزReady | |
| #1283 | ملعب 1 · الجنوبPitch 1 · South | 21:44 | جارٍ الحفظSaving | |
| #1282 | ملعب 3 · الشمالPitch 3 · North | 21:31 | جاهزReady |
النوافذ والتلميحاتModals & tooltips
مشغّل المقطعClip player
الشاشة التي يقضي فيها اللاعب أغلب وقته. شغّله: الإعادة البطيئة 0.5x، التقدّم إطارًا بإطار، والعلامة على الشريط تشير إلى لحظة الضغط على الزر. المفاتيح: المسافة للتشغيل، والأسهم للإطارات.
Where players spend most of their time. Play it: 0.5x slow-mo, frame stepping, and the marker on the timeline is the moment the button was pressed. Keys: space to play, arrows to step.
المواصفاتSpec
- الشريط والتحكم دائمًا من اليسار لليمين، حتى بالعربي (اتجاه الزمن)Timeline and controls are always left-to-right, even in Arabic (time runs LTR)
- علامة «GOAL» عند الثانية 25 — لحظة الضغط على الزر"GOAL" marker at 0:25 — when the button was pressed
- 0.5x تتحوّل لليموني عند التفعيل0.5x turns lime when active
- التحكم يختفي أثناء التشغيل ويظهر عند التمريرControls fade while playing, return on hover
- تحميل ومشاركة دائمًا ظاهرين — هما الهدفDownload and share are always one tap away — they're the point
الحالات الفارغةEmpty states
كل شاشة فارغة تشرح السبب وتعطي خطوة واحدة واضحة.
Every empty screen says why, and offers one clear next step.
لا توجد مقاطع بعدNo clips yet
اضغط الزر بجانب المرمى بعد أي لقطة، وستظهر هنا خلال ثوانٍ.Hit the button by the goal after any moment and it shows up here in seconds.
لا نتائج لـ «ملعب 7»No results for "Pitch 7"
جرّب اسم ملعب آخر أو وسّع نطاق التاريخ.Try another pitch name or widen the date range.
الكاميرات غير متصلةCameras offline
لم يصل بث من ملعب 2 منذ 21:40. تحقّق من الكهرباء والكابل عند العمود.No feed from Pitch 2 since 21:40. Check power and the cable at the pole.
اختيار التاريخDate picker
لتصفية المقاطع والتقارير. يبدأ الأسبوع يوم الأحد. اضغط يومين لاختيار فترة.
For filtering clips and reports. Weeks start on Sunday. Click two days to pick a range.
القواعدRules
- أرقام إنجليزية دائمًا: 5 أكتوبر 2026Western digits always: 5 Oct 2026
- صيغة التاريخ: يوم شهر سنة — 5 Oct 2026Format: day month year — 5 Oct 2026
- الوقت بنظام 24 ساعة: 21:4724-hour time: 21:47
- نقطة صغيرة تحت تاريخ اليومA small dot marks today
- اختصارات جاهزة: اليوم، 7 أيام، 30 يومًاPresets: Today, 7 days, 30 days
رسائل واتسابWhatsApp messages
قوالب الرسائل التي تُرسل للاعب ولمشغّل الملعب. المتغيّرات بصيغة {{1}} المطلوبة لاعتماد القوالب في WhatsApp Business. قصيرة، ورابط واحد فقط.
Message templates sent to players and venue operators. Variables use the {{1}} format WhatsApp Business needs for template approval. Short, one link only.
لوحة تحكم الملعبVenue dashboard
الشاشة التي يراها مشغّل الملعب: البث المباشر، وآخر الإعادات، وحالة الأجهزة.
What the venue operator sees: the live feed, the latest replays, and device health.
شاشة الجوالMobile screen
ما يراه اللاعب بعد الضغط على الزر — صفحة ويب بدون تطبيق. بدّل الوضع واللغة لترى الشاشة تتغيّر.
What the player sees after pressing the button — a web page, no app. Switch theme and language to watch it adapt.
مقاطعكYour clips
ملعب الصقور · الليلةFalcons Arena · tonight
التطبيقاتApplications
سهولة الوصولAccessibility
نسب التباين وفق WCAG. الحد الأدنى 4.5 للنص العادي و3 للنص الكبير.
WCAG contrast ratios. Minimum 4.5 for body text and 3 for large text.
- كل عنصر تفاعلي له حالة تركيز واضحة (حلقة بلون
--focus) ويمكن الوصول إليه بلوحة المفاتيح. - Every interactive element has a visible focus ring (
--focus) and works from the keyboard. - الأهداف القابلة للمس 44 بكسل على الأقل في التطبيق.
- Touch targets are at least 44 px in the app.
- لا تعتمد على اللون وحده: كل حالة لها نص أو أيقونة بجانب اللون.
- Never colour alone: every status carries a label or icon too.
- الواجهة تنعكس كاملة بالعربي (RTL)، والأرقام والأوقات تبقى من اليسار لليمين.
- The whole UI mirrors in Arabic (RTL); numbers and times stay left-to-right.
- الأرقام إنجليزية دائمًا (0–9) حتى داخل النص العربي.
- Digits are always Western (0–9), even inside Arabic text.
- كل الحركات تتوقف مع إعداد «تقليل الحركة».
- All motion stops under "reduce motion".
الملفاتFiles
tokens.cssكل الرموز: الألوان، الخطوط، المسافات، الحركة، الوضعانEvery token: colour, type, space, motion, both themeslogo/كل الشعارات SVG للداكن والفاتح · وملفات PNG في logo/pngEvery logo as SVG for dark and light · PNGs in logo/pngfonts/Montserrat · Alexandria (OFL)source/سكربتات تتبّع الرمز وتوليد الشعاراتScripts that trace the mark and build the logossocial/قوالب السوشال + export.sh لتصديرها PNGSocial templates + export.sh to render PNGsphotography/مرجع المزاج — أضف صور الملاعب الحقيقية هناMood reference — add real venue photos herereference/لوحة الهوية الأصليةThe original brand board
قوالب السوشالSocial templates
ثلاثة قوالب جاهزة بالعربي والإنجليزي: «هدف الأسبوع»، ستوري «كيف يعمل»، ومنشور الإطلاق. الملف
social/templates.html— غيّر النص بالضغط عليه أو عبر الرابط، ثم صدّرها بـsocial/export.sh.Three ready templates in Arabic and English: "Goal of the week", a "How it works" story and a launch post. Open
social/templates.html— edit text by clicking it or through URL params, then export withsocial/export.sh.?t=goal&player=…&venue=…&img=frame.jpg?t=launch&venue=…&date=…?t=story&venue=…جدول النشر المقترحSuggested rhythm
هدف الأسبوع كل خميس · ستوري «كيف يعمل» مثبّت في الهايلايت · منشور إطلاق لكل ملعب جديد · أعد نشر مقاطع اللاعبين (بإذنهم) يوميًا في الستوري.Goal of the week every Thursday · "How it works" pinned as a highlight · a launch post for every new venue · repost players' clips (with consent) to stories daily.