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


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

أضغط هنا وأنضم الي الفريق الان

العدد مفتوح

 

 تصميم تأثير إعلان نيون ضوئي متحرك

اذهب الى الأسفل 
كاتب الموضوعرسالة
EL-LORD
اشـراف عام الإبداع

EL-LORD

البلد : مصر
الجنس : ذكر
المساهمات : 4158
نقاط النشاط : 4317

تصميم تأثير إعلان نيون ضوئي متحرك Empty
مُساهمةموضوع: تصميم تأثير إعلان نيون ضوئي متحرك   تصميم تأثير إعلان نيون ضوئي متحرك Emptyالخميس 5 أغسطس 2021 - 16:38

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

تصميم تأثير إعلان نيون ضوئي متحرك Pizza-10

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

افتح برنامج الاليستريتور وابدأ ملفًّا جديدًا. ارسم دائرة على لوح الرسم باستخدام أداة القطع الناقص Ellipse tool، ثم ألغِ لون التعبئة واترك فقط الحدود السوداء ظاهرة. غيّر إعدادات الحدود إلى 5pt مع نهايات مستديرة وزوايا مستديرة أيضًا.

تصميم تأثير إعلان نيون ضوئي متحرك 1_thum10

استخدم أداة النص Type tool لإضافة أي نص إلى لافتة النيون. أنا استخدمت خطًّا اسمه Darwin لكتابة Pizza Planet.

تصميم تأثير إعلان نيون ضوئي متحرك 2_thum10

اضبط حجم النص ليتوسط الدائرة ويتقاطع مع حدودها الخارجية ثم أمِلهُ بزاوية -10 درجة عموديًّا من القائمة:

Object > Transform > Shear option

تصميم تأثير إعلان نيون ضوئي متحرك 3_thum10

ألغِ لون التعبئة للنص وأضف حدودًا سوداء مستخدمًا ذات الحجم 5pt مع النهايات المستديرة والزوايا المستديرة أيضًا. بالزر الأيمن اختر Convert to Outlines.

تصميم تأثير إعلان نيون ضوئي متحرك 4_thum10

ارسم دائرة صغيرة وقصّ المسار باستخدام أداة المقص Scissors tool في الجزء العلوي الأيسر. استخدم أداة التحديد المباشر Direct Selection tool لحذف المسار من النقطة السفلية إلى هذا القطع الجديد.

تصميم تأثير إعلان نيون ضوئي متحرك 5_thum10

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

تصميم تأثير إعلان نيون ضوئي متحرك 6_thum10

حدّد الدائرة الرئيسية للكوكب وانسخها 

الكود:
CMD+C

 ثم ألصقها في المقدمة 

الكود:
CMD+F

. استمر بالضغط على 

الكود:
ALT

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

تصميم تأثير إعلان نيون ضوئي متحرك 7_thum10

ارسم شكلًا بيضويًّا في مكان ما على لوح الرسم ثم اسحب النقطة العلوية للأعلى باستخدام أداة التحديد المباشر Direct Selection tool لتمديد الشكل.

تصميم تأثير إعلان نيون ضوئي متحرك 8_thum10

استخدم أداة Convert Anchor Point tool الموجودة ضمن أدوات القلم لإزالة مقابض البيزير وترك النقطة حادة.

تصميم تأثير إعلان نيون ضوئي متحرك 9_thum10

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

تصميم تأثير إعلان نيون ضوئي متحرك 10_thu10

اصنع نسختين من الصاروخ وعدّل حجمها ودوّر كل صاروخ وضعهُ في موقعه في مدارٍ حول الكوكب مع جعلها أكبر في كل مرّة.

تصميم تأثير إعلان نيون ضوئي متحرك 11_thu10

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

Object > Path > Offset Path

ثم أدخل القيمة 3mm.

تصميم تأثير إعلان نيون ضوئي متحرك 12_thu10

