ما هي مخططات Toon؟ وكيف يمكن استخدامها في Unreal Engine 4

عندما يقول الناس “مخططات Toon”، فإنهم يشيرون إلى أي أسلوب يعرض خطوطاً حول الكائنات، مثل تظليل السليلوز (cel shading)، ويمكن أن تعطي الخطوط العريضة الانطباع بأن الأشياء مرسومة أو محبرة، ويمكنك مشاهدة أمثلة على ذلك في ألعاب مثل (Okami) و(Borderlands) و(Dragon Ball FighterZ).

ستتعلم في هذا البرنامج التعليمي كيفية:

  1. إنشاء حدود خارجية باستخدام شبكة مقلوبة.
  2. إنشاء الخطوط العريضة باستخدام المعالجة اللاحقة والالتفاف.
  3. إنشاء واستخدام وظائف مادية.
  4. عينة من وحدات البكسل المجاورة.

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

البداية

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

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

في البداية، ستقوم بإنشاء حدود خارجية (outlines) باستخدام شبكة مقلوبة (inverted mesh).

مخطط الشبكة المقلوبة (Inverted Mesh Outlines)

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

مخطط الشبكة المقلوبة

إذا كنت تستخدم النسخة كما هي، فستحجب النسخة الأصلية تماماً.

مخطط الشبكة المقلوبة

لإصلاح ذلك، يمكنك عكس القواعد القياسية للنسخة المكررة، ومع تمكين اختيار الوجه الخلفي (backface culling)، سترى الوجوه الداخلية بدلاً من الوجوه الخارجية.

مخطط الشبكة المقلوبة

سيسمح هذا للنسخة الأصلية بالظهور من خلال النسخة المكررة، ولأن النسخة المكررة أكبر من النسخة الأصلية، ستحصل على مخطط تفصيلي.

مخطط الشبكة المقلوبة

المزايا:

  1. سيكون لديك دائماً خطوط نظيفة لأن المخطط التفصيلي يتكون من مضلعات.
  2. يمكن تعديل المظهر والسماكة بسهولة عن طريق تحريك القمم.
  3. تتقلص الخطوط العريضة عبر المسافة، ويمكن أن يكون هذا أيضاً عيباً.

العيوب:

  1. بشكل عام، لا يحدد التفاصيل داخل الشبكة.
  2. نظراً لأن المخطط التفصيلي يتكون من مضلعات، فهي عرضة للاقتطاع، ويمكنك أن ترى هذا في المثال أعلاه حيث يتداخل المكرر مع الأرض.
  3. ربما سيئ للأداء، يعتمد هذا على عدد المضلعات التي تحتويها شبكتك، ونظراً لأنك تستخدم نسخاً مكررة، فأنت تقوم بمضاعفة عدد المضلعات بشكل أساسي.
  4. يعمل بشكل أفضل على الشبكات الملساء والمحدبة، والحواف الصلبة والمناطق المقعرة ستخلق ثقوباً في المخطط التفصيلي، ويمكنك أن ترى هذا في الصورة أدناه.

مخطط الشبكة المقلوبة

بشكل عام، يجب عليك إنشاء الشبكة المقلوبة (inverted mesh) في برنامج النمذجة (modelling)، وسوف يمنحك هذا مزيداً من التحكم في الصورة الظلية.

وإذا كنت تعمل باستخدام شبكات الهيكل العظمي (skeletal)، فسوف يسمح لك أيضًاً بجلد النسخة المكررة للهيكل العظمي الأصلي، وسيسمح هذا للنسخة المكررة بالتحرك مع الشبكة الأصلية.

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

أولاً، تحتاج إلى إنشاء مادة للنسخة المكررة.

إنشاء مادة الشبكة المقلوبة (Creating the Inverted Mesh Material)

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

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

