بازی های .io را به خاطر دارید؟ Slither.io، Agar.io، Diep.io.. آنها بازی های چند نفره HTML5 بسیار ساده ای بودند که می توانستند واقعاً اعتیاد آور شوند. در کودکی همیشه دوست داشتم بازی .io خود را داشته باشم که همه بتوانند آن را بازی کنند.
اما به این سادگی هم نبود… شما باید یاد می گرفتید که با H5 Canvas در قسمت جلویی بازی کنید و بک اند (Node.js و Socket.io) برای من خیلی زیاد بود. حتی اگه میتونستی از موتور بازی برای قسمت کلاینت استفاده کنی، کار سرور سخت بود.😢
فست فوروارد 6 سال (فکر می کنم) Gamemaker را یاد گرفتم، بهترین و آسان ترین برای یادگیری Game Engine و اصول Node.js، اجرای سرور Socket.io در فضای ابری🌧️ و ساختم
🥳 که تا امروز زنده است. جدی، همین الان بازیش کن! اما این 6 ماه تعهد سخت طول کشید.
مشکل ساختن چند نفره
بازی‌های چندنفره یا Networking یک نسل جدید در توسعه بازی است. این به سادگی گرفتن یک ورودی -> انجام برخی اقدامات نیست.
راه اندازی سرور. سپس از موتور بازی خود به آن متصل شوید. سپس داده ها را با سایر مشتریان به اشتراک بگذارید. سپس متوجه می شوید که موتورهای بازی سرورهای بدی هستند و اگر می خواهید بازی خود را جهانی و مقیاس پذیر کنید، به یک راه حل خام (مانند Node.js) نیاز دارید. سپس به تأخیر، اقتدار و قطع ارتباط می پردازیم.
حتی اگر یک توسعه‌دهنده بازی خوب باشید، ورود به Multiplayer برای اولین بار می‌تواند ترسناک باشد. خیلی شیب دار است
بیایید توسعه بازی را آسان کنیم. وقتی React دارید با وانیلی H5-JS-CSS کار نمی کنید. وقتی موتورهای بازی دارید که گرافیک را برای شما پردازش می کنند، H5 Canvas را یاد نمی گیرید. وقتی Rocket Networking دارید به سرورها فکر نمی کنید – یک کتابخانه شبکه ای که من ایجاد کردم که ساخت بازی های چند نفره را بسیار آسان می کند. ما سرور شما را میزبانی می کنیم، همه چیزهای سخت شبکه را از تصویر حذف می کنیم تا بتوانید به جای نگرانی در مورد شبکه، روی ایجاد یک بازی سرگرم کننده تمرکز کنید.
4 قسمت خواهیم داشت.
- ساخت یک شوتر فضایی ساده در گیم میکر
- کاری کنید که گلوله شلیک کند
- شبکه موشکی را اضافه کنید و شروع به دیدن بازیکنان دیگر کنید
- منطق گلوله‌ها را اضافه کنید تا بتوانید بازیکنان دیگر را از بین ببرید
ساخت یک شوتر فضایی ساده در گیم میکر
چرا گیم میکر؟ زیرا این موتور بازی برای دو بعدی بهترین است. شما به معنای واقعی کلمه می توانید آن را در 1 روز یاد بگیرید و شروع به ساخت بازی های جالب کنید. می‌توانید بازی‌ها را به‌صورت رایگان بسازید و آنها را روی پلتفرم بازی‌های GX خود آزمایش کنید، اما وقتی می‌خواهید آن را به دامنه خود متصل کنید، باید اشتراک آنها را خریداری کنید که امکان صادرات HTML5 را فراهم می‌کند.
یک پروژه جدید بسازید. بگذارید آن را launch.io بنامیم
بیایید پس زمینه ای را که ساخته ام اضافه کنیم. این یک عکس از صورت های فلکی است. Lol در Dev.to سفید به نظر می رسد بنابراین آن را دانلود کنید. هنر جالبی داره
روی پوشه sprites کلیک راست کرده و Create-> Sprite را کلیک کنید. اسمش را sBackground بگذارید.
تصویر یا هر تصویر پس زمینه دلخواه خود را وارد کنید. تصویر من 1200×1200 پیکسل است، اما می خواهم اندازه آن را به 3000×3000 تغییر دهم.
تغییر اندازه
روی Room1 در پوشه Rooms دوبار کلیک کنید و لایه Background را در سمت چپ انتخاب کنید. سپس sBackground را در جایی که می گوید no sprite قرار دهید.
دوباره روی Room1 دوبار کلیک کنید و اندازه اتاق را روی همان 3000×3000 قرار دهید
اکنون باید یک دوربین کوچک برای قسمتی از نقشه که بازیکن در آن قرار دارد ایجاد کنیم. با قرار دادن این تنظیمات یک viewport راه اندازی کنید.
ساخت بازیکن
فرآیند ساخت sprite را دوباره انجام دهید و sPlayer را از این تصویر بسازید
مبدا (بالا سمت چپ) را روی مرکز وسط قرار دهید.
روی پوشه Objects کلیک کنید و روی Create Object کلیک راست کنید
آن را oPlayer صدا کنید و sprite را روی sPlayer قرار دهید
این مرد را به اتاق اضافه کنید. روی لایه Instances کلیک کنید و oPlayer را از پوشه Objects بکشید
دوباره به Room1 -> تنظیمات Viewport بروید و در زیر Viewport 0، Object زیر را روی oPlayer قرار دهید. به این ترتیب بازیکن هرگز از دید خارج نخواهد شد.
همچنین مرزهای افقی و عمودی را به جای 32 روی 300 قرار دهید.
همچنین به دلیل شفاف بودن تصویر ستاره ها، ما به یک bg سیاه پشت آن نیاز داریم. یکی اضافه کنید و رنگ را در این لایه روی مشکی قرار دهید.
با دوبار کلیک کردن روی آن در پوشه Objects به oPlayer برگردید.
روی Add Event ->Step کلیک کنید
رویداد step دارای کدی است که هر فریم از بازی شما را اجرا می کند.
این کد را اضافه کنید. این باعث می شود که جت همیشه نشانگر ماوس شما را دنبال کند
speed = 3
direction = point_direction(x,y,mouse_x,mouse_y)
image_angle = direction
بازی خود را با کلیک بر روی Run تست کنید.
باید چیزی شبیه این باشد
برای امروز همین است! در قسمت بعدی گلوله ها و سپس Rocket Networking را اضافه می کنیم.
اگر شما یک کاربر بازی ساز پیشرفته هستید، می توانید با این ویدیوی YT که کد اضافی بیشتری دارد و کامل است، دست به کار شوید. (کد دوربین سفارشی و همه)
https://www.youtube.com/watch?v=f0V-r9ipx70