انقر بالزر الأيمن على المسار الإضافي الجديد واختر Make Guides. تأكد من ظهور الأدلة عبر الضغط على 

الكود:
CMD+;

 ومقفلة عبر الضغط على 

الكود:
CMD+Alt+;

تصميم تأثير إعلان نيون ضوئي متحرك 13_thu10

استخدم أداة المقص Scissors tool لقص مسارات حلقات الكوكب في موقع تقاطعها مع الأدلة الجديدة. استخدم الأدلة الذكية Smart Guides عبر الضغط على 

الكود:
CMD+U

 لتُسهّل عملية مطابقة هذه المنطقة.

تصميم تأثير إعلان نيون ضوئي متحرك 15_thu10

على الجانب الآخر فإن حرف P يتقاطع مع حدود الكوكب أيضًا لذلك ألغِ تجميع النص Ungroup من أجل تحديد هذا الحرف فرديًّا ثم أضف مسار إضافي بقيمة 3mm.

تصميم تأثير إعلان نيون ضوئي متحرك 16_thu10

الحرف P بشكل خاص بحاجة لخطوة إضافية من أجل إنشاء الأدلّة. انقر بالزر الأيمن ثم اختر Release Compound Path ثم احذف الجزء الداخلي قبل تحويل الخطوط الرئيسية إلى أدلّة.

تصميم تأثير إعلان نيون ضوئي متحرك 17_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 18_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 19_thu10

ألغِ تجميع Ungroup عناصر النص الأخرى وأضف مسار إضافي للحرف الأول والأخير ثم أنشئ أدلّة من النتائج. تذكّر أن تحرر المسار المركب لحرف P ليصبح قابلًا للتحول إلى دليل.

تصميم تأثير إعلان نيون ضوئي متحرك 20_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 21_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 22_thu10

استخدم أداة المقص Scissors tool لقص وحذف مناطق تواجد الحروف تحت الحلقة عبر خطوط الأدلة.

تصميم تأثير إعلان نيون ضوئي متحرك 24_thu10

من الضروري في بعض الأحيان تحرير المسارات المركبة للحروف من أجل تحديد وحذف الأجزاء غير المرغوبة من المسار.

تصميم تأثير إعلان نيون ضوئي متحرك 25_thu10

بعد إزالة جميع المسارات المتداخلة سيكون التصميم قد أخذ شكلًا أكثر واقعية كلافتة نيون.

تصميم تأثير إعلان نيون ضوئي متحرك 27_thu10

حدّد المسارات التي تُشكّل جزءًا محددًا وامنحها ألوانًا برّاقة للحدود كالأزرق، الأحمر، الأصفر والأبيض.

تصميم تأثير إعلان نيون ضوئي متحرك 28_thu10

افصل الألوان المختلفة داخل طبقاتها الخاصة عبر استخدام القائمة:

Select > Same > Stroke Color

ثم انسخ التحديد وألصقه في المقدمة. وضع الأجزاء التي ستكون متحركة في طبقات خاصة بها كالعناصر التي تُكَوِّن الصواريخ الثلاثة.

تصميم تأثير إعلان نيون ضوئي متحرك 29_thu10

اذهب إلى القائمة:

File > Export

وضع نوعية الملف PSD Photoshop وتأكّد من تفعيل خيار Write Layers.

تصميم تأثير إعلان نيون ضوئي متحرك 31_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 32_thu10

حدّد كل طبقات عناصر لافتة النيون ثم اضغط 

الكود:
CMD+J

 لمضاعفتها ثم اضغط 

الكود:
CMD+E

 لدمجها في طبقة واحدة. أعِد تسمية هذه الطبقة 'Off'.

تصميم تأثير إعلان نيون ضوئي متحرك 33_thu10

أضف سلسلة من أنماط الطبقة لجعل هذه الطبقة تبدو كالأنابيب بدون إضاءة، أي (تراكب لوني) Color Overlay، (توهج داخلي) Inner Glow و (الظلال) Drop Shadow.