انتقل إلى مجلد المواد (Materials folder) وافتح (M_Inverted)، وبعد ذلك، انتقل إلى لوحة التفاصيل (Details panel) واضبط الإعدادات التالية:

  1. وضع المزج (Blend Mode): اضبط هذا على (Masked)، وسيسمح لك ذلك بتمييز المناطق على أنها مرئية أو غير مرئية، ويمكنك ضبط الحد (threshold) عن طريق تحرير قيمة مقطع قناع التعتيم (Opacity Mask Clip Value).
  2. نموذج التظليل (Shading Model): اضبط هذا على (Unlit)، وسيؤدي ذلك إلى عدم تأثير الأضواء على الشبكة.
  3. ذو الوجهين (Two Sided): اضبط هذا على (enabled)، وبشكل افتراضي، تعد عمليات الإعدام غير الواقعية خلفية، ويؤدي تمكين هذا الخيار إلى تعطيل استبعاد الواجهة الخلفية، وإذا تركت اختيار الواجهة الخلفية ممكّناً، فلن تتمكن من رؤية المضلعات المواجهة للداخل.

إنشاء مادة الشبكة المقلوبة

بعد ذلك، قم بإنشاء (Vector Parameter) وقم بتسميته (OutlineColor) هذا سوف يتحكم في لون المخطط التفصيلي، وقم بتوصيله بـ (Emissive Color).

إنشاء مادة الشبكة المقلوبة

لإخفاء المضلعات المواجهة للخارج، أنشئ إشارة ثنائية الوجه (TwoSidedSign) واضربها في -1، وقم بتوصيل النتيجة بقناع التعتيم (Opacity Mask).

إنشاء مادة الشبكة المقلوبة

سيخرج (TwoSidedSign ) 1 للواجهات الأمامية و -1 للواجهات الخلفية, وهذا يعني أن الواجهات الأمامية ستكون مرئية وأن الأسطح الخلفية ستكون غير مرئية.

ومع ذلك، فأنت تريد التأثير المعاكس، وللقيام بذلك، تقوم بعكس الإشارات بضربها في -1، والآن ستخرج الواجهات الأمامية -1 وستخرج الواجهات الخلفية 1.

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

إنشاء مادة الشبكة المقلوبة

في (Unreal)، يمكنك تحريك موضع كل رأس باستخدام (World Position Offset)، وبضرب الرأس العادي في (OutlineThickness)، فإنك تجعل الشبكة أكثر سمكاً، وهنا عرض توضيحي باستخدام الشبكة الأصلية:

إنشاء مادة الشبكة المقلوبة

في هذه المرحلة، تكون المادة كاملة، انقر فوق تطبيق (Apply) ثم أغلق (M_Inverted).

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

تكرار الشبكة (Duplicating the Mesh)

انتقل إلى مجلد (Blueprints) وافتح (BP_Viking)، وأضف مكون (Static Mesh) كعنصر فرعي لـ (Mesh) وقم بتسميته (Outline).

تكرار الشبكة

تأكد من تحديد (Outline) وضبط (Static Mesh) على (SM_Viking)، وبعد ذلك، اضبط مادته على (MI_Inverted).

تكرار الشبكة

(MI_Inverted) هو مثيل لـ (M_Inverted)، وسيسمح لك ذلك بضبط معاملات (OutlineColor) و(OutlineThickness) دون إعادة التحويل البرمجي.

انقر فوق (Compile) ثم أغلق (BP_Viking)، وسيكون للفايكنج الآن مخطط تفصيلي، ويمكنك التحكم في اللون والسمك عن طريق فتح (MI_Inverted) وضبط المعاملات.

تكرار الشبكة

هذا كل شيء لهذه الطريقة، تحقق مما إذا كان يمكنك إنشاء شبكة مقلوبة في برنامج النمذجة الخاص بك ثم إحضارها إلى (Unreal).

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

مخططات المعالجة اللاحقة (Post Process Outlines)

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

مخططات المعالجة اللاحقة

المزايا:

  1. يمكن أن تنطبق على المشهد بأكمله بسهولة.
  2. تكلفة أداء ثابتة نظراً لأن التظليل يعمل دائماً لكل بكسل.
  3. عرض الخط يبقى كما هو على مسافات مختلفة، ويمكن أن يكون هذا أيضاً عيباً.
  4. لا تتشابه الخطوط مع الشكل الهندسي لأنه تأثير ما بعد العملية.

العيوب:

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

من الطرق الشائعة لاكتشاف الحواف إجراء التفاف على كل بكسل.

