Практика 3 - Анимационная игра на JavaScript

14 февр. 2023 г. Запись вебинара о создании анимационной игры на JavaScript. Рассматриваются следующие вопросы: Как создать игру на JavaScript с интересной физикой и механикой "искусственного интеллекта". Что делает игру отличной? Речь идет о красивых, отточенных визуальных эффектах или о приятном и отзывчивом игровом процессе? Речь идет об уникальных идеях, или, может быть, дело в мелких деталях, особых секретах и пасхальных яйцах? Какие ингредиенты входят в идеальный рецепт разработки игр? Давайте исследуем тему фэнтезийного грибного леса и изучим все приемы, необходимые для создания собственных 2D-игр с использованием vanilla JavaScript, HTML5, CSS3 и HTML Canvas. Все изображения проекта: https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbmlTSnFnT3c3dW92S0FielYybm1TX3dTdUc3Z3xBQ3Jtc0ttb0lNX3dSQ3dsakRJY2NRZm54eE53Rm1WcHhGV3RDOFI5RjR0aUhrWDZfaEc4MHZCQUZuaEpwNjFBSUZsTUZIYldpY2pETU8xMllyMERiZklCcGUtNTI4d1VOTzMzTWpKdDltQjRRMzVJQll3RktpRQ&q=https%3A%2F%2Fwww.frankslaboratory.co.uk%2Fdownloads%2F109%2Fall_project_images.zip&v=U34l-Xz5ynU Предыстория: https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbHBMZDJVQ1ZhS1daNmpVTU9CcUozaGVwNWphQXxBQ3Jtc0trMGRyb0w3REY1SXRIOWhiS1RKcG9tSGRQRjBKdW4zdXlFS3k2YzRuUHJETEltRFRvMFFHZHRCTHZIdVlGRUZ0VTl3LXgxWUI0SEFSOHdVWjFLaC1uVVFMOVhwQ0lMaTZPLWtaalJlMmZYdkpXbjBMUQ&q=https%3A%2F%2Fwww.frankslaboratory.co.uk%2Fdownloads%2F109%2Fbackground.png&v=U34l-Xz5ynU Наложение: https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbXRjYnd5STFMZzYxRE90dmxvWkViNTBhNktLZ3xBQ3Jtc0tteXo1cjRyUGhhNkcwcy1URzFPcWVWS2RyV0l1YUFVanByT2hERzdINUpTOGliakNOaHpGb21GV09xUTR3QkkweG1PV09Bam1YRFlwOWIxTHk3THlkM3RINmhwUk1ZUXhOY0U3dXVvYUthbUt0VTROUQ&q=https%3A%2F%2Fwww.frankslaboratory.co.uk%2Fdownloads%2F109%2Foverlay.png&v=U34l-Xz5ynU Игрок: https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbGVna0pCeGNSLUtFX1RpU0hZU1NTZFJhLUp3d3xBQ3Jtc0tuaFVqUEdvZkJUT3NJVFJ3RTdqbUswSnV5Uk0wMnVWQlo5MS15dTVIaFhETXN3RGs2Tk1JWDJTVmJHSEFaNzhvM2Z5clhSRHJVbF9RbkVveFZfaV9qSmpTeU51NjloMkNhcDFMdzFHV3luUG9odnMzWQ&q=https%3A%2F%2Fwww.frankslaboratory.co.uk%2Fdownloads%2F109%2Fbull.png&v=U34l-Xz5ynU Яйцо: https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbHhzbnVaZlp3VXV4OXVHS2FHQzBXNUtmU0RPQXxBQ3Jtc0tsbUlxSEcxQWVkLUJRTEI1WVJVZDE5amx3Z09mNVJiaDQzUl9xV1hkM1JQS3Fvd0pNbzJVd0N2UnNHUC1Ca2tEbTF5SEJUMzQ0ZGNyeHB5cjE1Q0syaWswdHZiS3llTkNnSlRWTFpUV293cWVBN0c0TQ&q=https%3A%2F%2Fwww.frankslaboratory.co.uk%2Fdownloads%2F109%2Fegg.png&v=U34l-Xz5ynU Одиночная жаба: https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbnZ6VlliS3V2WkhKN2FYdHdpQjRVQnI0M3JRUXxBQ3Jtc0tsV0kxbUppMFRBMXdzaUN3b1V5eUpRM2g2VEpVU3ZRbXRFUDBRRkRUZzRZRmtkSTlxeEUyMHdtS3BwcWV6RndTQTdBanlSaW53Nk5JT05KWDE3OUxCNzJPdzc3d0xSQ29QOVp2TXVoNXNyTDdHT01raw&q=https%3A%2F%2Fwww.frankslaboratory.co.uk%2Fdownloads%2F109%2Ftoad.png&v=U34l-Xz5ynU Личинка: https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbXNNWjNpMllQdENOczRSeTNtS0ZDWFhXQlpnd3xBQ3Jtc0tra241aTZuNjJ0VEs3bkxneUl4TmhjNnNmWHJoZnVQaXZUc0FrLWZCLTVqWDZiRDdQWEtxSzJFRFRCUlNwTmtoU3VnaWZKV1JTeWVZeDFieUp6aVhlX0ZsQlR3akNHcHV0dlVzWWYzMW1NVW1CLTVCUQ&q=https%3A%2F%2Fwww.frankslaboratory.co.uk%2Fdownloads%2F109%2Flarva.png&v=U34l-Xz5ynU Жабы: https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbHdNamU3VVNxbVd1Vk16QWpYWmh3ei15MDRzUXxBQ3Jtc0tsVUNqR2JnZmVUYmFoZ2VCNnlNY2pRT0N1OWtXaFo3Xzh6VzJHa0JKY1J2TE4zWTM3SnFOSmRZVTFQY29wMmQ1MFlJMHB1N0RWRjU0eTR6ZFc3SlNXNW5tazdocFVtVDR4ai1tdzB5MjRsaUlnVDhxWQ&q=https%3A%2F%2Fwww.frankslaboratory.co.uk%2Fdownloads%2F109%2Ftoads.png&v=U34l-Xz5ynU Вы узнаете: - Как реализовать очень простой искусственный интеллект, чтобы существа чувствовали себя живыми - Как контролировать частоту кадров в секунду в нашей игре и как измерять время для запуска периодических событий - Как перезапустить игру, нажав кнопку - Как применять обнаружение столкновений, разрешать коллизии и использовать это для имитации физики - Как использовать встроенный метод drawImage для рисования рандомизированных игровых сред и анимированных персонажей с листа спрайтов - Как зафиксировать положение мыши и анимировать 8-направленный лист спрайтов на основе относительного положения мыши и персонажа игрока - Как использовать HTML5, CSS3 и обычный vanilla JavaScript для создания игры с нуля. Мы напишем и поймем каждую строку кода, мы не будем полагаться ни на какие внешние фреймворки или библиотеки ... и многое другое