الرسم على الشبكة الديناميكية في Unreal Engine 4

الرسم على الشبكة (Mesh painting) هو قدرة اللاعبين على الرسم على الأشياء داخل اللعبة، ومن الأمثلة على الرسم الشبكي هي المادة اللزجة في (Super Mario Sunshine) والمواد الهلامية في (Portal 2) والحبر في (Splatoon).

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

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

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

وفي هذا البرنامج التعليمي، ستتعلم كيفية الرسم على شبكة هيكلية (skeletal mesh)، وللقيام بذلك سوف تتعلم:

  1. فك الشبكة في شكلها فوق البنفسجي (UV form).
  2. استخدم موقع الإصابة من تتبع خط (line trace) لإخفاء الشبكة.
  3. تجسيد الشبكة غير المغلفة (unwrapped mesh) وقناع المجال (sphere mask) إلى هدف تجسيد (render target) باستخدام التقاط مشهد (scene capture).
  4. استخدم القناع للمزج بين الأنسجة في مادة الشكل (character material).

لاحظ أن هذا ليس برنامج تعليمي عن رسم القمم الرأسية (vertex painting)، حيث تعتمد اللوحة الرأسية على دقة الشبكة ولا يمكن تغييرها في اللعبة.

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

ملاحظة: يفترض هذا البرنامج التعليمي أنك تعرف بالفعل أساسيات استخدام (Unreal Engine)، وإذا كنت جديداً في (Unreal Engine)، فراجع سلسلة البرامج التعليمية (Unreal Engine for Beginners) المكونة من 10 أجزاء.

البداية

ابدأ بتنزيل المواد الخاصة بهذا البرنامج التعليمي، وقم بفك الضغط وانتقل إلى (MeshPainterStarter) وافتح (MeshPainter.uproject)، وإذا ضغطت على تشغيل (Play)، فسترى الشخصية التي سترسم عليها.

مشروع البداية

تماماً مثل دروس مسارات الثلج والعشب، تتطلب هذه الطريقة أيضاً التقاط مشهد (scene capture)، ولتوفير الوقت، تم إنشاء مخطط التقاط مشهد (scene capture Blueprint)، وإذا كنت ترغب في معرفة المزيد حول إعدادات الالتقاط (capture settings)، فراجع البرنامج التعليمي الخاص بإنشاء مسارات الثلج.

أولاً، دعونا نلقي نظرة على كيفية الرسم على شبكة.

الرسم على الشبكة (Mesh Painting)

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

ومع ذلك، فإن إنشاء قناع مباشرة على هدف التجسيد (باستخدام Draw Material to Render Target) سيؤدي عادةً إلى توقفات عبر أغلفة الأشعة فوق البنفسجية (UV shells).

وفيما يلي مثال على خريطة الأشعة فوق البنفسجية للمكعب ونسيج قناع الكرة:

الرسم على الشبكة

وهنا القناع المطبق على المكعب:

الرسم على الشبكة

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

ولكن كيف يمكنك الوصول إلى المواضع العالمية (world positions) عند استخدام عقدة (Draw Material to Render Target)؟

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

طريقة رايان (Ryan’s Method)

هناك أربع خطوات لهذه الطريقة، والخطوة الأولى هي “فك (unwrap)” الشبكة المعنية، وهذا يسمح بتحريك كل القمم بحيث تحصل على الشبكة في شكلها فوق البنفسجي، وعلى سبيل المثال، فيما يلي الزوار الشكل فوق البنفسجي للشخصيات:

طريقة رايان

وهذه هي الشخصية بعد فك التغليف في (Unreal):

طريقة رايان

يمكنك فك شبكة عن طريق تطبيق بعض حسابات إزاحة للموضع العالمي (World Position Offset math).

بعد فك التغليف، فإن الخطوة الثانية هي ترميز المواضع العالمية للشبكة إلى هدف تجسيد، ويمكنك القيام بذلك عن طريق تعيين لون المادة غير المغلفة إلى (Absolute World Position) ثم استخدام التقاط مشهد لالتقاط الصور غير المبسطة، هذا هو الشكل الذي سيبدو عليه هدف التجسيد:

طريقة رايان

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

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

وتتمثل الخطوة الأخيرة في استخدام القناع في مادة الشخصية للمزج بين الألوان أو القوام أو المواد، وفيما يلي الخطوات الثالثة والرابعة التي تم تصورها:

طريقة رايان

الآن، دعونا نلقي نظرة على الطريقة المقترحة.

الطريقة المقترحة

تتطلب طريقة رايان:

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

