Первая страница

GDevelop

игровой конструктор
Онлайн: РИСОВАЛКИ | ИГРЫ | РЕЛАКС программы

О программе

GDevelop — это относительно мощный и удобный конструктор для разработки 2D и 3D игр, предназначенный как для начинающих, так и для опытных разработчиков. Эта платформа с открытым исходным кодом, запущенная Флорианом Ривалом, позволяет создателям воплощать свои игровые идеи в жизнь без необходимости обширных знаний в области программирования. GDevelop отличается своей универсальностью, поддерживая создание широкого спектра игр, от платформеров до сложных симуляций с учетом физики.

GDevelop / интерфейс

Что отличает GDevelop от большинства движков, так это его интерфейс визуального программирования, который позволяет разработчикам создавать игры с помощью системы событий. Такая доступность делает его отличным выбором для новичков в разработке игр, предлагая интуитивно понятную и увлекательную точку входа в мир создания интерактивных приложений. Однако, программа удовлетворит также опытных разработчиков, позволив им использовать JavaScript для создания более сложных сценариев.

Конструктор может похвастаться множеством встроенных функций, в том числе надежным редактором сцен, анимацией спрайтов и физическим движком, которые способствуют плавному процессу разработки. Кроме того, GDevelop поддерживает несколько платформ, что позволяет разработчикам экспортировать свои творения в различные операционные системы, включая Windows, macOS, Linux, Android, iOS и HTML5 для исполнения в вебе через браузер.

Среда разработки GDevelop функционирует как в вебе, так и в виде приложения для ПК и мобильных устройств. Есть русификация.

Общий процесс разработки игры

Создание игры в GDevelop включает в себя несколько ключевых шагов: от концептуализации до экспорта конечного продукта. Вот общий обзор процесса:

  1. Установка GDevelop: Начните с загрузки и установки GDevelop с официального сайта или разархируйте портабельный пакет.
  2. Создание нового проекта: Откройте GDevelop и начните новый проект (слева выберите Build и потом нажмите синюю кнопку [Create Project]). Выберите шаблон или начните с пустого проекта, исходя из концепции вашей игры.
  3. Создание сцены и объектов: Создавайте игровые сцены с помощью редактора сцен. Это включает в себя добавление и размещение объектов, определение фона и настройку общего макета.
  4. Поведение объекта: Определите поведение игровых объектов, используя интуитивно понятную систему Поведений. Это, другими словами, суперспособности объекта. Например симуляцуия физических свойств, умение двигаться по нажатию клавиш...
  5. События и действия: Создавайте события, которые реагируют на действия игрока, столкновения или другие триггеры. Работа с событиями и действиями происходит на закладке <Имя_проекта> (Events). Совет: удалите первое предустановленное событие с действием Display an authentication banner, чтобы не было проблем со звуком. Прикрепите к этим событиям действия, чтобы определить, что произойдет в игре после наступления события. Система событий GDevelop использует визуальный подход к программированию, управляемый событиями, что делает ее доступной для пользователей без обширного опыта программирования. Не надо писать код.
  6. Графика и анимация: Импортируйте и интегрируйте графику, спрайты и анимацию для персонажей и объектов. GDevelop поддерживает различные форматы файлов изображений и анимации.
  7. Звук и музыка: Улучшите свою игру, добавив звуковые эффекты и фоновую музыку. Позволяет вам легко включать аудиофайлы в ваш проект.
  8. Тестирование: Регулярно тестируйте свою игру, чтобы выявлять и исправлять ошибки. Используйте встроенную функцию предварительного просмотра, чтобы увидеть, как ваша игра ведет себя в режиме реального времени.
  9. Оптимизация: Оптимизируйте свою игру для повышения производительности. GDevelop предоставляет функции для эффективного управления ресурсами, обеспечивая плавный игровой процесс.
  10. Экспорт: Если вы удовлетворены своей игрой экспортируйте ее на целевые платформы. GDevelop поддерживает экспорт на различные платформы, включая Windows, macOS, Linux, Android, iOS и веб-сервера.
  11. Распределение: Распространяйте свою игру через соответствующие каналы, такие как магазины приложений, веб-сайты или другие платформы, в зависимости от выбранных вами настроек экспорта.
  12. Сообщество и поддержка: Взаимодействуйте с сообществом GDevelop, участвуйте в форумах и при необходимости обращайтесь за помощью.