تصميم تأثير إعلان نيون ضوئي متحرك 36_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 37_thu10

شَغِّل طبقة النيون الأولى عبر سلسلة من أنماط الطبقة. أضِف التوهُّج الداخلي لإضافة الأبيض البرّاق إلى المركز، والتوهُّج الخارجي لإطلاق الهالة الملونة، تليها المزيد من الظلال لتراكب التوهُّجات بأحجام مختلفة.

تصميم تأثير إعلان نيون ضوئي متحرك 42_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 43_thu10

انسخ وألصق نمط الطبقة إلى الطبقة التالية ثم عدّل إعدادات التوهُّج حتى تناسب لون العنصر.

تصميم تأثير إعلان نيون ضوئي متحرك 44_thu10

وفّر الوقت عبر نسخ نمط الطبقة إلى باقي الطبقات التي تحمل ذات اللون.

تصميم تأثير إعلان نيون ضوئي متحرك 45_thu10

لافتة النيون ستبدو رائعة عند الانتهاء من وضع كافة أنماط الطبقات ولكننا سنضيف بعض الحركة على التصميم.

تصميم تأثير إعلان نيون ضوئي متحرك 46_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 47_thu10

أظهر لوحة Timeline من قائمة Window ثم أنشئ إطار جديد New Frame Animation.

تصميم تأثير إعلان نيون ضوئي متحرك 48_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 49_thu10

أضف إطار جديد تظهر فيه أول طبقة نيون. لا تضف أي زمن لظهور هذا الإطار وبذلك سيظهر هذا الضوء على الفور.

تصميم تأثير إعلان نيون ضوئي متحرك 50_thu10

أضف إطارين بعدها بدون مدة زمنية لإضافة الأضواء الحمراء والزرقاء بحيث ستضيئ اللافتة تباعًا بسرعة.

تصميم تأثير إعلان نيون ضوئي متحرك 51_thu10

في الإطار التالي أظهر طبقة الصاروخ الأول مع جعل المدة الزمنية لعرض هذا الإطار ثانية واحدة.

تصميم تأثير إعلان نيون ضوئي متحرك 52_thu10

في الإطار التالي أخفِ الصاروخ الأول وأظهر الثاني لإعطاء الانطباع عن حركة الصاروخ.

تصميم تأثير إعلان نيون ضوئي متحرك 53_thu10

أضف إطار جديد للصاروخ الثالث من أجل إظهاره وإخفاء الصاروخ الثاني.

تصميم تأثير إعلان نيون ضوئي متحرك 54_thu10

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

تصميم تأثير إعلان نيون ضوئي متحرك 55_thu10

قم بتصدير العمل كملف GIF من خلال Save for Web أو أرسله إلى برنامج تعديل فيديو لتصنع حركة مستمرة أفضل.

تصميم تأثير إعلان نيون ضوئي متحرك Pizza-11

منقول


توقيع : EL-LORD


تصميم تأثير إعلان نيون ضوئي متحرك Aiyo--12
<<<< لشكوى الأعضاء ضد فريق المنتدى >>>>
<<<< القانون العام لمنتدى الدعاية و الإشهار >>>>
<<<< القانون العام لعلبة الدردشة >>>>

تصميم تأثير إعلان نيون ضوئي متحرك Aoia10

::yaho:: دورة التسويق الالكتروني الشاملة من البداية وحتي الاحتراف ::yaho::


عدل سابقا من قبل AsHeK EgYpT في الأربعاء 28 سبتمبر 2022 - 11:58 عدل 1 مرات (السبب : إعادة رفع الصور)
الرجوع الى أعلى الصفحة اذهب الى الأسفل
AmEr Dz
 
 
AmEr Dz

البلد : الجزائر
الجنس : ذكر
المساهمات : 7719
نقاط النشاط : 5785

