Adobe XD: التخطيط والشبكات

Name: Adobe XD: التخطيط والشبكات
Author: Alyssa Galganov

تعرف على كيفية إنشاء تخطيطات ديناميكية في Adobe XD

شاهد الدرس الأول مجانًا — احصل على وصول كامل إلى جميع الدروس الـ5.

دورة تدريبية: عند الطلب

مرحبًا! اسمي أليسا، وفي هذه الدروس، سنواصل العمل مع التخطيط والشبكات في Adobe XD. سيساعد تحديد نظام الشبكة في تصميمك بالبقاء في محاذاة ويمكن أن يوفر وقتًا ثمينًا في قياس البكسل والتباعد بين العناصر. يوجد خياران في Adobe XD لتقديم التوجيه عند إعداد التصميم الخاص بك: تخطيط ومربع. دعنا نستكشف شبكة التخطيط Layout Grid. سأقوم فقط بإنشاء ملف جديد من خلال النقر هنا على شاشتي الرئيسية على زر الملف الجديد New File، وللشاشة الافتراضية تم تحديد 1920 بكسل عرضًا × 1080 بكسل ارتفاعًا. سأضغط هنا في المساحة الرمادية لإلغاء تحديدها لأنني أريد فقط أن أريك أنه إذا نقرت على الاسم، يمكننا تحديد لوحة الرسم. عندما نختار لوحة الرسم، يمكنك أن ترى هنا في Property Inspector، أن هناك لوحة شبكة في الأسفل. حاليًا، هو تخطيط لنوع الشبكة، وإذا نقرنا على شيفرون، يمكنك أن ترى أن هناك خيارًا بين التخطيط والمربع. سأتركه على التخطيط، وسأواصل وانقر هنا في هذا المربع الصغير، وما يتيح لنا ذلك هو التبديل بين تشغيل وإيقاف تشغيل شبكة التخطيط. حاليًا، هو اللون السماوي، وهي عبارة عن 12 عمودًا، ولكن يمكنك تغيير هذا كيفما تشاء. يمكننا المضي قدمًا هنا، وسأدخل هنا واكتب 16، وسأضغط على مفتاح Return لتنفيذه. الآن ترى 16 عمودًا. يمكنني المضي قدمًا وتغيير عرض Gutter أيضًا. سأغير ذلك إلى شيء مثل 24، ويمكنك أن ترى أن هناك فجوة أوسع قليلاً الآن بين تلك الأعمدة العمودية ذات اللون السماوي البالغ عددها 16. إذا لم يكن هذا هو لونك، فيمكنك دائمًا تغييره من خلال النقر على لوحة الداما هذه هنا، وهو لون عمود تصنيف التخطيط، ويمكنك اختيار أي لون تريده هنا. يمكنني المضي قدمًا وتحريك شريط التمرير هذا لأعلى ولأسفل وحتى أحصل على اللون الذي يعجبني. إذا كنت تعتقد أنك تريدهم أكثر قتامة، يمكنك المضي قدما وتغيير ألفا هنا في النسبة المئوية. حاليًا، القيمة الافتراضية هي 25٪. يمكنك المضي قدمًا وتغييرها إلى شيء مثل 10. اضغط على مفتاح Tab أو مفتاح Return لتنفيذه، ويمكنك أن ترى أنها أخف بكثير الآن. إذا كان هذا شيئًا أعجبني حقًا وأردت استخدامها في عدة مشاريع، يمكنني المضي قدمًا والنقر وجعله افتراضيًا. إذا قمت بإجراء كل هذه التغييرات وأقرر أن هذا ليس ما أحبه، يمكننا المضي قدمًا والنقر فوق الزر الافتراضي، ونعود إلى حيث بدأنا. شكرا لمشاهدتك. ترقب الفيديو التالي حيث سننتقل عبر الشبكة المربعة.

مبتدئ مقدِّم الخدمة : Alyssa Galganov 5 الدروس · 16m باللغات: العربية, الألمانية, الإنجليزية, الإسبانية, الفرنسية, البرتغالية, Chinese

وصف الدورة

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

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

ما ستتعلمه

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

النقاط الرئيسية

تُشكّل الشبكات إطارًا لتنظيم عناصر التصميم وضمان تماثل التخطيط.
يُسهم تحديد نظام الشبكة في الحفاظ على محاذاة التصميم وتوفير الوقت المُنفق في قياس البكسل والتباعد بين العناصر.
يوفر Adobe XD خيارَي شبكة يُرشدانك عند إعداد التصميم: التخطيط والمربعات.
يمكن استخدام الأدلة لمحاذاة الكائنات أو إدارة التباعد بين العناصر على اللوحة الفنية.

الأسئلة الشائعة

ما الذي سأتعلمه في هذا المقرر؟

ستتعلم كيفية إنشاء تخطيطات ديناميكية في Adobe XD باستخدام الشبكات والأدلة والمحاذاة والتوزيع والتكرار، بما في ذلك كيفية إنشاء شبكات التخطيط والمربعات وضبطها، وكيفية إنشاء الأدلة وإدارتها.

ما خيارَي الشبكة اللذان يتناولهما هذا المقرر في Adobe XD؟

يتناول المقرر خيارَي الشبكة في Adobe XD اللذين يُرشدانك عند إعداد تصميمك: التخطيط والمربعات.

ما الموضوعات التي تشملها الدروس؟

تشمل الدروس: شبكات التخطيط، وشبكات المربعات، وإنشاء الأدلة، ومحاذاة عناصر التصميم وتوزيعها، وزر شبكة التكرار.

لماذا تُعدّ الشبكات مفيدة عند التصميم في Adobe XD؟

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