Хитри - блог о хитростях разработки флэш-игр, игровых баннеров и флэш-анимации

Сделали новогоднюю флэш-игру для “Лаборатории Касперского”.
Последнее время, тема финансового кризиса не исчезает с первых страниц новостных изданий, поэтому название для игры выбрано актуальное - Вирусный кризис.

Игрушка не требует глубоких размышлений - это шутер. Зато вам понадобятся быстрая реакция и чувство юмора. Ваша задача - защитить сервер от стаи вирусов. В начале, у вас (якобы) слабая защита и возможности ограничены, но как только станет горячо, вам предложат установить более крутой антивирус, с которым вы получите ряд преимуществ: регулярные обновления и дополнительное оружие. Смысл игры - продержаться как можно дольше и набрать побольше очков.

Это моя первая действующая игра на AS3. Не могу передать всех эмоций которые переполняли меня, когда я переносил свои наработки на 3-ю версию скрипта, но вспомнил я всех, особенно когда знакомился со сборщиком мусора.

Надеюсь игра вам понравится, мы старались сделать её весёлой.

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

Этот способ лучше всего подходит для сильного ветра и он очень простой. Основная идея в том, что на быстрой скорости мы успеваем заметить только мелькание мимо нас неоднородных масс воздуха. Если отбросить всё лишнее и перенести это на флэшовый таймлайн, то получится мигающая анимация в два кадра - в одном есть что-то (облако, пыль…), во втором уже нет. У нас будет белый прямоугольник (якобы облака) растянутый на всю флэшку.

Таким же образом можно передавать и фоновую скорость, например, мелькание воздуха за иллюминаторами самолёта. Нужно ускорить персонажа? - Заставьте фон двигаться быстрее. Читать полностью »

Моя презентация на FlashGamm в Киеве.
Организаторы обещали выложить у себя на сайте видео, так что детально пересказывать нет смысла, остановлюсь на основных моментах:

Использование флэш-игр в рекламе

Основной смысл - как сделать из flash-игры рекламный продукт.

Для flash-игры TilePaving использовалась одна маленькая, но полезная хитрость. Никакой изометрии в программном понимании там и в помине нет. Все расчёты для плиток производятся в привычных координатах _x и _y. А интересный ракурс создаётся благодаря двум простым действиям: повернуть символ на 45 градусов (всю игру целиком), а потом сплющить её по вертикали на 50%. Сжать повёрнутый символ во флэше не так-то просто - маркеры трансформации помнят угол поворота и сохраняют возможность растяжения/сжатия по осям самого клипа. Чтобы обойти этот момент, нужно символ временно сгруппировать (Ctrl + g), сжать по высоте и затем разгруппировать (Ctrl + b).

Читать полностью »

Первая моя игра, которая нашла своего спонсора в лице UGOPlayer через сайт FGL.

Цель игры - перевести заданные плитки в положения, указанные на мини-карте. Поиграть можно на сайте спонсора (там много рекламы) или под катом. Читать полностью »

Это продолжение предыдущего поста о простом движке для flash-игр. Тогда, в самом конце возникла мысль уйти от метода hitTest() и перейти на пиксельный просчёт. И чтобы сравнить оба способа и выбрать лучший вариант, сделал небольшой визуальный тест.

Кстати, в тот раз я написал не совсем правильный код. Команда break не выводила процесс из вложенного цикла и бессмысленно терялось много процессорных ресурсов. Странно, но никто по этому поводу не отписался. Значит либо все “внимательно” читают и пробуют, либо верят на слово
Этот баг я поправил. Дальше по слайдам: Читать полностью »

Давно я не писал новых статей. На то есть много причин, главные из которых - отпуск и новая флеш-игра (как найдётся спонсор, выставлю её на обозрение). Блог не умер и не собирался умирать, новые материалы будут публиковаться по мере появления свободного времени. Многие вещи у меня лежат в полуготовом состоянии и дорабатываются до состояния “интересно” - раньше выкладывать нет смысла.

Ближе к теме. Есть множество flash-игр, в которых пользователь видит уровень как-бы с высоты птичьего полета - сверху. Одна из основных задач, с которыми сталкивается разработчик в таких играх - программно организовать проходимые зоны и препятствия.

