Куда применить физику — Crayon Physics Deluxe

Действительно, физических движков на сегодня реализовано немало, даже 3-х мерных хватает, а вот найти им достойное применение получается не у всех. Игра Crayon Physics Deluxe — как раз тот случай, когда игровой момент составляет сама физика движка. Deluxe — это сиквел на игру Crayon Physics и пока еще в стадии разработки, но из ролика понятно, что она уже сегодня серьезно обогнала своего предшественника, а если еще и уровней побольше сделать, э-эх!

Реализовано, как я понял, не на флэше, но не вижу причин, почему бы это не исправить. Используется Box2D physics engine.

Циклическая анимация фона — Часть третья, или делаем игровой баннер

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

Чтобы мне не переделывать работу заново, а у вас была возможность проверить как все это применять на практике, за основу я возьму результат второй части программной анимации фона. Добавлю к этому препятствия, бонусы, индикаторы, немного Actionscript и получу самый настоящий игровой баннер, вот такой:

[kml_flashembed movie="http://xitri.com/wp-content/uploads/2008/04/bgpart3.swf" height="200" width="550" /]

Сценарии и gameplay как для flash-игр, так и для баннеров могут быть самые разнообразные. Я выбрал для примера классический: есть объекты, которых нужно избегать и которые наоборот необходимо собирать. Если нет такой «борьбы противоположностей», то обычно и играть не интересно. Такой вот метод «кнута и пряника».

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

Пример и описание: Читать далее Циклическая анимация фона — Часть третья, или делаем игровой баннер

Урок классической покадровой анимации

Урок от Акимова Олега
Оказывается анимация не такая уж и страшная штука, если понимать что к чему.
Содержание привожу «как есть»:

Всем привет!

Хочу поделиться хитростями использования класической анимации во flash.

Начнем с теории. Загрузка процессора. Использование скриптов для создания спецэффектов для флеш роликов не всегда приводит к хорошим результатам. Часто это приводит к сильной загрузке центрального процессора, что в свою очередь замедляет работу ролика, приводит к снижению fps.

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

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

Итак, начнем с основ. Сначала нам нужно создать «ключевые кадры», они содержат главные фазы анимации — между которыми мы позже прорисуем промежуточные фазы.

[kml_flashembed movie="http://xitri.com/wp-content/uploads/2008/04/animefish_wave.swf" height="250" width="300" /] Читать далее Урок классической покадровой анимации

Сыграл — что радио послушал

Вначале даже не знал как к этому относиться. Сейчас меня это улыбает.

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

Циклическая анимация фона — Часть вторая

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

Каждый дубликат создается справа от экрана, проходит через всю флэшку и удаляется слева за ненадобностью (хотя можно попробовать возвращать в начальное положение).

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

Для удобства, я использую условные границы «Лево» и «Право». Эту роль играют 2 символа left и right, от которых мне нужны только координаты. Сами же они находятся за пределами флэшки. Таким образом легко можно сузить/расширить ширину фона (это полезно, когда создается группа баннеров с разными размерами).

[kml_flashembed movie="http://xitri.com/wp-content/uploads/2008/04/bgpart2.swf" height="200" width="550" /]

Порядок действий: Читать далее Циклическая анимация фона — Часть вторая

Интересная игра GROW nano vol.3

Нашел в сети сайт с интересными и достаточно оригинальными флэш-играми. Игры делают уже давно, а я о нем узнал только сейчас. Зацепился я за него через игру GROW nano vol.3. Простота идей поражает, а сюжет все равно затягивает — выбирая предметы в правильном порядке, нужно вылечить главного героя:

Grow nano vol3

Предыдущие волумы: vol0, vol1, vol2.
Еще одна интересная игра от них же. Я набрал 27,3 фута, дальше экран не позволяет :).

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

P.S. Идем по нарастающей, больше элементов — больше вариантов — GROW ISLAND

Alternativa3D 5.0 (сборка 1)

Проект «Альтернатива платформ» объявил о выпуске 5-й версии своего движка.
Ну и ладно, подумал я. Ну движок, очередная демка, да сколько их… Пока не посмотрел этот игровой уровень.
Впечатлило меня сильно и надолго, если такие возможности открываются перед разработчиками игр, то скоро грянет волна флэшовых Doom-ов и Warcraft-ов.

Циклическая анимация фона — Часть первая

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

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

Сама циклическая анимация создается по принципу «бесшовных текстур». Края фонового изображения при стыковке должны создавать неразрывную картинку.

Самый простой способ — сделать все твиннингом. Но при этом теряется контроль над скоростью анимации (доступны только stop() и play() ). Если персонаж обладает ускорением, нестыковки с фоном будут обязательно.

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

  1. Рисуем фон.
  2. Растягиваем его по размерам будущей флэшки, даже чуть больше. Если есть выступающие элементы, их нужно отрезать с одной стороны и перенести в другую (я так поступил с тенью от забора).
  3. Оборачиваем все это в клип, дублируем и переносим дубликат точно в конец оригинала. Это важно, иначе фон при анимации может дергаться. Кстати сейчас очень удобно доработать «бесшовность» — линии между клипами должны соединяться без изломов. Выделяем оба клипа и оборачиваем их в еще один клип.
  4. На этом символе пишем код:
    onClipEvent (load) {
    	speed = 4;//скорость
    	x0 = _x;//Запоминаем начальное положение
    	x9 = x0 - _width / 2;//максимально-допустимое левое положение
    	onEnterFrame = function() {
    		_x -= speed;
    		var dx = x9 - _x; //Вычисляем перебор
    		if (dx > 0) {
    			_x = x0 - dx;//Компенсируем его и возвращаем в начальное положение
    		}
    	}
    }

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

  5. Получаем зацикленную анимацию.
  6. Вот так, если добавить окружение и действующее лицо.
  7. Или вот так.
  8. Или так.

[kml_flashembed movie="http://xitri.com/wp-content/uploads/2008/04/bgpart1.swf" height="200" width="550" /]

Анимация сейчас привязана к переменной speed, которую можно менять по обстоятельствам.

Кому интересно, дальше о том, как анимируется мяч: Читать далее Циклическая анимация фона — Часть первая

Промежуточные кадры — кто меньше?

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

Условно выделю 2 способа — они немного похожи, но дают разные ощущения.

Смысл первого — в рисовании смазанного промежуточного положения, как будто предмет быстро движется, но его проекция не успевает исчезать с воздуха. Анимация при этом сглаживается, не вызывая раздражения. Проще будет, если нарисовать начальное и конечное положение, между ними вставить пустой кадр и включить режим Onion Skin Outlines . Если одного кадра недостаточно, можно нарисовать 2 или даже 3 (совсем роскошь). В примере ниже: в одну сторону — 1 кадр, обратно — 2:

[kml_flashembed movie="http://xitri.com/wp-content/uploads/2008/04/longinbetween.swf" height="200" width="200" /] Читать далее Промежуточные кадры — кто меньше?