كيفية إنشاء لعبة منصة الوحدة الأساسية

).



يمكن أن يكون إنشاء ألعاب قائمة على المستعرض في Unity WebGL مجزيًا للغاية - فهناك العديد من مواقع بوابات الألعاب التي ستقسم إيرادات الإعلانات معك ، أو تشتري ألعابك مباشرة منك. إذا كنت موهوبًا ، يمكنك بسهولة كسب عدة آلاف من الدولارات شهريًا من حصة أرباح الإعلانات. Unity with WebGL هي واحدة من أفضل الأدوات لذلك ، ومع مكونات WebVR الإضافية ، يمكنك أيضًا تقديم دعم VR لألعابك بسهولة تامة.

لذا إذا كنت تتساءل عن كيفية إنشاء ألعاب Unity WebGL ، فتابع القراءة!



المتطلبات

  • وحدة
  • معرفة HTML5 / JavaScript
  • (اختياري) محرر نصوص جيد مثل NotePad ++

للبدء ، قم بتنزيل Unity وتثبيته ، وتأكد من تثبيت مكون دعم WebGL.





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

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

إذا قمت بالنقر فوق ضوء اتجاهي في قائمة Hierarchy ، سيعطيك مجموعة من المعلومات حول هذا الضوء المحدد ، وستكون قادرًا على تمكين / تعطيل الظلال منه.



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

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

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

لذلك في التسلسل الهرمي لوحة ، انقر فوق 'إنشاء' وتعديل هذه الخصائص:

  • الموضع {X: 0، Y: 2.5، Z: 0}
  • المقياس {س: 0.3 ، ص: 0.3 ، ع: 0.3}

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

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

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

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

قم بإنشاء مجلد فرعي جديد في ملف الأصول دليل وتسميته شيئًا مثل 'المواد' ، ثم قم بإنشاء مادة فيزيائية جديدة. أطلق عليها اسم 'Bouncy_blob' أو ما تريده.

الآن في تفتيش لوحة ، أضف هذه القيم إلى المادة النطاطة:

  • الاحتكاك الديناميكي: 10
  • الخيال الثابت: 10
  • نطاط: 1
  • مجموعة الاحتكاك: الحد الأقصى
  • الجمع بين الارتداد: الحد الأقصى

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

  • الاحتكاك الديناميكي: 0.9
  • الخيال الثابت: 0.9
  • نطاط: 1
  • مجموعة الاحتكاك: متوسط
  • الجمع بين الارتداد: ضرب

الآن عندما تضغط على الزر 'تشغيل' ، ستلاحظ أن شخصيتنا ترتد أعلى في كل مرة ترتد فيها.

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

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

في أي حال ، تحتاج إلى تعديل الكاميرا كما يلي:

  • المركز {X: 0، Y: 1، Z: 0}
  • الدوران {X: 90 ، Y: 0 ، Z: 0}
  • المقياس {X: 2.5 ، Y: 2.5 ، Z: 2.5}
  • أعلام واضحة: لون خالص
  • الخلفية: # 000
  • مجال الرؤية: 80.3

الآن لمنحنا إحساسًا 'بالمنظور' لقفز الارتفاع ، سنقوم بإضافة ضوء كشاف. لذا قم بتعديل قيم أضواء كاشفة من أجل:

  • الدوران {X: 90 ، Y: 0 ، Z: 0}

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

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

عند فتح النص في محرر البرنامج النصي الافتراضي في Unity ، يجب أن يبدو كما يلي:

لذلك نريد متغير 'GameObject' للإشارة إلى شخصيتنا - لهذا ، يمكنك ببساطة التبديل مرة أخرى إلى عرض الكاميرا Unity ، وسحب / إفلات المجال الخاص بنا في حقل الإدخال.

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

والآن نحتاج فقط إلى قيم الماوس (كلما تحركها اللاعب). سنحتاج إلى استدعاء وظيفة التحديث لتحقيق ذلك. لذا قم بتعديل البرنامج النصي تحت متغير التحديث:

لشرح ذلك قليلاً ، فإن المتغيرين X و Z مخصصان لمحور وحدة التحكم - نريد أن يتلاعبوا بموضع شخصيتنا عندما نرسل مدخلات وحدة التحكم إلى اللعبة. نحتاج إلى الإشارة إلى متغير Input.mousePosition ، والذي يعطينا متجهًا ثنائي الأبعاد. يجب إضافة هذا المتجه ثنائي الأبعاد إلى تتبع التنسيق الخاص بنا ، لذلك سنقوم باستدعاء دالة setHeroPosition مع القيم والحجج.

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

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

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

إنشاء منصات إجرائية

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

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

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

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

السبب في إرفاقه بالكاميرا هو أن الكاميرا لا تتلف أبدًا ، وتظل ثابتة - لذلك لا يتم إتلاف النص أبدًا ويظل ثابتًا من خلال ربطه به.

إليك ما يجب تضمينه في البرنامج النصي:

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