Возьмём для примера простой случай - лабиринт. Персонаж может перемещаться по коридорам, но не должен проходить сквозь стены. Эту задачу можно решить по-разному, но чаще всего я встречал такие решения:

1. Блочное решение. Карта разбивается на кубики и у каждого стенки задаются как свойства “left”, “right”, “top” и “bottom”. Если объект вошёл в кубик, он свободно может по нему перемещаться. Перейти в соседний можно только если смежные грани не имеют стенок. Для оптимизации можно количество стенок уменьшить в 2 раза оставив только “left” и “top”. Две остальные сработают у соседних кубиков.
2. Реализовать физический движок с нулевой гравитацией.

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

Большую часть работы выполняет старая добрая функция hitTest(). Для неё рисуется зона проходимости и персонаж может перемещаться только в её пределах. Если на карте есть горы, стены, водоёмы, дома - эти области просто не закрашиваются.

Пойдём от простого к сложному. Читать полностью »

Недавно я говорил, что обзавелся собственным игровым баннером. Теперь хочу рассказать, как я делаю подобные штуки.

Некоторые приемы уже были описаны ранее в статьях. Из нового здесь только такое физическое явление, как гравитация (новое на сайте).  Можно было выкрутиться и сделать подпрыгивание бутылок анимацией, но мне захотелось внести больше разнообразия - пусть подпрыгивают на разную высоту, крутятся с разной скоростью, по разному в стороны разлетаются. Тем более, что сделать это программно совсем не сложно.

В нашем случае удобно хранить скорость в разложенном по осям виде. То есть не величина и угол поворота (как в управлении автомобилем), а в виде speedX и speedY. Далее каждую составляющую мы будем прибавлять к соответствующей координате (отрицательные значения смещают в другую сторону).

При равномерном движении можно просто прибавлять к координате число. Но введение понятия “Скорость” позволяет организовать замедление и ускорение.

Осталось разобраться с гравитацией. Это сила, которая с постоянной величиной действует вертикально вниз на все объекты (в программировании обычно на все незакрепленные объекты). То есть постоянно (по событию enterFrame) прибавляет какое-то значение к скорости (переменной speedY). Почему именно к скорости? Потому что к координатам применяется уже суммарный вектор всех сил (у нас пока только скорость и гравитация). Поэтому вначале применяем гравитацию к скорости, а потом скорость к координатам. Надеюсь, не намудрил.

Теперь по порядку: Читать полностью »

Совсем недавно мы общались с dedом pb|xto на тему: “Какими должны быть игры”. Что программисты делают виртуозные и играбельные движки, где геймплей строится на ловкости и быстром реагировании, а аниматоры “выезжают” на прикольных персонажах, качественной анимации и спецэффектах. И хотя я сторонник того, чтобы аниматоры начали программировать, а программисты рисовать, все же у каждого есть свой конек, с помощью которого можно делать самодостаточные игры.

И вот, удачный пример аниматорской игрушки - Mr. Coo: El Laberinto Esférico

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

Все действия происходят в воображении главного героя и с каждым новым воплощением раскрывают новый сюжет. Я просидел над ней несколько часов, прежде чем все исследовал (и то, не уверен, что все). В начале игры вам предлагают выбрать из нескольких предметов один. В решающий момент он определит вашу дальнейшую судьбу. Отсюда и большое количество вариантов. Самым неожиданным для меня оказалось прокатиться на гигантском цыпленке.

Одна из лучших игр в этом жанре.

Это продолжение дорожных приключений. Тогда попросили сделать вариант с прицепом. Я понимаю желание сделать “побырику” flash-игру типа “Парковка” имея под рукой готовый код, поэтому дальше описан пример как это сделать. И не один прицеп, а целый поезд.

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

В жизни, на колеса действует множество сил, и машина с прицепом - сложная система для расчетов. На решение такой задачи может претендовать какой-нибуть физический движок. У меня же нет точных расчетов и все что можно - имитируется. Поэтому, если ваш вариант будет вести себя не совсем корректно, некоторые параметры нужно будет изменить по ситуации. Я не часто вижу как ездят автомобили с прицепом, поэтому все настраивал интуитивно. Прошу оценить реализм

От предыдущего примера код почти не отличается. Добавилось несколько новых клипов и одна функция в коде. Читать полностью »