Создание 2D игры на чистом JavaScript ES5 на HTML5 Canvas (Таймлапс)

Подписаться 15 тыс.

Просмотров 300 тыс.

50% 1

В этом видео (Таймлапс) создадим небольшую 2D игру на чистом JavaScript ES5 без использования фреймворков и библиотек.
Исходный код игры Elven Scout с ресурсами:
webgirlkristina?w=wall...
♡ Где меня найти?!
Instagram: / webgirlkristina
Twitter: / webgirlkristina
VK: webgirlkristina
FB: / webgirlkristina
Сотрудничество/collaboration: webgirlkristina@gmail.com
Игра Elven Scout на ES6:
1. Настройка webpack и babel.: • Создаем игру Elven Sco...
2. Игровой цикл, основная структура.: • Создаем игру Elven Sco...
3. Создание графики.: • Создаем игру Elven Sco...
4. Загрузка графики, управление сценами.: • Создаем игру Elven Sco...
5. Управление клавиатурой.: • Создаем игру Elven Sco...
6. Спрайты и анимация.: • Создаем игру Elven Sco...
7. Тайловая карта.: • Создаем игру Elven Sco...
8. Анимация персонажа.: • Создаем игру Elven Sco...
9. Игровой персонаж.: • Создаем игру Elven Sco...
10. Камера. : • Создаем игру Elven Sco...
11. Коллизия: • Создаем игру Elven Sco...
12. Враг: • Создаем игру Elven Sco...
13. Оружие: • Создаем игру Elven Sco...
14. Стрелы: • Создаем игру Elven Sco...
Создание 2D игры на чистом JavaScript ES5 на HTML5 Canvas (Таймлапс): • Создание 2D игры на чи...
Базовые возможности ES6 для начинающих.: • Базовые возможности ES...
Фоновая музыка/Background Music: "Let Me In" by Alex Stoner (taketones.com/track/let-me-in)
Licensed under Attribution-NonCommercial 4.0 International (CC BY-NC 4.0)
License taketones.com/license/1
#gamedev #2dgame #javascript #html5 #canvas

Опубликовано:

16 ноя 2018

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 829

@user-df4kb1io9l 5 лет назад

Щас я понял как делали Фаллаут 76))

@user-yq6vc3mn9l 5 лет назад

+++

@alexanderivanov9160 5 лет назад

Максим Х на самом деле нет.

@TheMufinv 5 лет назад

@@alexanderivanov9160 козел , испортил шутку

@diabetescheesecake 5 лет назад

его не делали, просто взяли фаллаут 4 и вместо 4, написали 76.

@asket1 5 лет назад

@@TheMufinv только лучше сделал. без его коммента - шутка не смешная и очень тупая

@djAbyssRT 5 лет назад

лампово и прям мастер-класс) С этого надо начинать любое обучение - с примера для подражания)

@n1ckyrush 5 лет назад

Годный контентик! Давай еще :)

@mkoe6462 5 лет назад

Шо ты тут делаешь :o

@pupok90 5 лет назад

фигасе, и ты тут)

@marinaurrey5246 5 лет назад

Очень интересно было посмотреть на процесс создания игры. Классное видео!

@D_o_m_i_n_u_S 5 лет назад

Молодец! Четко, понятно и наглядно. Спасибо за труд! Подписка однозначно! :)

@user-tv1kt8tu4r 5 лет назад

Влюблена 😍😍 Умничка ❤❤❤ Мотивация прибавилась :3 Спасибо 💕

@mkstlz 5 лет назад

очень круто и вдохновляет)) молодец

@cheesecheese5790 5 лет назад

только сегодня подписалась на ваш канал и уже влюбилась) с нетерпением жду еще видяшек)

@elenazueva1039 5 лет назад

очень лампово, еще радует то, что звук и картинка отличного качества!

@celestian_gaming 5 лет назад

Очень красивая и голос приятный! Молодец, что можешь и кодить и рисовать и со звуком. За сайт с генерацией спрайтов перса отдельное спасибо! ;)

@SuprunAlexey 5 лет назад

Круто получилось👍🏻👍🏻👍🏻👍🏻👍🏻

@vourlake1780 3 года назад

@MAIVSHOW 5 лет назад

У тебя круто получается)0) Спасибо за видео)))

@user-ev5lb5wp9l 5 лет назад

Круто, большая молодец!!!Вдохновляет садиться и кодить, интересный формат которым можно разбавлять туториалы :)

