منحة معسكر تصميم Design Tokens باستخدام Figma Variables

Learn how to use Design Tokens to design consistent, scalable products, using Figma's latest capabilities.

duration

4 weeks

hours

70 hours

cradis-design-tokens-design-scholarship-using-figma-variables
About this scholarship

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

بعد المعسكر ستتمكن من:

  • كيفية بناء وتصميم وإدارة أنظمة تصميم مرنة قابلة للتطوير والتوسع، مع التركيز على أقوى محتوى في الشرق الأوسط حول Design Tokens & Variables لإنشاء أنظمة تصميم احترافية. 
  • التطبيق العملي الجاد المكثف في تصميم واجهة المستخدم وبناء نظام التصميم والمكونات والتعامل مع مبادئ التصميم وربطها ببعضها البعض. 
  • تطبيق ما تعلمته نظرياً في بيئة عمل تحاكي الواقع، والتطبيق على مشاريع حقيقية. 
  • استخدام أحدث الأدوات والتقنيات لبناء Design Systems فعّالة، مع التركيز على Variables والمكونات القابلة لإعادة الاستخدام والتطوير المستمر. 
  • مهارات متخصصة مطلوبة بشدة في سوق العمل للأدوار المتقدمة مثل Design Systems Lead وSenior UI Designer، مع بناء خبرة عملية حقيقية في مجال أنظمة التصميم المتطورة. 
  • Build a professional portfolio, prepare a case study, write a distinctive CV, job search strategies and prepare for interviews.

لا توجد بيانات للجمهور المستهدف

Your educational journey - step by step towards mastery

Effective learning requires a clear and thoughtful plan. So we designed a gradual educational journey that starts with you from the basics and moves you towards mastery and professionalism. Each stage is carefully designed to build your skills with confidence and give you a practical understanding applicable to real-life projects from day one.

مقدمة عن رموز التصميم والمتغيرات (Design Tokens & Variables)

ما هو نظام التصميم (Design System)

المتغيرات مقابل رموز التصميم (Variables Vs Design Tokens)

لماذا يجب علينا استخدام رموز التصميم في أدوات التصميم (Design Tokens in Design Tools)

أفضل الأدوات لرموز التصميم (Design Tokens)

عملية رموز التصميم (Design Tokens Process)

تحديات ومزايا رموز التصميم (Design Tokens Challenges and Benefits)

أساسيات رموز التصميم (Design Tokens Essentials)

أفضل طريقة لتسمية لرموز التصميم (Tokens naming)

نشاط عملي: قصة رمز التصميم المكون للزر ( Component Token Story for a Button)

مثال متقدم لرموز المكونات (Component Tokens)

تصميم صفحة تسجيل الدخول

إنشاء مكون الزر (Button Component)

نشر نظام التصميم الخاص بك (Publish your Design System)

تصميم صفحة تسجيل الدخول ومكون الزر (Login page and Button Component)

واجهة متغيرات فيجما (Figma Variables Interface)

إنشاء رمز الخيار (Option Token)

تخطيط وإنشاء رمز الخيار (Option Tokens)

تخطيط رموز الأسماء المستعارة (Alias Tokens)

إنشاء رموز الأسماء المستعارة (Alias Tokens)

تحديد نطاق المتغيرات (Setting Variables Scope)

فهم مكون الزر (Button Component)

تخطيط رموز التصميم لمكون الزر المحدد (Button Component-Specific Tokens)

تخطيط وإنشاء رموز التصميم لمكون الزر المحدد (Button Component-Specific Tokens)

تخطيط وإنشاء وتطبيق رموز التصميم لمكون الزر المحدد (Component Specific Tokens for Button component)

واجهة وضع المطور (Dev Mode Interface)

تحديث فيجما: ترقيات المتغيرات في وضع المطور (Dev Mode)

مقدمة حول ملف المشروع (Project File)

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

معاينة كود JSON

تحويل كود JSON إلى CSS

ربط ملف متغيرات CSS بالمشروع

توثيق رموز الزر (Button Tokens Documentation)

تطبيق رموز الزر في CSS (Apply Buttons Tokens in CSS)

تنفيذ رموز الزر في الكود ( Button Tokens into the Code)

إنشاء الوضع الداكن (Dark Mode)

تصدير رموز الوضع الداكن إلى كود JSON

تحويل كود JSON في الوضع الداكن إلى CSS

تنفيذ الوضع الداكن في الكود (Dark Mode in Code)

إنشاء رموز علامة تجارية جديدة (New Brand Tokens)

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

تحويل كود JSON لعلامة تجارية جديدة إلى CSS

تنفيذ رموز التصميم لعلامة تجارية جديدة في الكود (New Brand in Code)

مزايا المصدر الموّحد للبيانات (SSOT)

إنشاء علامة تجارية جديدة (New Brand)

مراجعة المهام والتطبيقات العملية للطلبة المشاركة

إجابة الاسئلة والاستفسارات

مشروع التخرج

دراسة الحالة

مناقشة مشروع التخرج مع الخبراء

Your experts on this educational journey
محمد العارف
I have over 20 years of experience designing hands-on and fun digital experiences, and have a unique set of skills that include: design strategy, user research, information structuring, content strategy, user interface design, and usability testing. Lead customers and teams from ambiguity to clarity by establishing a clear vision that combines user needs, business goals, and technical requirements.
Leave your review
لقمان علي الجراحي
Loqman Ali Al-Jarrahi
Country: Indonesia

26 January, 2025

Thank God, I benefited a lot from the camp. It started with the concept of UI/UX, the concept itself. I had a wrong understanding or a very, very limited understanding. Then he explained what UX means as a concept and I explained it
هدير علي
Hadeer Ali
Country: Egypt

17 July, 2024

بصراحة قبل اي حاجة ف مجهود جامد من كل الناس القائمة ع الكورس وشكرا جدااا ل م/ محمد العارف ع تعبه معانا جدااا. شرح الـ ux فرق معايا جداااا واتعلمت حاجات
عمر رامز مشتهى
Omar Ramez Mushtaha
Country: Saudi Arabia

26 January, 2025

One of the most beautiful experiences I went through every meeting was learning something new, and my passion for learning and benefiting increased continuously. We fell into some pre-prepared traps when performing tasks

15%

15% partially supported seats

Candidates in this segment receive financial support ranging from 75% to 95% depending on the candidate's status.

40%

40% seats with refund fees

Candidates in this category receive 100% financial support, but they must pay a fee to ensure seriousness, which will be refunded at the end of the scholarship if they comply with the conditions.

45%

45% free seats

Candidates in this segment receive 100% financial support and their scholarship is completely free.
cradis-shape-39-1-zigzag-yellow.webp

apply for the scholarship