وتتجاهل الطريقة في هذا البرنامج التعليمي السحب الثاني وهدف عرض الموضع العالمي، ويقوم بذلك عن طريق الجمع بين الأقنعة غير المبسطة والكرة في مادة واحدة (المادة غير المغلفة)، وثم يتم التقاط عملية الفك (captures the unwrap) باستخدام الوضع المركب الإضافي لتجميع أقنعة المجال.

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

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

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

الآن بعد أن تعرفت على الطريقة، دعنا نبدأ بإنشاء مادة قابلة للفك (unwrap material).

إنشاء مادة فك التغليف (Unwrap Material)

انتقل إلى مجلد المواد (Materials folder) وقم بإنشاء مادة جديدة، وقم بتسميتها (M_Unwrap) ثم افتحه.

بعد ذلك، قم بضبط الإعدادات التالية:

  • نموذج التظليل (Shading Model): غير مضاء (Unlit)، وهذا للتأكد من أن التقاط المشهد لا يلتقط أي معلومات إضاءة.
  • ذو وجهين (Two Sided): ممكّن (Enabled)، وفي بعض الأحيان، يمكن أن تواجه الوجوه غير المغلفة الاتجاه الآخر اعتماداً على كيفية تعيين الشبكة للأشعة فوق البنفسجية، وسوف يتأكد (Two Sided) من أنه لا يزال بإمكانك رؤية أي وجوه مقلوبة.
  • الاستخدام \الاستخدام مع شبكة الهيكل العظمي (Usage\Used with Skeletal Mesh): ممكّن (Enabled)، وسيؤدي ذلك إلى تجميع التظليل اللازم للمادة للعمل على الشبكات الهيكلية.

مادة فك التغليف

التالي هو فك الشبكة (unwrap the mesh)، وللقيام بذلك، قم بإنشاء الإعداد أدناه، ولاحظ أنه تم إنشاء معاملات (CaptureSize) و(UnwrapLocation) داخل الأصل (MPC_Global).

مادة فك التغليف

سيؤدي هذا إلى فك الشبكة إلى الموقع المحدد بالحجم المحدد، ولاحظ أنه إذا كانت خريطة الأشعة فوق البنفسجية الفريدة لشبكتك على قناة منفصلة، فستحتاج إلى تغيير فهرس الإحداثيات (Coordinate Index) لعقدة (TextureCoordinate).

وعلى سبيل المثال، إذا كانت الأشعة فوق البنفسجية على القناة 1، فيمكنك تعيين تنسيق الفهرس (Coordinate Index) على 1.

الخطوة التالية هي إنشاء قناع المجال، ولهذا، ستحتاج إلى معاملين:

  1. موقع الإصابة.
  2. نصف قطر الكرة.

قم بإنشاء العقد المميزة (highlighted):

مادة فك التغليف

سيؤدي هذا إلى إرجاع اللون الأبيض لوحدات البكسل داخل قناع المجال والأسود للبكسل في الخارج.

ومن المهم أن تقوم ضبط عقدة الموضع العالمي المطلق (Absolute World Position) على الموضع العالمي المطلق (Absolute World Position (Excluding Material Shader Offsets)).

وهذا لأن موضع البكسل العالمي (pixel’s world position) سيتغير بسبب فك التغليف، وسوف يمنحك استبعاد إزاحة تظليل المواد (Excluding material shader offsets) الموقع العالمي (world position) الأصلي قبل فك التغليف.

والآن، انقر فوق تطبيق (Apply) ثم أغلق المادة، والتالي هو تطبيق المادة على الشخصية لفكها.

فك تغليف الشخصية (Unwrapping the Character)

في هذا البرنامج التعليمي، سوف يتعامل مخطط الالتقاط (capture Blueprint) مع الفك (unwrapping) والتقاطه (capturing).

أولاً، ستحتاج إلى مثيل ديناميكي للمادة القابلة للفك، انتقل إلى مجلد المخططات (Blueprints) وافتح (BP_Capture)، وبعد ذلك، أضف العقد المميزة (highlighted) إلى (Event BeginPlay)، وتأكد من تعيين (Parent) على (M_Unwrap).

فك تغليف الشخصية

بعد ذلك، تحتاج إلى تابع لأداء فك الالتقاط والتقاطه، قم بإنشاء تابع جديد باسم (PaintActor)، وبعد ذلك، قم بإنشاء المدخلات التالية:

  • الرسم على الممثل (ActorToPaint): النوع (Type) ممثل (Actor).
  • موقع الضربة (HitLocation): النوع (Type) شعاع (Vector)، وستكون هذه هي النقطة المركزية لقناع المجال.
  • نصف قطر الفرشاة (BrushRadius): النوع (Type) عائم (Float)، نصف قطر قناع المجال بوحدات العالم.