@cicuta_verde 5 лет назад

Это потрясающе! Ты такая умница!

@user-ej2sh2df7w 5 лет назад

было интересно посмотреть, спасибо!) удачи в развитии канала

@shkrv6 5 лет назад

отличный таймлапс, удачи с контентом!

@andreinakonex2501 Год назад

Спасибо Вам за данное видео. Подписываюсь, ставлю лайк 👍

@lukashdroppshow2607 5 лет назад

Молодец! Крутой проект =)

@user-cu8rh8nk5u 5 лет назад

Какая молодец, Кристина. Лайкос тебе ))

@Alexander.D. 5 лет назад

Очень здорово! Вдохновляет

@GennadyDryomin 5 лет назад

Очень интересно, продолжай в том же духе!

@alex90aaa 5 лет назад

хорошо рисует но больше всего мне понравилось что все в бесплатных программах и на линуксе

@ruzzifer 3 года назад

Ну она сама мне понравилась😍

@islam_in_the_west 5 лет назад

Ты заслуживаешь лайк. Молодец.

@user-qd7tu7zl3c 5 лет назад

Спасибо за познавательные видео! все хорошо рассказываешь и показываешь что и как надо делать! будем ждать от тебя еще видео!

@nullnull295 5 лет назад

надеюсь это был сарказм? Я просто ничего не понял, видео как писть 2д без библиотек, а на нем девушка что-то на ноуте делает, а что за код хз, код бы скинула. Вообще видео бессмысленное, я могу так же сделать на юнити, а сказать что это в css, один фиг никто ничего не увидит

@user-fy4vs7sy4k 4 года назад

Безжалостная орка жалко

@sergiyrudenko905 5 лет назад

Спасибо большое, интересное видео!

@user-ce1mz3en9j 5 лет назад

Необычно! Лайк!👍

@arturstadnix 5 лет назад

Наконец-то что-то годное в рекомендациях. Человек, которого приятно слушать и который создаёт интересный контент. Подписка

@dmitriiG2603 4 года назад

Это потрясающе, уже неделю делаю игру на js, слабо получается, а тут... Такие люди меня вдохновляют не сдаваться! Лайк, подписка

@batyazh 2 года назад

Ей, наткнулся на твой комент, стало интересно, как там твоя игра?

@ZELEBOBA11 Год назад

@@batyazh видимо не очень

@user-np2cu5qv7x 5 лет назад

Как классно, что в рекомендациях попадаются такие интересные видео, мне как нубу было интересно(хоть я и учу C++, а не JS). Спасибо за мотивацию, удачи вам.

@user-br9ql3ug8o 5 лет назад

Вау! Просто, вау! Респект)))

@Al-Mas3000 5 лет назад

В кои-то веки в рекомендованных действительно интересный контент))) Молодец, удачи тебе в кодинге и развити, а то смотрю набежали тут суперпрогеры-самцы свое ЧСВ потешить в коментах))

@denwww74 5 лет назад

и не только ЧВС....

@monohydrate1105 5 лет назад

Очень интересное видео, пожалуй подпишусь

@stas2040 5 лет назад

Безжалостное, хладнокровное убийство мирнопасущегося орка?!! Общество защиты орков возмущено и глубоко скорбит!!!

@griwopr6015 3 года назад

хахахахаххаха

@PenzaSaratov 2 года назад

Вот я тоже не понял, чего вредного в орке было? Он даже траву не притоптал

@toshadrakosha8141 5 лет назад

Теперь вам нужно все снять в подробностях)Очень интересно

@HOME-nx8mn 5 лет назад

Русская девушка фуллстек разработчик вебгеймдева, теперь я видел все!!!!

@user-hi6fo1ky8k 5 лет назад

@@HOME-nx8mn да какая разница, щас бы срач устраивать по поводу фуллстек или фуллстак, 2 псевдоинтеллектуала

@HOME-nx8mn 5 лет назад

@@user-hi6fo1ky8k ты и он - 2 псевдоинтеллектуала

@HOME-nx8mn 5 лет назад

@@user-hi6fo1ky8k я никого не оскорблял. Начинать не советую.

@user-hi6fo1ky8k 5 лет назад

@@HOME-nx8mn сразу школьника агрессивного видно, все понятно..

@ddd7386 5 лет назад

@@HOME-nx8mn я тебя удиалю, но в слове stack a произноситься ближе к aa (две а), чем э.

@elinaomurkulova3213 5 лет назад