3D в GDevelop 5

Объект 3D Box

Простой в обслуживании объект, позволяющий создавать игры на границе между 2D и 3D. Экземпляр этого объекта на сцене представляет собой параллелепипед. На 6 его граней можно запузырить 6 разных изображений. При перемещении камеры или самого объекта по сцене он видоизменяется согласно законам 3d-графики. Самым распространенным жанром для использования такого объекта является гонка на машинах по городу или, в общем, просто перемещение по городу с видом сверху, как с вертолета. Каждый высотный или не очень дом в 5-ти своих гранях виден как настоящий дом благодаря наложенным изображениям.

Плагин With ThreeJS

Самые продвинутые возможности 3D можно реализовать после подключения плагина With ThreeJS (ищи кнопку [Download now]) от PANDAKO. Скачивается простой JSON файл и устанавливается через меню: кнопка-гамбургер [☰] > Extensions > кнопка-плюс [+] > кнопка [Import extension]. После этого в событиях и действиях появляются опции от этого плагина. После установки плагина:

  1. На событие загрузки сцены поставить действие от этого плагина Create 3D Scene.
  2. Добавить объект типа Enable WithThreeJS (этого типа до плагина не было). Выносить этот объект на холст не надо.
  3. Создать пол из объекта типа Tiled Sprite и добавить ему поведение BoxProtectionFromTiled.
  4. Поднять объект-камеру над полом примерно на 20 с помощью Z-индекса.

Объект 3D Model

Больших успехов в деле создания 3d-игры можно достичь с помощью объекта 3D Model. И без вышеназванного плагина в него заложено много интересного из мира 3D. Однако, есть тонкости. Импортировать в этот объект можно только файл формата GLB. Файл может иметь встроенные именованные и нумерованные анимации. Есть неочевидные ходы, как эти анимации достать. Инструкция:

  1. GBL можно взять из магазина, который интегрирован в GDevelop, а можно самому cделать в Blockbench. Программа позволяет создавать низкополигональные 3d-модели и настраивать им именованные анимации.
  2. Из Blockbench модель с анимацией сохранить в GLB (пункт экспорта GLTF, и поменять GLTF на GLB).
  3. Потом импортировать GLB в GDevelop в объект 3D Model. В окне свойств этого объекта первоначально встроенные анимации могут быть не видны. Их надо добавить по синей кнопке [Add an animation]. ТУТ ВНИМАНИЕ: Нажмите на пустое поле "GLB animation name (Choose an animation)", чтобы увидеть список встроенных анимаций и выбрать нужную.
  4. Имена анимаций, пришедшие с файлом, не будут потом видны в Редакторе событий в действии добавления анимации. А по номеру анимации уже можно добавлять в Редакторе событий.
  5. Еще в окне импорта модели можно дать другие имена анимациям, чтобы эти имена стали видны в Редакторе событий в действии добавления анимации. За это новое имя анимации отвечает поле "Animation #0 (Optional animation name)".

НЮАНС 1: Одну и ту же анимацию не получается запустить два раза подряд. Между двумя одинаковыми анимациями должна обязательно вклиниться другая анимация, чтобы первую анимацию можно было выполнить второй раз, например по нажатию кнопки.
НЮАНС 2: При старте сцены первая (индекс 0) анимация запускается автоматически. Наверное, надо ей давать состояние покоя.

Функции в GDevelop 5

Функции в программировании помогают организовать и оптимизировать код. В функцию записывают часто выполняемые операции, особенно если это много строк и к тому же для разных объектов. Потом функцию можно вызвать одной строкой. Если для разных объектов следует делать что-то разное, поддающееся шаблонизации, то функцию можно вызывать с параметрами.

В GDevelop функции хранятся в расширениях и можно написать свое расширение. Не торопитесь, быть может, расширение позволяет пользователю редактировать свою функцию по кнопке [Edit this action events] – тогда просто ее модернизируйте. Например, у объекта-кнопки есть простая функция, которая меняет текст кнопки. Она до безобразия простая и состоит из одного действия: Change the text of Labels: set to {Value}. Но после изменения текста ширина кнопки оставалась прежней. Я добавил одно действие: Change the width of {Object}: set to StrLength(Object.LabelText())*30. И у меня ширина кнопки стала меняться автоматически согласно длине текста. Здесь в фигурных кавычках – плейсхолдеры параметров функции. Кстати, вместо 30 можно было тоже поставить свой параметр-плейсхолдер, чтобы пользователь сам задавал ширину символа.

Чтобы создать свое личное расширение надо по кнопке-гамбургеру [☰] открыть меню проекта и напротив Extentions кликнуть [+]. На закладке нового расширения есть раздел Functions – по [+] добавить. Справа будет панель свойств выбранной фунции, по центру – Редактор событий. При необходимости использовать типизированные параметры воспользуйтесь для их добавления синей кнопкой [Add a parameter] внизу справа. Параметры имеют два разных вида плейсхолдеров: 1) в строке "Parameter#1" – эти пишутся в Редакторе событий функции, а на их месте в Редакторе событий сцены при добавлении действия пользователь подставляет что-то конкретное; 2) эти пишутся в поле "Sentence in Events Sheets", а их значения отображаются в Редакторе событий сцены для информации.

Даю композиционный скриншот с визуальным отражением того, что я только что написал. Если вы в нем разберетесь, то разберетесь в структуре функций.

GDevelop – расширение – функция

Некоторые лайфхаки

Закончил свой первый проект в GDevelop, в процессе которого возникали некоторые затруднения, которые преодолевал. Записывал решения проблем и в этом разделе их изложу, чтобы самому не забыть.

Локальный просмотр. Экспортированный локально в HTML5 проект по умолчанию в браузере не запускается по причине правил безопасности JavaScript. Чтобы все-таки смотреть:

  • FireFox: внесите изменения в настройках – зайдите через поле адреса about:config, найдите параметр security.fileuri.strict_origin_policy, измените значение на false.
  • Google Chrome: надо выполнить команду в консоли ОС: chrome --allow-file-access-from-files для запуска Хрома (если у вас портабельная версия, то вместо chrome напишите путь к исполняемому файлу).

Заменить лого GDevelop при старте игры в браузере. 1) Кнопка [☰] > пункт Properties & icons > закладка Branding and Loading screen > cнять флажок Display GDevelop watermark after the game. Это мы сняли брендирование в нижнем левом углу страницы загрузки игры. 2) Осталось центральное лого. На закладке есть флажок Display GDevelop logo at startup, но в бесплатной версии он не снимается. Тогда: в папке экспорта заменить в файле splash\gd-logo-light.js код base64 на свой, т.е. свою картинку сначала конвертировать в base64 и заменить им аналогичный код в этом файле.

Разовое исполнение действия. Ставь условие Trigger once вместе с условием, которое протяженное во времени, а вам нужно, чтобы после наступления этого условия действие происходило только один раз. Пример: Объект_1 должен произносить "Привет" при столкновении с Объектом_2. Если Trigger once не поставить рядом с событием Collision, то "Привет" будет звучать все время пока объекты соприкасаются.

Разные типы нажатия кнопок: Key is pressed – действие повторяется каждый тик пока нажата кнопка, Key is released – действие исполняется 1 раз после нажатия.

Свой шрифт на кнопке. Добавить кнопку. Сохранить и закрыть проект. В папке assets заменить шрифт *.ttf, поставляемый с этой кнопкой, на другой с тем же именем.

Обращаться к инстансу объекта. Важное дело – идентифицировать одну из копий объекта, чтобы именно над одним этим экземпляром произвести какое-то действие. Есть способы. Возьмем объект спрайта с несколькими анимациями. Чтобы определить, по какому из них произведен клик, надо написать условие клика на объект и тут же написать условие наличия анимации (по имени или по номеру) у объекта.
Также можно вместо анимации идентифицировать инстанс по значению переменной объекта. Т.е., объекту завести переменную, а инстансам задать оригинальные значения этой переменной.
Такой фокус можно проделать с группой объектов. Объединить объекты (не инстансы) в группу. Группе задать переменную. Каждому члену группы дать оригинальное значение этой переменной. Теперь можно обращаться к члену группы по значению переменной, т.е. написать условие, что переменная равна такому-то значению.

Мышь на объекте и вне объекта. Если нужны для этих двух условий разные действия. Имеет значение последовательность условий – сначала идет условие "не на объекте", а потом "на объекте".

Подключать другие Редакторы событий. Чтобы не плодить длиннющее полотно событий в одном месте можно: открыть меню по кнопке-бургеру > Нажать [+] напротив External events > откроется новый Редактор событий – его заполнить > перейти в главный Редактор событий > ПКМ на событии, после кот. надо вставить код из нового Редактора событий > Link external events. Это приятное дополнение к группировке событий, которая также помогает структурировать "код".

Логический оператор ИЛИ. Когда вы пишите в одном событии несколько условий, то они выполняются по оператору И. А как же быть с ИЛИ? Чтобы сделать ИЛИ надо добавить родительское условие OR и задать ему sub-conditions (подусловия, они идут с правым отступом), которые и будут восприниматься как ИЛИ.

Удалить непослушный инстант. Иногда при дерганьи мышки дублируется инстанс объекта на сцене. Иногда его очень трудно или невозможно удалить. Как: запомни оригинальные параметры инстанса, например, X и Y. Закрой прогу. В текстовом редакторе открой json-файл проекта. Найди блок с этим инстансом и удали его.

Скачать, почитать, посмотреть

📥 Скачать GDevelop с сайта производителя. Версии для Windows, Linux, macOS и мобильных устройств.
📥 Веб-версия GDevelop на сайте производителя.

📗 Руководство пользователя GDevelop online, на английском, в Wiki формате.

📺 Введение в GDevelop на английском.
📺 Знакомство с интерфейсом GDevelop с русским переводом.
📺 Часовой обзор GDevelop на русском. См. видео с пятой минуты!


Ещё конструкторы игр, викторин и приложений вообще для веба:
ActivePresenter – для интерактивных анимационных презентаций, тестов и скринкастов
Articulate Storyline – конструирование онлайновых презентаций, викторин и обучающих курсов
Cables.gl – сервис для разработки различного рода веб-визуализаций
Clickteam Fusion – конструктор 2D-игр под различные платформы
Construct 2 – игровой движок для создания 2D-игр и публикации их в HTML5
Google Web Designer – конструктор HTML5 баннеров и приложений
Hippani Animator – удобная анимационная студия с экспортом в HTML, video, анимированный gif
Saola Animate – программа для быстрого и удобного создания анимации в HTML5
Scratch – визуальный язык программирования и редактор кода
Stencyl – игровой движок для создания 2D-игр и публикации их в веб
TurboWarp – продвинутый форк Scratch для создания HTML5 игр и приложений
WYSIWYG Web Builder – мощный визуальный конструктор сайтов
Большой список игровых движков – с информацией об используемых языках программирования и возможностях экспорта
Новости
От рекламы не скрыться
Нейросеть в помощь
домой | живопись | графика | компьютерная графика | поделки | юные художники | темы | комментарии | перлы
конкурсы | игры | релакс | рисовалки | учиться рисовать | детские карты Москвы | детские стихи | статьи | видео | поиск | обратная связь
Поделки - видеоуроки от специалистов