معسكر أنظمة التصميم (Design Systems & Design Tokens)

في هذا المعسكر ستتلقى أكثر من 30 ساعة من المحتوى التعليمي التفاعلي المباشر عالي الجودة عبر الانترنت، وستتعلم وتطبق بناء أنظمة التصميم بمنهجية التصميم الذرّي (Atomic Design)، وإدارة الرموز التصميمية (Design Tokens) وتوثيق النظام وربطه بالكود.

المدة

4 أسابيع

السعر

4995ر.س

حول هذا المعسكر

ستنتقل من بناء مكونات متفرقة إلى تصميم نظام متكامل يضمن الاتساق عبر كل شاشة، ومن قرارات تصميمية يصعب تفسيرها إلى Design Tokens موثقة تتحدث نفس لغة المطورين. هذا المعسكر لا يعلّمك كيف تستخدم فيجما فحسب، بل يعلّمك كيف تفكر في التصميم كنظام حي قابل للتوسع والصيانة، ويخرجك بنظام تصميم حقيقي جاهز للتسليم.

ماذا ستتعلم في هذه المنحة؟

  • فهم الفرق بين Design System وStyle Guide وUI Kit واختيار ما يناسب مشروعك.
  • بناء مكونات منهجية باستخدام Atomic Design من أبسط العناصر إلى أكثرها تعقيداً.
  • إنشاء مكونات ديناميكية باستخدام Auto Layout والـ Variants والـ States.
  • بناء Design Tokens موثقة وربطها بمكوناتك داخل فيجما.
  • إنشاء الـ Dark Mode والـ Light Mode بشكل منهجي.
  • توثيق نظام التصميم وتسليمه للمطورين باحترافية.
  • تصدير متغيرات فيجما إلى JSON وتحويلها إلى CSS جاهز للتطوير.

لمن هذه المعسكر؟

  • مصمم واجهات لديه خبرة وتريد الارتقاء بعملك من تصميم شاشات إلى بناء أنظمة.
  • مصمم يعمل ضمن فريق ويعاني من عدم الاتساق بين المكونات والشاشات.
  • مصمم يريد التحدث بنفس لغة المطورين وتسليم عمله باحترافية.
  • مدير تصميم أو قائد فريق يريد بناء نظام تصميم موحد لمنتجه.
  • لأي شخص يرى في نفسه القدرة على الالتزام والمثابرة لتعلم مهارات جديدة.

الأدوات التي ستحتاجها خلال المعسكر:

  • توفر جهاز كمبيوتر أو حاسوب محمول مع اتصال مستقر بالإنترنت.
  • حساب مجاني على Figma (وسنرشدك خطوة بخطوة لإعداده عند الحاجة).
  • تثبيت تطبيق Zoom وإنشاء حساب عليه لحضور الجلسات المباشرة والتفاعلية

رحلتك التعليمية - خطوة بخطوة نحو الاتقان

التعلم الفعّال يحتاج إلى خطة واضحة ومدروسة. لذلك صممنا رحلة تعليمية متدرجة تبدأ معك من الأساسيات وتنتقل بك نحو الإتقان والاحتراف. كل مرحلة مصممة بعناية لبناء مهاراتك بثقة ومنحك فهماً عملياً قابلاً للتطبيق في مشاريع واقعية من اليوم الأول.

ما هو نظام التصميم؟ولماذا هو مهم؟

UI Kit و Style Guide و Design System والفرق بينهم

عناصر النظام الأساسية.

كيف تبدأ ببناء نظام تصميم؟

منهجية التصميم الذري (Atomic Design) ومستوياتها.

كيفية التخطيط وتحليل مستويات المكونات.

فهم حالات المكونات (States & Variants)

نشاط عملي تفاعلي: استخدام Figma Auto Layout و Properties لإنشاء مكونات ديناميكية.

نشاط عملي تفاعلي: إنشاء زر Button باستخدام Variables و Auto Layout.

نشاط عملي تفاعلي: بناء مكونات معقدة (Molecules & Organisms).

ما هي الرموز التصميمية (Design Tokens) ولماذا هي مهمة؟

الفرق بين الرموز التصميمية (Design Tokens) ومتغيرات فيجما (Figma Variables).

أنواع الرموز التصميمية الـ (Design Tokens) واستراتيجيات التسمية.

استراتيجيات تخطيط وبناء الرموز التصميمية (Design Tokens).

تنظيم وربط المكونات بالـ Design Tokens داخل Figma

إنشاء (Dark Mode & Light Mode)

لماذا التوثيق مهم؟ وكيفية إنشائه بطرق عملية.

أفضل الأدوات لمرحلة التسليم للمطورين (Handoff).

صيانة نظام التصميم (Design System): مجالاتها وأهميتها

الحوكمة (Governance): النماذج وأفضل الممارسات لإدارة التغييرات.

تصدير متغيرات فيجما إلى JSON ومعاينة الكود

أدوات التصدير والتحويل (Style Dictionary )