ما هو الالتفاف (Convolution)؟

في معالجة الصور، الالتفاف هو عملية على مجموعتين من الأرقام لإنتاج رقم واحد، وأولاً، تأخذ شبكة من الأرقام (تُعرف بالنواة) وتضع المركز فوق كل بكسل، ويوجد أدناه مثال على نواة 3 × 3 تتحرك فوق الصفين العلويين من الصورة:

الالتفاف

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

الالتفاف

أولاً، ضع النواة (سنستخدم نفس النواة من قبل) بحيث يكون البكسل الهدف في المركز، وبعد ذلك، اضرب كل عنصر من عناصر النواة بالبكسل الذي يتداخل معه.

الالتفاف

أخيراً، اجمع كل النتائج معاً، وستكون هذه هي القيمة الجديدة للبكسل المركزي، وفي هذه الحالة، القيمة الجديدة هي 0.5 + 0.5 أو 1، وهذه هي الصورة بعد إجراء الالتفاف على كل بكسل:

الالتفاف

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

الالتفاف

ملاحظة: ستلاحظ أنه يمكنك العثور عليها كفلاتر في برامج تحرير الصور، والالتفاف هو في الواقع كيفية أداء برامج تحرير الصور للعديد من عمليات التصفية الخاصة بها، وفي الواقع، يمكنك إجراء التفاف باستخدام الأنوية الخاصة بك في (Photoshop).

لاكتشاف الحواف في صورة ما، يمكنك استخدام اكتشاف حافة (Laplacian).

كشف حافة لابلاسيان (Laplacian Edge Detection)

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

كشف حافة لابلاسيان

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

لمساعدتك على فهمه، دعنا نلقي نظرة على لابلاسيان في بُعد واحد، وستكون نواة:

كشف حافة لابلاسيان

أولاً، ضع النواة فوق بكسل حافة ثم قم بإجراء التفاف.

كشف حافة لابلاسيان

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

بعد ذلك، دعنا نلتف منطقة ذات تباين أقل.

كشف حافة لابلاسيان

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

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

كشف حافة لابلاسيان

في القسم التالي، ستقوم ببناء مادة ما بعد العملية التي تقوم باكتشاف حافة (Laplacian) على المخزن المؤقت للعمق (depth buffer).

بناء كاشف الحافة لابلاسيان (Building the Laplacian Edge Detector)

انتقل إلى مجلد الخرائط (Maps folder) وافتح (PostProcess)، سترى شاشة سوداء، وذلك لأن الخريطة تحتوي على حجم معالجة لاحقة (Post Process Volume) باستخدام مادة عملية نشر فارغة.

بناء كاشف الحافة لابلاسيان

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

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

بناء كاشف الحافة لابلاسيان

ولتجربة بكسل مختلف، تحتاج فقط إلى إضافة إزاحة إلى (TextureCoordinate)، وفي صورة 100 × 100، كل بكسل له حجم 0.01 في مساحة الأشعة فوق البنفسجية، ولأخذ عينة من البكسل إلى اليمين، أضف 0.01 على المحور (X).

بناء كاشف الحافة لابلاسيان

ولكن هناك مشكلة في هذا، مع تغير دقة الصورة، يتغير حجم البكسل أيضاً، وإذا كنت تستخدم نفس الإزاحة (0.01 ، 0) في صورة 200 × 200، فسوف تأخذ عينة من 2 بكسل إلى اليمين.

لإصلاح ذلك، يمكنك استخدام عقدة (SceneTexelSize) التي تُرجع حجم البكسل، ولاستخدامها، عليك القيام بشيء مثل هذا:

بناء كاشف الحافة لابلاسيان

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

بناء كاشف الحافة لابلاسيان

من الواضح أن هذا سرعان ما يصبح فوضوياً، ولحسن الحظ، يمكنك استخدام توابع المواد (material functions) للحفاظ على نظافة الرسم البياني الخاص بك.

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

إنشاء تابع البكسل النموذجي (Creating the Sample Pixel Function)

