الرسوم المتحركة للتحميل في فيجما: برنامج تعليمي للمبتدئين

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

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

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

لذلك دعونا نبدأ وتعلم كيفية إنشاء الرسوم المتحركة تحميل في فيجما!

1. أساسيات الرسوم المتحركة في فيجما
2. أنواع الرسوم المتحركة في فيجما
3. إنشاء رسوم متحركة تحميل بسيطة
4. إضافة تأثيرات إلى تحميل الرسوم المتحركة

أساسيات الرسوم المتحركة في فيجما

أساس الرسوم المتحركة في فيجما هو التحولات بين حالات الكائنات. في فيجما ، يمكنك إنشاء رسوم متحركة لخصائص مختلفة للكائنات مثل الموضع والحجم واللون والشفافية.

لإنشاء رسوم متحركة في فيجما ، يتم استخدام لوحة إعدادات الانتقال ، والتي تسمح لك بتعيين مدة الرسوم المتحركة ونوع الانتقال والمعلمات الأخرى. يمكنك أيضا تطبيق تأخير أو تكرار للرسوم المتحركة.

هناك طريقتان لبدء إنشاء الرسوم المتحركة في فيجما: إضافة انتقال بين إطارين أو استخدام الرسوم المتحركة المكونة. يتم إنشاء الانتقال بين الإطارات عن طريق تغيير حالة الكائن في كل إطار ، وتسمح لك الرسوم المتحركة للمكونات بإنشاء رسم متحرك متكرر للمكونات في التخطيط.

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

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

أنواع الرسوم المتحركة في فيجما

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

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

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

إنشاء رسوم متحركة تحميل بسيطة

للبدء ، افتح فيجما وإنشاء مستند جديد. ثم حدد أداة المستطيل وارسم مستطيلا سيكون بمثابة رسم متحرك للتحميل. استخدم لوحة الخصائص لتعيين حجم المستطيل المطلوب واللون.

الآن حدد أداة السحب والإفلات وحرك المستطيل قليلا إلى اليمين لإنشاء تأثير الحركة. ثم حدد أداة المستطيل مرة أخرى وارسم مستطيلا آخر سيكون بمثابة مؤشر تحميل.

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

الآن حدد أداة النقر المزدوج وانقر نقرا مزدوجا فوق مجموعة المستطيل. في لوحة الطبقات ، حدد مجموعة ، وانقر بزر الماوس الأيمن وحدد إطار مكرر.

بعد ذلك ، اسحب الإطار المكرر قليلا إلى اليمين لإنشاء الإطار التالي للرسوم المتحركة. كرر عملية تكرار الإطارات وتحريكها عدة مرات لإنشاء رسم متحرك للتحميل.

أخيرا ، حدد" الرسوم المتحركة التلقائية " في لوحة النماذج الأولية واضبط الرسوم المتحركة للتحميل عن طريق تحديد كل إطار بدوره.

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

إضافة تأثيرات إلى تحميل الرسوم المتحركة

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

1. باستخدام التحولات: يمكنك إضافة انتقالات سلسة بين الحالات المختلفة لتحميل الرسوم المتحركة. على سبيل المثال ، يمكنك تعيين الانتقال من لون إلى آخر عندما يتغير تقدم التنزيل. للقيام بذلك ، يمكنك استخدام أداة الانتقال في فيجما. ما عليك سوى تحديد العنصر الذي تريد تطبيق الانتقال إليه وضبط معلماته.
2. استخدام التحويلات: هناك طريقة أخرى لإضافة تأثيرات إلى الرسوم المتحركة للتحميل وهي استخدام التحويلات. على سبيل المثال ، يمكنك تغيير حجم أو موضع أو زاوية عنصر أثناء عملية التحميل. للقيام بذلك ، يمكنك استخدام أدوات "التكبير" و "التدوير" و "النقل" في فيجما. ما عليك سوى اختيار عنصر وإعداد التحولات لها.
3. استخدام الرسوم المتحركة الملكية: يمكنك أيضا إضافة الرسوم المتحركة من خصائص العنصر المختلفة. على سبيل المثال ، يمكنك تحريك تغيير في الشفافية أو التشبع أو تمدد عنصر ما. للقيام بذلك ، يمكنك استخدام أداة الرسوم المتحركة في فيجما. حدد عنصرا وضبط خصائصه الرسوم المتحركة.
4. استخدام تأثيرات التمويه والتنسيب: يمكن أن تؤدي إضافة تأثير التمويه والتنسيب (الظل المسقط) إلى إعطاء عمق وحجم الرسوم المتحركة للتحميل. على سبيل المثال ، يمكنك إضافة ضبابية إلى عنصر يحاكي الحركة عند التحميل. للقيام بذلك ، يمكنك استخدام أدوات "طمس" و "التنسيب" في فيجما. ما عليك سوى اختيار عنصر وضبط التأثيرات المناسبة.

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