تحويل JSON إلى CSS وربطه بالمشروع

إعداد مكتبة المتغيرات (Variables) في فيجما للتصدير

الـ Workflow الكامل: من فيجما إلى التطوير

خبراؤكم في هذه الرحلة التعليمية
محمد العارف
مدير تجربة المستخدم وخبير أنظمة التصميم
لديّ خبرة تزيد على 20 عاماً في تصميم تجارب رقمية عملية ومؤثرة، تمتد عبر: استراتيجية التصميم، أبحاث المستخدم، هيكلة المعلومات، استراتيجية المحتوى، تصميم واجهات الاستخدام، واختبار القابلية للاستخدام. أعمل مع العملاء وفرق التصميم على بناء رؤية واضحة توازن بين احتياجات المستخدم، أهداف العمل، والمتطلبات التقنية.
اترك مراجعتك
اسماء دسوقي محمد عبدالحليم
اسماء دسوقي محمد عبدالحليم
البلد : مصر

15 يونيو, 2026

"المعسكر كان مفيد ورائع جدا ومليئ بالخبرات العمليه والعلميه من مهندس شريف ومحمد العارف حقيقي بشكر كراديس علي اختيارها الدائم للمعلمين المتميزين ومحتواهم العلمي المتميز دائما. اعطوني خبره في ازاي
لقمان علي الجراحي
لقمان علي الجراحي
البلد : اندونيسيا

26 يناير, 2025

الحمدلله أنا استفدت جدا من المعسكر بدأ من مفهوم ال UI/UX المفهوم نفسه كنت فهمه غلط أو فهم محدود جدا جدا وبعد كده شرح يعني إيه UX كمفهوم وكونسبت دا
رحمه احمد فتحى
رحمه احمد فتحى
البلد : مصر

27 ديسمبر, 2025

كنت متابعه كراديس قبل مقدم وشايفه الانجازات الل الناس بتعملها مشاء الله واخدت كورسات وكل حاجه بس كان ديما حاسه ان ناقصنى حاجه ان لسه موصلتش لليفل اللى ياهلنى لاى
هل أحتاج خبرة مسبقة ؟
لا، هذا معسكر تأسيسي مصمم خصيصاً للمبتدئين! نبدأ من الأساسيات ونتدرج معك خطوة بخطوة.
كم هي مدة المعسكر وما هو الجدول الزمني؟
المعسكر يستمر لمدة 4 أسابيع بواقع أكثر من 32 ساعة من المحتوى التعليمي المباشر وورش العمل التفاعلية. الجلسات تُعقد عن بُعد مما يتيح لك المشاركة من أي مكان في العالم، مع تسجيلات متاحة للمراجعة.
هل سأحصل على وظيفة بعد إتمام المعسكر؟
نقدم تجربة عملية متكاملة بإشراف خبراء بأكثر من 20 عام خبرة. ستعمل على مشاريع حقيقية وتكتسب خبرة عملية يمكن إضافتها لسيرتك الذاتية. التركيز على الأساسيات والقوانين المهمة مع التطبيق العملي المكثف.
ما الذي يميز هذا المعسكر عن الدورات الأخرى؟
في هذا المعسكر ستتلقى أكثر من 30 ساعة من المحتوى التعليمي التفاعلي المباشر عالي الجودة عبر الانترنت، وستتعلم وتطبق بناء أنظمة التصميم بمنهجية التصميم الذرّي (Atomic Design)، وإدارة الرموز التصميمية (Design Tokens) وتوثيق النظام وربطه بالكود.
هل يمكنني الحصول على شهادة معتمدة؟
نعم، ستحصل على شهادة معتمدة من كراديس بعد إتمام جميع متطلبات المعسكر، بالإضافة إلى مشاريع عملية تضيفها لبورتفوليوك المهني.
كم الوقت المطلوب للدراسة أسبوعياً؟
كونه معسكر تأسيسي، ستحتاج حوالي 12-15 ساعة أسبوعياً تشمل الجلسات المباشرة، الواجبات العملية، والمشاريع التطبيقية. هذا الاستثمار في الوقت ضروري لبناء أساس قوي في تصميم واجهات المستخدم.
ما هي تكلفة المعسكر وما هي خيارات الدفع المتاحة؟
تكلفة معسكر أنظمة التصميم (Design Systems & Design Tokens) الحالية 4995 ريال سعودي ونوفر خيارات دفع مرنة تشمل الدفع الكامل مقدماً أو التقسيط على دفعات. للمزيد من التفاصيل تواصل مع فريق المبيعات مباشرة.
cradis-shape-39-1-zigzag-yellow.webp
cradis-hero
8b4efe12987b241773fc94af3bd34942

عدد المقاعد اكتمل في هذه الدفعة

إذا كنت مهتم بحضور معسكر تصميم تجربة المستخدم التفاعلي، يمكنك التسجيل في قائمة الانتظار لحجز مقعدك في الدفعة القادمة

التسجيل في قائمة الانتظار