أولاً، انتقل إلى المجلد (Materials \ PostProcess)، ولإنشاء تابع مادة (material function)، انقر فوق إضافة جديد (Add New) وحدد المواد والأنسجة / تابع المواد (Materials & Textures\Material Function).

إنشاء تابع البكسل النموذجي

أعد تسميته إلى (MF_GetPixelDepth) ثم افتحه، وسيكون للرسم البياني (FunctionOutput) واحدة، وهذا هو المكان الذي ستقوم فيه بتوصيل قيمة البكسل الذي تم اختبار عيناته.

إنشاء تابع البكسل النموذجي

أولاً، تحتاج إلى إنشاء إدخال يقبل الإزاحة، وللقيام بذلك، قم بإنشاء (FunctionInput).

إنشاء تابع البكسل النموذجي

سيظهر هذا كدبوس إدخال عند استخدام التابع لاحقاً.

أنت الآن بحاجة إلى تحديد بعض الإعدادات للإدخال، وتأكد من تحديد (FunctionInput) ثم انتقل إلى لوحة التفاصيل (Details panel)، واضبط الإعدادات التالية:

  1. اسم المدخل (InputName): الإزاحة (Offset).
  2. نوع المدخل (InputType): شعاع دخل التابع 2 (Function Input Vector 2)، ونظراً لأن المخزن المؤقت للعمق (depth buffer) هو صورة ثنائية الأبعاد، يجب أن تكون الإزاحة في (Vector 2).
  3. استخدام قيمة المعاينة كافتراضي (Use Preview Value as Default): ممكّن (Enabled)، وإذا لم تقدم قيمة إدخال، فسيستخدم التابع القيمة من قيمة المعاينة.

إنشاء تابع البكسل النموذجي

بعد ذلك، تحتاج إلى مضاعفة الإزاحة بحجم البكسل، وبعد ذلك، تحتاج إلى إضافة النتيجة إلى تنسيق النسيج (TextureCoordinate)، وللقيام بذلك، أضف العقد المميزة (highlighted):

إنشاء تابع البكسل النموذجي

أخيراً، تحتاج إلى أخذ عينة من المخزن المؤقت للعمق (depth buffer) باستخدام الأشعة فوق البنفسجية (UVs) المتوفرة، أضف (SceneDepth) وقم بتوصيل كل شيء مثل:

إنشاء تابع البكسل النموذجي

ملاحظة: يمكنك أيضاً استخدام مجموعة (SceneTexture) على (SceneDepth) بدلاً من ذلك.

ملخص:

  1. سوف تأخذ الإزاحة (Offset) في (Vector 2) وتضربها في (SceneTexelSize)، وسيعطيك هذا تعويضاً في مساحة الأشعة فوق البنفسجية (UV).
  2. أضف الإزاحة (offset) إلى (TextureCoordinate) للحصول على بكسل (x، y) بعيداً عن البكسل الحالي.
  3. سيستخدم (SceneDepth) الأشعة فوق البنفسجية المتوفرة لأخذ عينات من البكسل المناسب ثم إخراجه.

هذا كل شيء بالنسبة للتابع المادي، انقر فوق تطبيق (Apply) ثم أغلق (MF_GetPixelDepth).

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

بعد ذلك، تحتاج إلى استخدام التابع لإجراء التفاف على المخزن المؤقت للعمق (depth buffer).

أداء الالتفاف (Performing Convolution)

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

افتح (PP_Outline) وأنشئ أربع عقد (Constant2Vector)، واضبطهم على ما يلي:

  • (-1 ، 0)
  • (1 ، 0)
  • (0 ، -1)
  • (0 ، 1)

أداء الالتفاف

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

أداء الالتفاف

سيعطيك هذا قيم العمق لكل بكسل.

التالي هو مرحلة الضرب، ونظراً لأن مضاعف وحدات البكسل المجاورة هو 1، يمكنك تخطي عملية الضرب، ومع ذلك، ما زلت بحاجة إلى ضرب البكسل المركزي (الوظيفة السفلية) في -4.

أداء الالتفاف

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

أداء الالتفاف

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

أداء الالتفاف