Спасибо за познавательное видео) теперь будем чем занять мозг

@user-fv4om9un3x 5 лет назад

Привет, это потрясающе!

@Nix_46 5 лет назад

Красиво сделала видео) не нудное как у парней) прям будто рядом с тобой сидел составлял всё) заставила и меня это пережить)) прикольно)

@Meinerdi 3 года назад

Это просто нереально круто!

@user-bl9wx1qy8x 5 лет назад

Когда-то меня учили писать код как раз на простеньких игрушках. Это наверно был самый правильный подход к обучению. Именно благодаря тем урокам меня иногда тянет написать какую-то программку, хотя это и не связанно напрямую с моей работой.

@user-sv5zr2it9b 5 лет назад

У тебя очень круто получается, как то все акуратно и простенько. Я сейчас только перехожу на JavaScript, и твои видео очень мотивируют создать что то свое. Не знаю будет ли что то получатся или нет, но есть большое желание попробовать. Спасибо тебе за такие видео, удачи тебе)

@davidarsenyan1425 5 лет назад

А не скажешь как ты учишся javascript всмысле какие то курсы, видео или сайты?

@arleenlasleur 5 лет назад

@@davidarsenyan1425 На w3schools неплохо написано и можно попробовать (есть онлайн тренажёр), но только на англ всё.

@MrTurkish1988 5 лет назад

@@arleenlasleur кодить не зная языка-исходника... это со словарём сидеть постоянно?

@vitali.graphic 2 года назад

Как результат?

@bitcoin4ever864 5 лет назад

ты крутая, держи лайк и подписку! Продолжай в том же духе!

@alexariy3878 5 лет назад

красивая девушка! прекрасно, что увлекается таким делом. успехов в развитии и достижении своих целей. С наступающими!

@user-xb9ux2ed7m 5 лет назад

Клааасс! Я теперь тоже хочу создать платформер :3

@frogwarg 4 года назад

Круто, что вы показываете сам процесс. Многие програмиисты-ютуберы делают что-то, не показывая, и не понятно, что вообще происходит, и как это работает. Но вы молодец. Все получилось очень круто!

@user-eq1bl3xt5c 5 лет назад

Ммм необычный контент, понравилось пожалуй подпишусь )

@MsGrooveOn 5 лет назад

Какая молодец)

@SmkaShka 5 лет назад

Оч классно, я как человек занимающийся веб проектированием, ставлю здоровенный царский лайк. Оч круто

@ennuy3use483 5 лет назад

Наконец-то хоть что-то интересное

@vladimirzhulin 5 лет назад

Лайк и подписка не глядя))

@AOBykov 5 лет назад

Молодец! Круто!

@demuzinc.2420 5 лет назад

Потрясающе!

@manul74 5 лет назад

Великолепно!!!

@user-mw4og6kb2o 5 лет назад

Прикольно!)👍😉

@romansharpe1131 5 лет назад

Отличное видео)

@tonynice3007 5 лет назад

Мля, как же лампово

@construct2-796 5 лет назад

Годно, ты молодец! Настоящий, инди-разработчик))

@user-oz3wx9uk7b 5 лет назад

очень понравилось видео!)

@anton5988 5 лет назад

Тебе тёлочка понравилась

@paljm345 3 года назад

Хоорооошшшш)))) Оч кпуто получилось... Продолжай

@hikaro_top 5 лет назад

Что сказать, круто)

@gigaevil132 5 лет назад

Спасибо за видео! Хотелось бы объяснений что зачем и почему

@cerdek9190 5 лет назад

Просто офигительно

@arttur1672 5 лет назад

Ты просто огонь!

@nikolasivanov6337 5 лет назад

Кристина, ты невероятная, умничка.++++

@OleksiiBZ 5 лет назад

Молодчинка, лёгкий формат )

@S0A0W0 5 лет назад

Я пойду плакать, обняв себя за колени. Вы молодец

@ecl1pse101 5 лет назад

ты крутая, первый раз зашел на твой канал и сразу лайк, такая умная и красивая, удачи в новых проектах)

@BoomBitGang 5 лет назад

Что сказать очень интересно )

@phir9255 5 лет назад

Мне понравилось запись звуков из подручных предметов. Я знаю, что это довольно нормально, но всё же по моему гениально.

@philmirez 5 лет назад

I love the RU-vid algorithm. The only language in this video that I understand is JavaScript and the algorithm knew that was enough to suggest it to me. Thank you for sharing your workflow.