تصميم تأثير إعلان نيون ضوئي متحرك Empty
مُساهمةموضوع: رد: تصميم تأثير إعلان نيون ضوئي متحرك   تصميم تأثير إعلان نيون ضوئي متحرك Emptyالجمعة 27 أغسطس 2021 - 18:49

شــكرا لك 


توقيع : AmEr Dz


ڷسټ-أٵڦڞڷ-مڽ ڠيرێ-ۈڸڰڹ?ٲمڷڰ ڦنآعۀ-عڊم مڨآرڻۀ-ڹڣس?-پأحڍ ,,, أَلّتٌظًأَهِرٌ بُأُلَسًعّأُدًة أٌسَهٌلٌ بِڳَثِيٌرُ مُنٌ شِرّحٌ سّبُبِ حًزُنُڳً لَلٌأٌخُرِيُنّ
الرجوع الى أعلى الصفحة اذهب الى الأسفل
Mc nabulsy
مشرف تطوير المواقع والمنتديات

Mc nabulsy

البلد : فلسطين
الجنس : ذكر
المساهمات : 4140
نقاط النشاط : 5916

تصميم تأثير إعلان نيون ضوئي متحرك Empty
مُساهمةموضوع: رد: تصميم تأثير إعلان نيون ضوئي متحرك   تصميم تأثير إعلان نيون ضوئي متحرك Emptyالثلاثاء 27 سبتمبر 2022 - 14:59

الصور والاكواد غير موجودة عندي


توقيع : Mc nabulsy


تصميم تأثير إعلان نيون ضوئي متحرك Aiyo--12
<<<< لشكوى الأعضاء ضد فريق المنتدى >>>>
<<<< القانون العام لمنتدى الدعاية و الإشهار >>>>
<<<< القانون العام لعلبة الدردشة >>>>





لا اله الا الله
الرجوع الى أعلى الصفحة اذهب الى الأسفل
AsHeK EgYpT
نائب المدير

AsHeK EgYpT

البلد : مصر
الجنس : ذكر
المساهمات : 12171
نقاط النشاط : 3681
الأوسمة : تصميم تأثير إعلان نيون ضوئي متحرك 220
تصميم تأثير إعلان نيون ضوئي متحرك 1510

تصميم تأثير إعلان نيون ضوئي متحرك Empty
مُساهمةموضوع: رد: تصميم تأثير إعلان نيون ضوئي متحرك   تصميم تأثير إعلان نيون ضوئي متحرك Emptyالأربعاء 28 سبتمبر 2022 - 11:59

Mc nabulsy كتب:
الصور والاكواد غير موجودة عندي

تم إعادة رفع الصور من جديد بتاريخ 28.09.2022


توقيع : AsHeK EgYpT


تصميم تأثير إعلان نيون ضوئي متحرك Aiyo--12
<<<< لشكوى الأعضاء ضد فريق المنتدى >>>>
<<<< القانون العام لمنتدى الدعاية و الإشهار >>>>
<<<< القانون العام لعلبة الدردشة >>>>
تصميم تأثير إعلان نيون ضوئي متحرك Lmt4x710
وَإِذا أَتَتكَ مَذَمَّتي مِن ناقِصٍ .. فَهِيَ الشَهادَةُ لي بِأَنِّيَ كامِلُ
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
تصميم تأثير إعلان نيون ضوئي متحرك
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» PSD تصميم إعلان عن هاتف ذكي
» تصميم إعلان نصي مجاناً
» تصميم إعلان أو اقتباس للسوشيال ميديا PSD
» تصميم PSD إعلان عن موعد برنامج ديني
» تصميم سوشيال ميديا إعلان عن دورة تدريبية

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
دليل الإشهار العربي :: منتدى الإبداع :: الأقسام الإبداعية :: قسم تعليم التصميم-
انتقل الى:  
جميع الحقوق محفوظة لمنتدى دليل الإشهار العربي