ملخص:

  1. ستحصل عُقد MF_GetPixelDepth على قيمة العمق للبكسل الأوسط واليسار واليمين والعلوي والسفلي.
  2. اضرب كل بكسل في قيمة النواة المقابلة له، وفي هذه الحالة، ما عليك سوى مضاعفة البكسل المركزي.
  3. احسب مجموع كل وحدات البكسل.
  4. احصل على القيمة المطلقة للناتج، سيمنع هذا وحدات البكسل ذات القيم السالبة من الظهور باللون الأسود.

انقر فوق تطبيق (Apply) ثم ارجع إلى المحرر الرئيسي، ستحتوي الصورة بأكملها الآن على خطوط.

أداء الالتفاف

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

لإصلاح هذا، يمكنك تنفيذ عتبة (thresholding).

تنفيذ العتبة (Implementing Thresholding)

أولاً، ستصلح الخطوط التي تظهر بسبب اختلافات صغيرة في العمق، ارجع إلى محرر المواد (material editor) وقم بإنشاء الإعداد أدناه، وتأكد من ضبط العتبة (Threshold) على 4.

تنفيذ العتبة

لاحقاً، ستقوم بتوصيل النتيجة (result) من اكتشاف الحافة (edge detection) بـ (A)، وهذا سيخرج 1 (يشير إلى حافة) إذا كانت قيمة البكسل أعلى من 4، وإلا، فسيخرج 0 (بدون حافة).

بعد ذلك، ستتخلص من الخطوط الموجودة في الخلفية، قم بإنشاء الإعداد أدناه، وتأكد من ضبط (DepthCutoff) على 9000.

تنفيذ العتبة

سيؤدي هذا إلى إخراج 0 (بدون حافة) إذا كان عمق البكسل الحالي أكبر من 9000، وإلا، فسيتم إخراج القيمة من (A <B).

أخيراً، قم بتوصيل كل شيء على هذا النحو:

تنفيذ العتبة

الآن، ستظهر الخطوط فقط إذا كانت قيمة البكسل أعلى من 4 (العتبة) وعمقها أقل من 9000 (DepthCutoff).

انقر فوق تطبيق (Apply) ثم ارجع إلى المحرر الرئيسي، اختفت الآن الخطوط الصغيرة وخطوط الخلفية.

تنفيذ العتبة

ملاحظة: يمكنك إنشاء مثيل مادي لـ (PP_Outline) للتحكم في العتبة (Threshold) و(DepthCutoff).

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

إنشاء خطوط أكثر سماكة (Creating Thicker Lines)

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

في الالتواء الموسع، يمكنك ببساطة تباعد الإزاحات عن بعضها البعض، وللقيام بذلك، تقوم بضرب كل إزاحة في عدد قياسي يسمى معدل التمدد، وهذا يحدد التباعد بين كل عنصر في النواة (kernel).

إنشاء خطوط أكثر سماكة

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

الآن دعونا ننفذ الالتواء الموسع، ارجع إلى محرر المواد (material editor) وأنشئ (ScalarParameter) يسمى (DilationRate)، واضبط قيمته على 3، وبعد ذلك، اضرب كل إزاحة (offset) في (DilationRate).

إنشاء خطوط أكثر سماكة

سيضع هذا كل إزاحة 3 بكسل بعيداً عن بكسل المركز.

انقر فوق تطبيق (Apply) ثم ارجع إلى المحرر الرئيسي، وسترى أن خطوطك أكثر سمكاً، وفيما يلي مقارنة بين معدلات التمدد المتعددة:

إنشاء خطوط أكثر سماكة

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

إضافة الخطوط إلى الصورة الأصلية (Adding Lines to the Original Image)

ارجع إلى محرر المواد (material editor) وقم بإنشاء الإعداد أدناه.

إضافة الخطوط إلى الصورة الأصلية

بعد ذلك، قم بتوصيل كل شيء على هذا النحو:

إضافة الخطوط إلى الصورة الأصلية

الآن، سيخرج (Lerp) صورة المشهد إذا وصل ألفا إلى الصفر (أسود)، وخلاف ذلك، سيتم إخراج (LineColor).

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

إضافة الخطوط إلى الصورة الأصلية

المصدر
هنا

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

اترك تعليقاً

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