فك تغليف الشخصية

على الرغم من أن طريقة الرسم هذه يمكن أن تعمل مع أي ممثل، إلا أننا سنتحقق فقط مما إذا كان الممثل القادم يرث من فئة الشخصية (Character class).

ولتبسيط الكود، سنخزن مكون الشبكة الهيكلية للشخصية (character’s skeletal mesh) في متغير لأنك ستحتاج إلى الرجوع إليه عدة مرات، وللقيام بذلك، أضف العقد المميزة (highlighted):

فك تغليف الشخصية

حان الوقت الآن لفك الغلاف (unwrapping) وإخفاء المجال (sphere masking)، وللقيام بذلك، أضف العقد المميزة (higlighted) إلى نهاية سلسلة العقد:

فك تغليف الشخصية

إليك ما يفعله كل سطر:

  1. أولاً، سيؤدي هذا إلى حفظ المادة الأصلية للشبكة بحيث يمكنك إعادة تطبيقها لاحقاً، وبعد ذلك، يتم تطبيق المادة غير المغلفة.
  2. سيمرر هذا الخط موقع الضربة (hit location) ونصف قطر الفرشاة (brush radius) إلى المادة غير المغلفة لإخفاء الكرة.

قبل أن تتمكن من اختبار فك التغليف، ستحتاج إلى إجراء خط تتبع (line trace) من المشغل للحصول على موقع إصابة.

الحصول على موقع الإصابة (Hit Location)

انقر فوق (Compile) ثم ارجع إلى المحرر الرئيسي، وبعد ذلك، افتح (BP_Player)، وافتح تابع التصويب (Shoot) وأضف العقد المميزة (highlighted)، وفي هذا البرنامج التعليمي، اضبط نصف قطر الفرشاة (Brush Radius) على 10.

الحصول على موقع الإصابة

انقر فوق (Compile) ثم أغلق (BP_Player)، واضغط على تشغيل (Play) ثم انقر بزر الماوس الأيسر على الشخصية للقيام بفك التغليف وقناع المجال.

الحصول على موقع الإصابة

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

الآن بعد أن قمت بفك تغليف الشبكة، وتحتاج إلى التقاطها.

التقاط الشبكة غير المغلفة (Capturing the Unwrap)

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

افتح (BP_Capture) ثم قم بإضافة مكون (Plane) المسمى (BackgroundPlane)، ولتوفير الوقت، تم إنشاء المادة السوداء، اضبط المادة على (M_Background).

التقاط الشبكة غير المغلفة

في هذا البرنامج التعليمي، يبلغ حجم فك الالتقاط والتقاط (500 × 500) وحدة، لذا يجب أن يكون مستوى الخلفية بهذا الحجم على الأقل، اضبط المقياس (Scale) على (5.0 ، 5.0 ، 1.0).

التقاط الشبكة غير المغلفة

نظرًا لأن موقع (plane) وموقع الفك (unwrap) متماثلان، فمن الجيد أيضاً إزاحة (plane) لأسفل لمنع أي تعارض مع المحور (z)، وللقيام بذلك، قم بضبط الموقع (Location) إلى (0.0 ، 0.0 ، -1.0).

التقاط الشبكة غير المغلفة

بعد ذلك، تحتاج إلى إجراء الالتقاط، ارجع إلى تابع (PaintActor) وأضف العقد المميزة (highlighted):

التقاط الشبكة غير المغلفة

سيؤدي ذلك إلى التقاط الشبكة غير المغلفة، وبعد ذلك، ستعيد تطبيق المادة الأصلية للشبكة.

حالياً، ستحل عملية التقاط المشهد محل المحتويات السابقة لهدف التجسيد، وللتأكد من تراكم أقنعة المجال، تحتاج إلى التأكد من أن التقاط المشهد يضيف إلى المحتويات السابقة بدلاً من ذلك، وللقيام بذلك، حدد مكون (SceneCapture) وقم بضبط (Scene Capture / Composite Mode) على (Additive).

التقاط الشبكة غير المغلفة

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

استخدام القناع (Using the Mask)

انتقل إلى (Characters \ Mannequin \ Materials) وافتح (M_Mannequin)، وبعد ذلك، أضف العقد المميزة (highlighted)، وتأكد من ضبط نموذج النسيج (Texture Sample) على (RT_Capture).

استخدام القناع

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

انقر فوق تطبيق (Apply) ثم أغلق المادة، واضغط على تشغيل (Play) وانقر بزر الماوس الأيسر على الشخصية لبدء الرسم.

استخدام القناع

المصدر
هنا

مقالات ذات صلة

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني.