Используем Construct 2 в большом проекте

31 декабря, 2014
3 минут(ы) чтения

Если контент не отображается, включите VPN.

534842 375441279157566 248422175 n
Scirra Construct 2

Construct 2 (далее просто C2) — один из лучших HTML5 игровых движков последних лет. Scirra развила идеи Construct Classic и перенесла их на веб-платформу.

Ликбез

Construct 2 представляет собой IDE на Windows позволяющий создавать видеоигры или насыщенные интерактивные веб-приложения различной степени сложности. C2 содержит богатый API, использующий CommonJS для создания собственных модулей. Подробнее об этом можно узнать на официальной документации. C2 не заточен под определенный игровой жанр, но делать шутеры с видом от первого лица не стоит, C2 создан для двухмерных игр! Но есть слухи, что умельцы из Scirra разрабатывают Construct 3, где будет возможность делать 3D также просто. В C2 вшит мощный физический движок Box2dWeb, а это значит что разрабатывать физические головоломки на C2 можно. Скомпилированное C2 приложение представляет собой HTML5 оболочку со встроенным Canvas. Изюминкой C2 можно считать возможность быстрого построения прототипов и легкое разворачивание на все популярные платформы. Поддерживаются Android/iOS/Windows/Linux.

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

Советы при написании Construct 2 игр

  1. Думайте мозгом и следите за памятью (графической и системной).
    Этот банальный совет постоянно надо напоминать всем разработчикам. На JavaScript есть сборщик мусора, но все еще нет ваших мозгов. Удаляйте объекты если они выходят за действующие границы экрана, а если это сделать нельзя — удаляйте обработчики/уменьшайте логику на объект и пр. 
  2. Не используйте сторонние плагины, если можно обойтись без них.
    Просто знайте, большинство плагинов на C2 сделаны энтузиастами которые давно забили на них. Это значит что в новых релизах продукта эти плагины могут перестать работать. Scirra сделала отличный открытый магазин игр, но не сделала такой же открытый репозиторий для плагинов.
  3. Переносите сложные алгоритмы в плагины или в поведение (behavior).
    Помните первый совет, C2 имеет хороший SDK, руководствуйтесь головой, писать код и тестить его проще вне C2 IDE.
  4. Используйте устоявшиеся ключевые слова при комментировании:
        ◦ TODO — кривой, но работающий код;
        ◦ FIXME — неправильно работающий код;
        ◦ HACK — код который работает с «магией»;
        ◦ XXX — недописанный код.
  5. Используйте общепринятый JavaScript стиль написания:
        ◦ ПРОПИСНЫМИ пишутся константы;
        ◦ 
    _подчеркнутыми пишут статические переменные;
        ◦ С_большой_буквы пишут динамические переменные.
  6. Помещайте модули в блоки, а блоки в события.
    В С2 нет возможности отключать модули, но можно отключить блок где внутри будет объявлен модуль или отключить блоки в случае их не использовании, например при переходе на другую сцену (Layout) отключать проверки на предметы, которых не будет на этой сцене.
  7. Не добавляйте лишних обработчиков.
    Правильной практикой является добавление обработчиков на объекты которых будет меньше в сцене. Например обработчик столкновения следует вешать на персонажа, а не на 150 предметов, которые будут окружать персонажа. 
  8. Оптимизируйте не только скорость выполнения, но и скорость чтения.
    Не брезгуйте добавлением ключевого слова «else» если оно стоит к месту. Также не стоит экономить на событиях, добавляя множество «or» в одно событие.
  9. Используйте объект Function, глобальные переменные и статические переменные с осторожностью.
    Используя функции можно достаточно легко избавиться от глобальных переменных, и улучшить структуру кода (делать проверки по return), но делать это надо аккуратнее, т.к. тестить объект Function сложнее.
  10. Снизьте количество «магических чисел« и переведите их в константы.
    Такой подход сохранит вам структурированность кода и поможет при чтении.
  11. Не добавляйте EverTick и похожие события (например от устройств ввода) внутрь циклов. 
    Добавленный EverTick сильно снижает скорость выполнения приложения.
  12. Явно приводите типы и самостоятельно округляйте цифры переводя их в целочисленный формат (Integer) когда можно обойтись без цифр с плавающей запятой.
    Такой формат сильно повысит риск не получения гейзенбага.
  13. Откажитесь от архитектуры со множеством таймеров.
    Использование таймеров хорошая идея если нужно оптимизировать столкновения, но лучше иметь не более 5-8 таймеров на всю игру. 
  14. Не добавляйте много переменных в объекты.
    Для визуального объекта выделяйте не более 5 внутренних переменных. Если их нужно больше, значит алгоритм следует пересмотреть и оптимизировать. 
  15. Не делайте очень быстрые анимации.
    Мобильные устройства будут довольны только медленным анимациям, пользователи довольны красивыми анимациями.
  16. Не бойтесь взять чужой велосипед и превратить его в ракету.
    Большинство плагинов открытые и лучше взять один из них, дополнить и оптимизировать, чем тратить время на самопис.
  17. Отключайте столкновения (collision) если в игровой логике они не будут существенны.
  18. Четко определите что является кадром (frame), а что анимацией.
    Переключение кадра выполняется быстрее, но стоит пожертвовать скоростью, но сохранить визуальное понимание. 
  19. Визуальных слоев не должно быть более 5-8.
    Когда-то разработчикам хватало всего 3-4 слоя чтобы создавать свои шедевры. Берите пример с них. Они то знали как сделать красиво на слабой «железке».
  20. Имейте совесть, сделать все качественно на Construct нельзя.
    На C2 можно делать большие проекты, но если C2 не справляется с задачами — поищите более мощные решения. HTML5 все еще очень молод, сделать World Of Warcraft на нем пока, к сожалению, нельзя. Будьте гибки, образованы и продолжайте думать своим мозгом.

Денис Сергеевич Басковский

Философ, изобретатель и поэт.

Подписаться
Уведомить о
guest
0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии
easeljs
Предыдущая статья

Проверил игровой фреймворк EaselJS

paper plane
Следующая статья

Исходный код Paper Plane