يحتوي هذا الرمز أيضًا على ثلاثة متغيرات خاصة - الأسطر التي تبدأ بـ فار خاص. سيؤدي ذلك إلى إنشاء (مرجع) اللوحة الجاهزة بالطرق التالية:

  • حدود var الخاصة: float يضع حدًا على المحور ص ، لذلك عندما تقفز شخصيتنا أعلى من هذه الحدود ، سيتم إنشاء لوحة جديدة.
  • تناوب var الخاص: Quaternion ؛ يضيف ببساطة دورانًا ضروريًا لإنشاء مثيل للمباني الجاهزة لدينا - ومع ذلك ، فإننا نضيف دوران = Quaternion.identify ؛ لان هذا يرشد المحرك إلى عدم تدوير كائن اللعبة. سيكون الكائن (لوحاتنا الجاهزة) حرفياً 'متماشياً تماماً' مع العالم.
  • المتغير الخاص النهائي lastPlatformPosition سوف يتذكر ويحفظ موضع النظام الأساسي الأخير كمتجه ثلاثي الأبعاد (بشكل أساسي ، لن تختفي الأنظمة الأساسية خلفك ، لذا يمكنك الرجوع إلى الوراء عبر عالم اللعبة إذا كنت تريد).

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

خطوتنا التالية هي إضافة رمز يحدد موضع اللوحة التالي:

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

بالطبع ، لا نريد أن تكون هذه القيم بشكل صارم تم وضعها - القليل من العشوائية أمر جيد ، وإلا فإننا نصنع سلمًا مثاليًا. لذلك نحن نستخدم عشوائي وظيفة ، بين القيمتين -1 و 2 ، لاستدعاء قيم عشوائية لـ X و Z. يمكنك اللعب بهذه الأرقام قليلاً إذا كنت تريد العبث.

إنشاء قائمة اللعبة

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

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

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

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

الجزء الأخير من النص هو الوظيفة التي يجب استخدامها للتعامل مع حالة 'انتهاء اللعبة' وتحميل قائمة اللعبة.

هذا يضر بالوحدة تطبيق فئة - نحن قادرون على استدعاء مستوى تحميل وظيفة لإحضار مشهد جديد ، والذي في هذه الحالة ، هو ببساطة قائمة لعبتنا - تذكر أن كل شيء في الوحدة هو في الأساس 'مستويات'. القوائم الرئيسية (بدء اللعبة - الخيارات - الاعتمادات - إلخ) هي في الأساس مجرد مستويات / مشاهد بها أجزاء من النص القابل للنقر. نوع من مثل شاشات تحميل Skyrim ، إيه؟ إنها مجرد نماذج ثلاثية الأبعاد في عالم فارغ مع شريط تحميل.

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

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

عندما نموت في اللعبة ، يجب أن ينقلنا النص الذي أنشأناه من مستوى اللعبة إلى مشهد القائمة.

أضف زر 'ابدأ' للاعبين

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

لذا قم بالتبديل إلى مشهد قائمة اللعبة ، وأضف هذا الجزء إلى الكاميرا ( في لوحة المفتش ، تذكر من pt. 1 من هذا البرنامج التعليمي؟).

  • أعلام واضحة: لون خالص
  • الخلفية: # 000
  • العرض: 200
  • الارتفاع: 60

سيعطينا هذا خلفية سوداء صلبة لقائمة لعبتنا - ويتم ذلك بتنسيق قيم RGB ، لا عرافة - لذا سيكون اللون الأزرق 001 ، والأخضر هو 010 ، والأحمر هو 100 ، وما إلى ذلك. يمكنني شرح ذلك لك ، ولكن كل ما عليك فعله هو 'منتقي RGB' من Google إذا كنت تريد لونًا معينًا.

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

  • EventSystem
  • اللوحة القماشية
  • زر
  • نص

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

  • تحويل المستقيم {Pos X: 0، Pos Y: 0، Pos Z: 0}
  • تحويل المستقيم {العرض: 200 ، الارتفاع: 60}

لجعل هذا أكثر أناقة ، يمكنك إزالة 'الصورة المصدر' للزر ، وتعيين لون لها. ولتغيير نص الزر ، ما عليك سوى تعديل نص إلى شيء مثل 'START GAME' ، ومنحه حجم خط يبلغ 16 تقريبًا.

لجعل الزر قابل للنقر ، سنضيف وظيفة إلى البرنامج النصي UIController في ملف زر جزء. فقط أضف هذا الجزء من الشفرة أدناه:

قم بتطبيق هذه الوظيفة على أزرار مفتش الإعدادات ، وفي زر (نصي) إعدادات المكون ، سنضيف ببساطة وظيفة يتم تنفيذها عندما ينقر المشغل على زر البدء. لذا فقط أضف دالة إلى عند النقر() ، واسحب / أفلت زر بدء اللعبة في حقل الإدخال. أخيرًا ، حدد الوظيفة التي تم إنشاؤها حديثًا من البرنامج النصي UIController ( UIController.StartGame)

يمكننا تطبيق هذه الوظيفة في الأزرار مفتش إعدادات. في إعدادات مكون الزر (البرنامج النصي) ، يمكننا تنفيذ وظيفة عندما ينقر عليها اللاعب. لهذا ، نضيف وظيفة جديدة إلى حدث On Click () ، من خلال النقر فوق + أيقونة. الآن يمكننا سحب وإسقاط الزر نفسه في حقل الإدخال. ثم نختار الوظيفة التي كتبناها للتو من البرنامج النصي UIController (UIController.StartGame).

كيفية التصدير / النشر كلعبة متصفح WebGL

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

  • قم بتحميل لعبتك إلى نوع من مضيف الملفات (Dropbox ، Google Drive ، إلخ) ، ثم شارك الرابط. هذا مفيد للصغار العروض تريد أن تظهر للأصدقاء أو العملاء المحتملين ( مواقع بوابة الألعاب التي إما ستشتري لعبتك أو تنشئ لك عائدًا للمشاركة الإعلانية).
  • قم بتحميل لعبتك على خادم FTP تملكه ، وقم بتضمينه في ملف