С помощью флеш можно создавать. Как создать новый файл (документ) во Flash CS6

Программа для создания флеш-игр без знания языков программирования. Позволяет создавать игры из логических блоков и заранее подготовленных изображений.

Когда-то, наверное, уже пару лет назад, на нашем сайте появилась программа Game Maker , которая позволяла делать игры практически без знания какого-либо языка программирования!

До сих пор данная страница у нас является одной из самых обсуждаемых, и часто в комментариях звучат сетования на то, что с ее помощью нельзя создавать игры, в которые можно было бы играть онлайн. Сегодня мы снова возвратимся к теме игростроения и рассмотрим аналогичную программу, которая-таки умеет делать флеш-игры - Stencyl !

Особенности программы

При помощи Stencyl можно создавать 2D-игры любых жанров, но больше всего движок программы «заточен» под различные стрелялки-бродилки. Структурно программа представляет собой целый комплекс инструментов, в котором можно, при желании, создать игру «с нуля» без использования сторонних приложений.

Закрываем всплывающее окошко с информацией о новой версии программы кнопкой «Close» или «Don’t show this again» (если не хотим видеть данное окошко при каждом запуске программы) и взамен него получаем следующее окно:

Здесь нам предлагают создать собственную учетную запись в сообществе разработчиков Stencyl. В принципе, аккаунт можно и не создавать (для этого жмем кнопку «Remind Me Later» внизу), но регистрация дает Вам возможность скачивать дополнительные шаблоны и действия с онлайн хранилища под названием StencylForge, поэтому не помешает:). Для заведения учетной записи нажимаем кнопку «Create an Account» и переходим к форме регистрации:

Здесь заполняем стандартные поля с вашим логином, паролем (два раза) и адресом электронной почты, после чего нажимаем кнопку «Sign Up». Если все пройдет удачно, то перед Вами наконец откроется интерфейс стартового окна программы.

Интерфейс стартового окна

Внешне рабочее пространство стартового окна Stencyl разделено на несколько зон:

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

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

  1. Открыть папку, в которой Stencyl хранит все ресурсы созданных игр и сами игры (кнопка «View Games Folder» в левом нижнем углу).
  2. Запустить обучающий курс по работе с программой («Start Crash Course» на зеленой панельке в правом нижнем углу). Кстати, там же рядом есть кнопка для скрытия предложения пройти обучение («Don’t show this again»).
  3. Открыть выделенную в данный момент игру из списка, что аналогично двойному клику по картинке игры («Open Game» в правом нижнем углу).

Для самостоятельного изучения возможностей Stencyl Вы можете пройти обучающий курс (и желательно бы его пройти), а также открыть одну из готовых игр, которая наиболее соответствует Вашей задумке, и посмотреть, как там все устроено. А я предлагаю изучить работу программы на примере создания игры о приключениях символа нашего сайта и его виртуального жителя - Фриды Бест!

С чего начать создание игры в Stencyl

Если Вы, перед тем как собрались создавать свою игру, посмотрели стандартные примеры игр на Stencyl, то могли заметить, что в основном все они довольно простые, одноэкранные и имеют вид сбоку. Мы же будем делать динамический шутер с видом сверху и стрельбой при помощи мышки! Все как в «больших» играх:).

Для своего проекта Вы можете изменить логику одного из готовых шаблонов, но мы не ищем простых путей и потому - только «с нуля», только «хардкор»:). Для этого нажмем на панели инструментов рабочей области (или в меню «File» - «Create New») кнопку «Create a New Game» и попадем в следующее окошко:

Здесь мы можем выбрать шаблон игры по жанру с уже подобранным заранее набором функций и действий для Вашего проекта. Однако мы будем создавать игру с чистого листа, поэтому выбираем пункт «Blank Game» и жмем кнопку «Next».

На следующем этапе нам потребуется произвести кое-какие базовые настройки:

В поле «Name» нам нужно указать название нашей игры, а в разделе «Screen Size» задать размеры игрового поля, указав его ширину (Width) и высоту (Height) в пикселях. После этого жмем кнопку «Create» и переходим непосредственно к интерфейсу редактора игр:

По умолчанию перед нами открывается вкладка «Dashboard», на которой слева собрано все дерево ресурсов игры, а справа находится непосредственно рабочая область. Здесь, думаю, уместно будет внести кое-какие пояснения по структуре «дерева».

Оно состоит из четырех веток, первые две из которых, содержат стандартные наборы ресурсов (RESOURCES) и логики (LOGIC), а две последние опционально могут хранить загруженные вручную ресурс-паки (RESOURCE PACKS) и расширения (EXTENSIONS).

Главной веткой здесь является ветка RESOURCES. Она содержит следующие разделы:

  1. Actor Types - здесь хранятся спрайты всех игровых персонажей и настраиваются действия их анимации и взаимодействия между собой.
  2. Backgrounds - в этом разделе у нас могут храниться все необходимые фоны для игры. Причем фон может быть, как для заднего плана (background), так и для переднего (foreground), что позволяет накладывать фоны друг на друга, достигая, например, тем самым эффекта параллакса .
  3. Fonts - раздел, в который мы можем загружать различные красивые шрифты для создания оригинальных надписей. Однако, стоит учесть, что Stencyl может работать только с английским набором символов, поэтому для добавления русских букв файл шрифта, нам нужно заменить ими какие-нибудь из латинских символов.
  4. Scenes - место для создания и редактирования уровней игры. Именно здесь мы можем задать внешний вид любого этапа и разместить всех персонажей, бонусы и другие игровые элементы.
  5. Sounds - соответственно хранилище всех звуков, использованных в игре.
  6. Tilesets - специальная ветка в которой хранятся тайлы - специальные спрайты, которые мы можем использовать для построения игровых уровней.

Создание и настройка тайлов

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

Создаем первую сцену - создаем персонажа - создаем врагов - создаем бонусы - создаем остальные этапы

Чтобы создать сцену в Stencyl нужно нарисовать ее внешний вид в ветке Scenes. Однако, для того, чтобы рисовать, нам нужно сначала иметь блоки, которыми можно «рисовать». Эти блоки в программе имеют название тайлов (tiles) и хранятся в разделе Tileset:

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

Для начала нам нужно создать новый набор тайлов (кнопка «Create New» в разделе Tilesets), после чего мы увидим окно, как на скриншоте выше. Для загрузки изображения нам нужно нажать кнопку «Choose Image» и выбрать в открывшемся окне Проводника заранее подготовленный файл с нужной картинкой (-ами).

Когда изображение загрузится, зададим ему параметры разбивки и размеры по ширине и высоте, после чего (если все правильно отображается) можно добавлять изображение в набор нажатием кнопки «Add».

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

В верхней части правой панели откроется раздел «Collision Bounds» (границы столкновений). Здесь мы можем выбрать произвольную форму, обозначающую границы взаимодействия нашего объекта с игровыми персонажами. По умолчанию у всех тайлов стоит параметр «Square» (квадрат), который делает тайл полностью непроходимым и твердым. Если же Вам нужно сделать тайл «прозрачным» для персонажей (например, пол), то достаточно задать параметр «No Collisions».

Помимо границ, для каждого тайла можно задать анимацию, добавив кадров при помощи кнопки «Insert Frames» на нижней панели. По умолчанию скорость анимации равняется 100 миллисекундам, однако для каждого кадра это число можно произвольно изменить.

Для этого достаточно дважды кликнуть по нужному кадру левой кнопкой мыши и в открывшемся окне изменить показатели задержки так, как нам того требуется. Также имеется возможность подкорректировать выбранный кадр при помощи встроенного графического редактора, который открывается кнопкой «Edit Frame».

Отрисовка сцены в Stencyl

После того, как набор тайлов сформирован, логично перейти к следующему шагу - формированию из добавленных изображений готового игрового пространства. Сделать это можно, нажав кнопку «Create New» в разделе Scenes. После нажатия кнопки мы попадем в окно настроек сцены:

Здесь нам обязательно нужно в поле «Name» задать уникальное название нашей сцене, указать размеры (ширина и высота в тайлах (по умолчанию) или пикселях), а также опционально (то есть, по собственному желнию) задать фоновой цвет для новой сцены. Жмем «Ok» и попадаем в редактор уровня:

С виду он напоминает графический редактор. По центру находится рабочая область, где мы и рисуем наш уровень. Слева и сверху находятся небольшие панели инструментов. Справа же расположились панели палитры, выбора наборов тайлов и управления слоями. Теперь, как все это работает…

Первым делом рисуем фон нашей рабочей области. Для этого на правой панели активируем вкладку «Palette» а на ней вкладку «Tiles» и выбираем нужный тайл из представленного перечня. Затем на левой панели выбираем инструмент «Карандаш» (Pencil) и рисуем выбранным тайлом нужные области.

За счет поддержки слоев, тайлы могут накладываться друг на друга, поэтому логичнее всего организовывать уровень с учетом того, что, например, на слое «Layer 0» у нас будет находиться фоновая подложка, выше, слой с препятствиями и персонажами, а еще выше - слой с различными счетчиками и игровыми индикаторами.

Управлять слоями можно при помощи кнопок под панелью «Layers». Здесь имеются кнопки для создания, удаления, перемещения и переименования слоев. Кроме того, любой слой можно скрыть или отобразить, нажав на кнопку в виде глаза справа от имени слоя.

Создание персонажей

После того, как у нас создана первая сцена настало время «заселить» ее различными игровыми персонажами. В Stencyl они зовутся «актерами» и хранятся, соответственно, в разделе «Actor Types». Создаются актеры по одному и тому же принципу, поэтому рассмотрим мы этот процесс на примере создания главной героини нашей игры - Фриды.

Чтобы добавить нового актера достаточно зайти в вышеупомянутый раздел Actor Types и нажать там кнопку «Create New». Нас уже привычно снова спросят о том, как мы хотим назвать новый игровой объект, после чего перед нами появится окно редактирования анимации персонажа:

Здесь в левой части выводится список добавленных анимаций актера (по умолчанию пустой кадр «Animation 0»), а в правой находятся инструменты добавления и настройки этих самых анимаций.

Выбираем пустую анимацию (или добавляем новую кликом по кнопке с плюсом внизу) и кликаем в правой части по полю «Click here to add a frame». После этого откроется окошко добавления изображений, которое похоже на аналогичное окно для добавления новых тайлов в набор. Нажимаем кнопку «Choose image», выбираем нужное изображение и настраиваем его разбивку и размеры (если нужно).

Когда все настроено, жмем кнопку «Add» в правой нижней части окна добавления - анимация должна отобразится в виде превью в левой секции:

Теперь нам осталось только настроить скорость смены кадров (двойной клик на любом из кадров) и некоторые дополнительные параметры, типа, названия (Name) анимации (очень пригодится для сложных проектов), цикличности (Looping) воспроизведения (по умолчанию активно), синхронизации и базовой точки (Origin Point) происхождения спрайта (по умолчанию - центр).

На нижней панели инструментов в правой секции мы обнаружим ряд кнопок. Они позволяют:

  • добавить новые кадры в анимацию (Import Frames);
  • редактировать выбранный кадр во внешнем редакторе (Edit Frame (External));
  • создать кадр во внешнем редакторе (Create Frame (External));
  • редактировать кадр во встроенном редакторе (Edit Frame);
  • удалить кадр (Remove Frame);
  • копировать кадр (Copy Frame);
  • вставить кадр (Paste Frame);
  • переместиться на кадр назад (Move Back) или вперед (Move Forward).

Настройка параметров и поведения персонажей

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

Первым делом настроим столкновения. Для этого посмотрим на строку под списком открытых вкладок и найдем там кнопку «Collision».

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

Для начала уменьшим область вокруг Фриды до размеров только ее тела. Здесь нужно учесть, что двигать область мышкой мы не можем, а для настроек используются четыре числовых параметра в секции «Current Shape». Вначале мы задаем сдвиг области по горизонтали (от левого края) и вертикали (от верха), а затем указываем новые ширину и высоту области столкновений.

Ниже есть еще несколько параметров, объединенных в секцию «Physical Properties». Здесь мы сталкиваемся с галочкой «Is a Sensor?» и понятием групп.

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

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

Теперь, для чего нужны группы… Предположим, что у нашего персонажа в руках не бластер, а меч, которым он (точнее она:)) рубит в капусту врагов (кстати в исходнике у Фриды есть лазерный клинок;)).

Задача состоит в том, чтобы при касании к врагу мечом, враг погибал, но если мы промазали, и супостат задел Фриду, то у нее отнималась какая-то доля энергии. А главная проблема здесь то, что анимация удара у нас, по сути, является картинкой, на которой одновременно присутствует и Фрида, и меч…

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

По умолчанию у нас существует только одна область, которая соответствует самому персонажу («Same as Actor Type»). Однако при помощи инструментов рисования над основной рабочей областью мы можем создать новые виртуальные объекты и задать для них группу при помощи кнопки «Edit Groups».

Со столкновениями, пожалуй, все, а теперь предлагаю разобраться с самым основным - настройкой поведения актера на сцене. Для этого нам нужно перейти в раздел «Behaviors»:

По умолчанию здесь вначале нет ни одного действия, но мы можем их добавить, нажав кнопку «Add Behavior» в левом нижнем углу. Перед Вами откроется перечень готовых к применению функций для управления персонажем или его взаимодействия с другими актерами на сцене.

Я для примера выбрал поведение «8 Way Movement», которое подразумевает передвижение актера по кругу в любую сторону. Теперь выбираем добавленное действие в списке слева и в правой части мы сможем настроить его параметры.

Добавление актеров на сцену и тестирование уровня

Если Вы следовали инструкции, то у Вас уже должен быть необходимый минимум ресурсов для игры. Осталось научиться добавлять актеров на сцену и тестировать работоспособность игрового пространства.

Возвращаемся в редактор созданной ранее сцены и вновь активируем палитру (Palette), но теперь вместо тайлов, включим вкладку «Actors» (Актеры). Перед нами появится список созданных ранее персонажей, которых мы сможем добавить на сцену при помощи инструмента «Карандаш»:

Главная героиня у нас одна, поэтому достаточно всего одного нажатия карандашом, чтобы добавить ее на сцену. И теперь наступил момент истины - первое тестирование! Чтобы запустить предварительную компиляцию проекта достаточно нажать кнопку «Test Scene» в правом верхнем углу вкладки с нашей сценой. Спустя некоторое время (первая компиляция всегда длится дольше) мы сможем полюбоваться своими трудами во флеш-плеере:

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

Как видим, двигать Фриду в разных направлениях мы уже можем, но сама сцена остается неподвижной и стоит наше героине выйти за край видимой части сцены, как она исчезает… Непорядок:). Решить проблему можно, добавив Фриде поведение «Camera Follow» или настроив нужные параметры при помощи событий.

Также, нелишним было бы заменить стандартный курсор на что-то более подходящее, например, прицел. Это мы можем реализовать, добавив нового актера в виде прицела, убрав у него область столкновения и прикрепив к сцене при помощи стандартного поведения «Custom Mouse Cursor»:

Система событий в Stencyl

Простые игры в Stencyl можно создавать при помощи одних только стандартных поведений (Behaviors), однако, если нам требуется что-то нестандартное, то тут уже придется подумать над использованием событий, которые настраиваются для актеров и сцен в разделе «Events»:

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

Окно событий делится на три секции:

  1. В левой секции находится список событий и кнопки для управления (создания/удаления/перемещения) ими. Для добавления события нам нужно нажать кнопку «Add Event», после чего выбрать нужную группу в выпадающем списке и указать конкретную нужную нам функцию. Справа от созданного события имеется галочка, которая позволяет нам при необходимости деактивировать его.
  2. В правой секции мы имеем список всех доступных действий, сгруппированный в 10 разделов, каждый из которых включается соответствующей кнопкой. Для большего удобства действия в каждом разделе рассортированы по тематическим вкладкам и имеют свой уникальный цвет. Внизу здесь есть еще три вкладки. По умолчанию активна вкладка «Palette» (палитра), на которой и располагаются списки действий. Вторая вкладка - «Attributes» - служит для отображения локальных переменных (о них чуть ниже), а третья - «Favorites» - служит для показа избранных Вами действий.
  3. Центральная секция - это рабочая область. Здесь мы и формируем окончательные примеры поведения персонажей при помощи различных комбинаций блоков действий и событий, по которым эти действия происходят. Комбинирование происходит путем простого перетаскивания блоков на рабочую область и последующей правки указанных в них параметров. Стоит учитывать, что функцию составляют только те блоки, которые объединены между собой и включены в основной блок события. Таким образом, чтобы временно убрать определенные ненужные в данный момент (но полезные) комбинации, нам достаточно просто вынести их из общей структуры на свободное место. Если же действия оказываются со временем ненужными вовсе, то их можно полностью удалить, переместив в корзину, которая находится в правой верхней части рабочей области.

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

Настройка физики и свойств

Мы с Вами уже рассмотрели много чего, но не коснулись некоторых дополнительных тем, которые могут быть очень важными при создании игр - я говорю о настройке всевозможных свойств наших актеров и сцен. Эти параметры у нас хранятся в двух последних вкладках. И первая из них - «Physics»:

Для сцен и актеров вкладка настройки физики выглядит по-разному. На вкладке с настройкой физики сцены находится всего два параметра - настройка горизонтальной и вертикальной гравитации. Внешний же вид секции настроек физических параметров актеров представлен на скриншоте выше и состоит из пяти вкладок с различными опциями:

  1. Вкладка «General» («Общие»). Здесь у нас есть три параметра: тип актера (неподвижный, платформа (может двигаться по заданным правилам, но его не могут двигать другие актеры) и подвижный), вращение актера (может вращаться или нет) и влияние гравитации.
  2. Вкладка «Heaviness» («Вес»). На этой вкладке можно настроить массу виртуального объекта и его инерционность.
  3. Вкладка «Material» («Материал») позволяет задать для актера такие характеристики, которые будут симулировать поведение реального предмета, сделанного из того или иного материала. У нас есть возможность выбрать одну из предустановок из выпадающего списка «Preset Materials» или вручную задать характеристики трения и упругости нашего актера.
  4. Вкладка «Damping» («Сопротивление») дает нам возможность более тонко настроить параметры взаимодействия актера с окружением за счет внедрения такой величины, как линейное (например, воздуху) и угловое (при вращении) сопротивление.
  5. Вкладка «Advanced» («Продвинутые») предоставляет нам доступ к различным дополнительным настройкам, не вошедшим в предыдущие разделы. Здесь можно активировать упрощенную модель физики (для оптимизации игры), автоматическое определение областей столкновений, события повторных столкновений и возможность применения паузы к актеру.

С физикой разобрались, а теперь посмотрим на свойства, которые вызываются нажатием кнопки «Properties»:

Как и в предыдущем случае, для сцен и актеров свойства будут разными. В свойствах сцены мы можем указать ее имя («Name»), размеры (секция «Size») и фоновой цвет («Background Color»).

В свойствах же актера можно, помимо имени, задать описание (поле «Description») объекта, группу, к которой относится актер (секция «Choose Group») и слой анимации для мобильных устройств (здесь можно ничего не менять, поскольку бесплатная версия программы не позволяет экспортировать игры в форматы для мобильников.

Но и это еще не все настройки, которые нам доступны в Stencyl. Общие настройки игры доступны нам по нажатию кнопки «Settings» на основной панели инструментов:

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

  1. «Settings» («Настройки»). Первая группа настроек, которая позволяет немного персонализировать нашу игру. Эта группа содержит три вкладки. На первой из них («Main») мы можем задать игре новое имя, короткое описание, а также картинку-превью и иконку. На вкладке «Display» настраивается окончательный размер игрового пространства, а на последней («Advanced») есть возможность включить упрощенную физику и задать параметры сглаживания.
  2. «Loader» («Загрузчик»). В этой группе мы можем частично (учитывая некоторые ограничения бесплатной версии) настроить внешний вид прелоадера (загрузчика), который будет отображаться перед полной загрузкой игры. Здесь уже четыре вкладки. На первой («General» - общие) можно указать ссылку на Ваш сайт, включить защиту от копирования игры на других ресурсах (через запятую перечисляем список дозволенных сайтов во второй строке) и один из скинов загрузчика. На вкладке «Appearence» мы можем задать цвет экрана загрузчика и фоновое изображение. При помощи вкладки «Bar Style» указываются размеры полоски загрузчика, а «Bar Color», позволяет задавать, соответственно его цвета.
  3. «Attributes» («Атрибуты»). Данная группа настроек - одна из самых основных! Здесь можно управлять глобальными переменными, используемыми в игре (о переменных в следующем разделе ниже).
  4. «Controls» («Управление»). Как явствует из названия, в данной группе мы можем перенастроить и добавить кнопки клавиатуры, при помощи которых будут выполняться те или иные игровые действия.
  5. «Groups» («Группы»). Механизм групп мы уже рассматривали немного выше. Здесь мы имеем возможность видеть все созданные группы и править их.

Собственно, вот и все настройки, которые нам будут нужны для создания флеш-игр в бесплатной версии Stencyl. Но раз уж этот раздел о настройках, то тут грех не упомянуть о параметрах самой программы. Получить к ним доступ можно, активировав пункт «Preferences» в меню «File»:

В программе предусмотрена поддержка многоязычности интерфейса, однако, на данный момент существует только английская локализация, поэтому мы и перешли сразу ко второй вкладке - «Workspace». Дело в том, что в третьей версии Stencyl появилась функция автоматической генерации адаптивных изображений из загруженных спрайтов.

И по умолчанию стоит увеличение спрайта в два раза, что влечет за собой ухудшение качества графики. Чтобы этого не происходило, советую отключить переразмеривание картинок, выбрав в поле «Scale» значение «Standard (1x)».

Также советую заглянуть на третью вкладку - «Editors». Здесь можно ассоциировать действия обработки графики, звука и текста с внешними более продвинутыми (нежели встроенные в Stencyl) редакторами.

Немного о переменных

Мы с Вами рассмотрели практически все нюансы работы в Stencyl, но не коснулись одной из самых мощных возможностей - работы с переменными .

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

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

В Stencyl переменные могут быть локальными и глобальными. Локальные переменные мы можем объявлять в рамках какого-нибудь события или поведения, и они будут работать только для указанных действий. Создать локальную переменную можно в редакторе событий, вызвав раздел «Attributes»:

Здесь у нас есть несколько вкладок:

  1. Вкладка «Getters» позволяет задать переменные, которые будут получать значение из каких-либо вычислений или прямых указаний.
  2. Вкладка «Setters» дает возможность установить какие-либо значения для созданных ранее переменных.
  3. Вкладка «Games Attributes» хранит блоки глобальных переменных и при желании позволяет добавлять новые (хотя, как это делать лучше мы рассмотрим чуть ниже).
  4. Вкладка «Lists» предоставляет нам возможность создавать массивы данных.
  5. Вкладка «Functions» используется для организации созданных функций.

Алгоритм создания локальной переменной прост: вначале создаем новый блок во вкладке «Getters», а затем находим во вкладке «Setters» только что созданную переменную и добавляем блок с ней на рабочую область, приравнивая к какому-либо игровому параметру. Вот и все - переменная объявлена и получила набор допустимых значений.

Глобальные переменные (Game Attributes) в Stencyl задаются сразу для всей игры и могут быть вызваны в любом событии или поведении. Как уже говорилось выше, создать их можно в разделе «Attributes» на вкладке «Game Attributes»:

Однако просматривать все созданные переменные и управлять ими гораздо удобнее при помощи раздела «Attributes» в настройках (кнопка «Settings» на панели инструментов или «Show Game Attributes» на вкладке «Game Attributes» в редакторе событий):

Здесь у нас представлен весь список глобальных переменных и имеется возможность создавать новые при помощи нажатия кнопки «Create New». Для новой переменной мы можем тут же задать тип (числовая, текстовая, булева или массив) и стартовое значение, не покидая пределов окна, что очень удобно на мой взгляд.

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

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

Публикация, импорт и экспорт игр

Наконец-то мы, хоть и бегло, но ознакомились с основными принципами работы со Stencyl. Предположим, мы создали игру, проверили ее и все оказалось рабочим. Теперь дело за малым - превратить игру из проекта в реальный SWF-файл, который можно выложить в Интернет. Для этого нам достаточно открыть меню «Publish» и в списке «Web» кликнуть пункт «Flash».

Запустится компиляция файла игры, после чего появится запрос, куда и под каким именем сохранять полученный флеш-файл. Сохраняем и все - игра готова:).

Обратным процессом будет импорт игры. Благодаря функции импорта Вы сможете открывать проекты игр других пользователей, например, чтобы подсмотреть, как у них реализована та или иная функция;). Импортировать игру можно также из меню «File». При успешном импорте игра появится на главном экране в списке проектов. Однако здесь стоит сделать небольшую оговорку.

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

Достоинства и недостатки программы

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

Выводы

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

Однако, не стоит забывать о «почти»… Дело в том, что сам Stencyl работает на базе JAVA-машины, которая, как известно, довольно требовательна к ресурсам. Если к этой нагрузке добавить еще и нагрузку, которую создает игра, то получится, что для нормальной работы нам потребуется современный мощный компьютер.

Это первое «почти». А второе - уже упомянутое мною вскользь неявное ограничение на количество объектов на сцене. Даже, если эти объекты всего лишь тайлы, но их много, игра может выдать при тестировании ошибку и не запуститься до тех пор, пока Вы не уменьшите их количество.

Резюмируя, можно сказать, что Stencyl будет идеальным движком для создания всевозможных казуальных флеш-игр и бродилок-стрелялок с видом сбоку. Более того, потренировавшись создавать флеш-игры, Вы сможете приобрести один из типов лицензии и, немного изменив механику, портировать свою игру в форматы, поддерживаемые Android и iOS. А это уже реальный способ заработать деньги, разместив игру на Play Market’е или в App Store!

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

P.S. Разрешается свободно копировать и цитировать данную статью при условии указания открытой активной ссылки на источник и сохранения авторства Руслана Тертышного.

Создание flash-сайта ndash; дело достаточно сложное. Для этого нужны знания во многих областях: программировании, компьютерной графике, основах оптимизации и продвижения сайтов, нужно хорошо знать сам flash в конце концов, причем как на уровне знания среды разработки, так и языка программирования action script 2.0. или action script 3.0, что в настоящее время является более приоритетным.
Разрабатываются флеш-приложения в Adobe Flash Professional ndash; это мультимедийная программа, которая используется для создания такого контента как веб-приложения, фильмы, игры, приложения для мобильных и других встроенных устройств.
Flash ndash; уникальное явление. Ранее этот продукт назывался «Macromedia Flash», после приобретения компанией Adobe эта программа стала называться «Adobe Flash» с 2005 года. Flash-анимация используется для потоковых веб-страниц. Иногда флеш ndash; это часть страницы html, а бывает, что вся страницу целиком выполнена на Flash или же весь сайт создан с его помощью. Flash-файлы, которые получаются в результате — это специальные в swf («ShockWave Flash») формате файлы, которые требуют для просмотра содержимого специальные бесплатные плагины для браузера, их можно легко и быстро скачать и установить с официального сайта Adobe. Преимуществом флеш-роликов стала очень быстрая загрузка и работа с векторной анимацией с интерактивностью. Флеш может быть загружен до показа на экране всего ролика, то есть можно реализовать вариант, когда вы начинаете смотреть анимацию, а остальные «потоки» на экран загружаются в фоновом режиме.
Используемая флеш-графика в векторе плюс программный код позволяют сделать полнофункциональное приложения, способное заменить некоторые растровые, видео фрагменты, программные коды, но сделать это намного оптимальнее, для потоков используется меньшая пропускная способность, потребляется меньше мощности процессора. В дополнение к вектор-рендерингу Flash Player (плеер, необходимый для просмотра флеш-роликов) включает в себя виртуальную машину (ActionScript Virtual (AVM)) для поддержки сценариев взаимодействия во время выполнения, а также поддерживает видео, mp3.
Рассмотрим существующие типы графики и выделим преимущества векторной, с которой непосредственно работает Flash.
Всю графику можно поделить на три типа: растровая, векторная, 3Д. В растровой графике, как и на мониторе телевизора, каждое изображение состоит из набора мелких элементов ndash; пикселов ndash; это аббревиатура от picture element.
Принцип точечной графики очень прост: как рисует ребенок в школе по клеточкам, только здесь эти клетки намного меньшего размера. Такой вид графики прост как в реализации, так и обработке и представлении, технически удобно реализовать, автоматизировать ввод или оцифровку изобразительной информации.
Но растровой графике присущи недостатки: она объемна, вес файла в результате получает большой, при уменьшении или увеличении изображения теряется качество рисунка.
Кодирование графической информации в векторной графике другой: все изображения задаются в виде контуров ndash; математических объектов. Эти контуры представляет собой независимый объект, который можно перемещать, изменять размеры, масштаб, причем сколько угодно раз. Линии задаются начальными точками, формулами, указывающими сами линии. Благодаря этому при изменении рисунка пропорции всегда точно выдерживаются. Векторную графику также объектно-ориентированная графика, потому что рисунок состоит из отдельных объектов — прямых и кривых линий, эллипсов, прямоугольников, замкнутых и разомкнутых фигур, и т.д., которые имеют свои характеристики толщины контура, цвета, стиля линии и т.д.
Векторная графика экономна в плане ресурсов, о ней сохраняется информация в виде формул, а не информации по каждой точке, описания цвета не увеличивает значительно размера файла. Рисунки векторной графики легко изменяются, практически при этом не теряется качество изображения. Есть области графики, где сохранение четких контуров принципиальное, например, в создании логотипов, в шрифтах и др.
Вектор использует все достоинства разрешающей способности всех выводных устройств, к примеру, принтера. Изображение всегда выглядит качественно, четко, все будет зависеть уже только от самого принтера.
Также плюсом векторной графики можно назвать то, что она легко трансформируется в растровую, но не наоборот! И включать в себя объекты растровой графики может, хотя обрабатывать такими же средствами ее не получится.
Серьезным преимуществом векторной графики считается средство интеграции текста и изображений, один подход к ним, соответственно, возможность создать конечный продукт. Самые популярные редакторы векторной графики: CorelDRAW, Adobe Illustrator и конечно же, Adobe Flash.
Вектор ограничен при создании реалистичных изображений: четкие и мультяшные ndash; да, а вот как задать формулой сосну или облако. Также возникает проблема при вводе графической информации: к примеру, сканер передает информацию об изображении по пиксельно: расположение и цвет каждой точки в зависимости от реакции светового луча. Охватывать пообъектно он не может, да и не все изображения, как я уже писала выше, можно формализировать.

Флеш стал повсеместно популярен ndash; почти на каждой Web-странице появляются мультипликационные картинки — баннеры. Они интерактивны, проигрывают анимацию и немного занимают места на диске, что важно при работе в сети.
Анимация создается за счет отображения каждого флеш-кадра в течение определенного промежутка времени. Когда кадров много, создается иллюзия движения. Ранее флеш-технологии появились GIF-анимации, но возможности Flash намного шире. Так с ее помощью можно создавать элементы навигации, озвученные мультфильмы, анимированные логотипы, калькуляторы, целые сайты с набором разнообразных интерактивных элементов, а уж какие чудеса анимации можно сотворить на флеше: выглядят они очень эффектно и другие технологии для веб не могут похвастаться такими возможностями.
Анимационные ролики, создаваемые флеш, называются фильмами. Анимационные возможности не ограничены мультипликацией, анимируются разнообразные объекты: меню, рисунки, ссылки, тексты.
При запуске программы открывается окно с рабочей областью и панелью инструментов, а также дополнительными окнами, которые можно подключить в процессе работы. Также отображены вкладки работы с временной шкалой, настройками проверкой на ошибки и т.д. В программе фильмы создаются рисуя или импортируя готовые рисунки, размещаются они в специальной области рабочего окна ndash; сцене (Stage), а кадры создаются с помощью Timeline (шкала времени).
Сцен в фильме может быть несколько сцен, при запуске ролика они воспроизводятся в том порядке, как были созданы, если этот порядок не изменили специально. Это позволяет удобно и быстро изменять отдельные эпизоды, менять их порядок.
Сама анимация делается путем изменения следующих один за другим кадров, изменения их содержания, то есть в кадре добавляются объекты с нужными параметрами. Объекты на сцене можно вращать, изменять положение, цвет, устанавливать прозрачность, их форму, размер, тоже самое можно делать с любыми другими объектами.
Анимацию можно создавать путями:
покадрово (Frame-by-frame Animation) ndash; рисунок в каждом кадре делается руками и кадры идут подряд;
расчетно (Tweened Animation) ndash; делаются только начальный, а также конечный кадры (называются ключевыми), а между ними программа сама строит кадры; два вида такой анимации: движения (Motion Tweening, когда меняются параметры движения поворот, размер, положение), формы (Shape Tweening);
программно ndash; когда параметры изменения объекта задаются с помощью команд языка программирования Action Script.
В процессе работы над фильмом исходные данные сохраняются в специальном файле с расширением.fla. Сюда входят сцена со всеми объектами, также, дополнительные параметры об объектах, которые не были включены в фильм, но создавались в нем, также вариантах звуков, комментариях, кодах-скриптах, настройках программы и т.д. После создания такого исходника, необходимо перевести его в формат, пригодный для интернет ndash; а именно SWF, таким образом мы производим публикацию фильма или компиляцию кода. При этом из файла будет удалена информация, которая не нужна для воспроизведения в нужном виде фильма. Таким образом размер файла становится минимальным и быстро загружается у пользователя. Такой файл можно открывать отдельно ndash; плеер его проиграет, а можно подключать на любую html-страницу как объект.

Фильм создается из готовых элементов ndash; эталонов (Symbols) или символов. Эталон — это изображение, кнопка, анимация, мувиклип, которые многократно используются в ролике. Их можно создать, можно импортировать. После создания символы хранятся в специальном хранилище ndash; библиотеке (Library). В процессе сборки фильма в тех местах, где необходимо, вставляются именно экземпляры (Instance) эталонов (которые хранятся в библиотеке), а не они полностью каждый раз. И их вставлять можно сколько угодно раз и где угодно. Параметры экземпляра при этом вы можете изменять как угодно: местоположение, размер, масштаб, поворот, изгиб, прозрачность, тон и т.д., а сами символы-эталоны при этом не меняются. Это очень удобно ndash; вам не нужно создавать каждый раз заново элемент или копировать его, элемент один, а его модификаций сколько угодно много. А при процессе публикации файл окончательного ролика, который создается в формате swf, собирается так, что в одном месте будет непосредственно эталон объекта, а во всех остальных ndash; только указатели на него. Представьте, на сколько таким образом уменьшается вес ролика по сравнению с копированием почти одинаковых элементов.
Эталоны бывают:
bull; Movie Clip (мувиклип) ndash; включает звук, графику, анимацию, может быть управляемым скриптом программно;
bull; Graphic (Графический) ndash; рисунки в статике, анимация, звук, но не управляемый программно;
bull; Button (кнопка) — включает рисунки, звук; по сравнению с эталонами-символами других типов включает только четыре кадра, в которых отображаются изменения состояния кнопки, когда происходят различных события мыши.
Перед непосредственным созданием символа-эталона нужно задать его тип, позже его можно будет сменить.
Кроме символов-эталонов, их экземпляров, ролик может вмещать изображения из внешних файлов, шрифты.
Весь ролик в Adobe Flash ndash; это последовательность кадров (Frames), они показываются по очереди с указанной скоростью. Работа с ними происходит с помощью шкалы времени (Timeline). Слева на шкале расположены слои, имена которых нужно задавать, справа ndash; набор пустых кадров, которые заполняются по мере создания объектов и размещении их на сцене. Как только кадр стал заполненным объектами, он изменяет цвет на серый. Ключевые кадры обозначаются черной точкой. На шкале времени текущий кадр отмечается красным маркером ndash; проигрывающая головка, через которую проходит тоненькая красная линия по вертикали, которая пересекает все слои и laquo;видитraquo; текущий кадр в каждом из них. Вот эти-то кадры, то есть их содержимое в виде мувиклипов и отображается на экране.

Для реализации интерактивности и возможности создавать полноценные сайты, в Adobe Flash используется язык программирования Action Script.
Чтобы сделать фильм интерактивным, во Flash используются программы- сценарии-скрипты (script -сценарий), они вмещают набор инструкций (actions) на ActionScript, а выполняются, когда наступают определенные события: нажатие пользователем кнопки, достижение какого-то кадра фильма, реакции на движение мыши, ее колесика, установка указателя над определенной областью и многие другие. Команды скрипта определяют реакцию Flash на возникновение события.

Команды скрипта, которые делается при реализации того или иного события, указываются для клипа, кадра, кнопки, а длелается это на специальной вкладке внизу экрана Actions (Команды) (Actions Frame, Actions Movie Clip), Actions Button.
Возможные события:
Нажатие клавиши (Key Press) ndash; когда пользователь нажимает клавиши клавиатуры, параметром функции выступает имя клавиши.
Наведение (Roll Over) ndash; когда над объектом находится указатель мыши, но мышь не нажата;
Отпускание (Release) ndash; если происходит отпускание кнопки мыши, когда указатель над кнопкой, которую запрограммировали, то есть если пользователь щелкает манипулятором laquo;мышьraquo;;
Нажатие (Press) ndash; если происходит нажатие кнопки мыши (левой), во то время, когда указатель находится над кнопкой, которую запрограммировали. При этом учитывается область срабатывания, а не ее видимое изображение, определяется это в кадре Область (Hit);
Удаление (Roll Out) ndash; над кнопкой был указатель мыши, его не нажимали и уводят мышь с программируемой кнопки;
Сдвигание (Drag Out) — клавиша мыши устанавливается над объектом, нажимается и уводится;
Отпускание за пределами (Release Outside) ndash; если была нажата кнопка мыши на объекте, а потом ее отпустил пользователь вне объекта;
Возврат (Drag Over) ndash; на объекте установлен указатель, левая кнопка мыши нажимается и не отпускается, но указатель ведут за объект, потом снова возвращают.

Язык ActionScript 3.0, если его сравнивать с ActionScript 2.0, более современный в том плане, что базируется на основах объектно-ориентированного программирования. Где основными понятиями выступают класс, объект, его атрибуты или свойства, а также методы, присущие данному объекту.
ActionScript выполняется при помощи виртуальной машины (Virtual Machine ActionScript), она является частью Flash Player.
Основой любого программного кода есть переменная, которая в ActionScript задается так: var ndash; специальная команда Flash, означающая, что в данном разделе происходит обозначение переменной и определение ее типа; name ndash; имя переменной, задается в текстово-цифровом формате, но не начинается с цифры; type ndash; указание типа переменной (числовой — Number, логический ndash; Boolean, текстовый — String и т.д.). то есть вы будете указывать: Var x: String;
После имени переменной не забудьте указать двоеточие, а в конце строки точку с запятой. В ходе выполнения кода, значение, а соответственно тип переменной можно изменять.
Переменная, которая вмещает в себе большое количество данных, называется массив. В АС 3.0. он задается с типом Array: Var Mas: Array.
Все элементы массива нумеруются, начиная с 0, поэтому для обращения, например, к первому элементу, вам нужно указать Mas. То есть в квадратных скобках вы указываете позицию нужного элемента в массиве.
Сам код будет состоять из функций, которые описывают последовательность команд, которые происходят при том или ином событии ndash; клик мышкой, нажатие клавиши, достижении какого-то значения и т.д.
Задается функция с помощью зарезервированного слова function, далее вы указываете ее имя — name — любое текстово-числовое название, но не начинается с цифры, далее в круглых скобках () можно указать параметры функции ndash; что подается ей на вход, они могут отсутствовать, далее двоеточие и тип данных, которые функция возвращает или void ndash; когда функция ничего не возвращает. После этого весь код функции заключаете в фигурные скобки { }. А обращаетесь к функции, указав ее имя и параметры при необходимости: name().»Условия в АС 3.0. задаются через оператор if: if(х==у), то есть в скобках круглых нужно указать само условие сравнения. Циклы задаются через for(), где в круглых скобках задаются его параметры: переменная-счетчик, шаг ее изменения.
Каждый объект характеризуется своими параметрами или свойствами, к объектам во флеш можно прикреплять слушателей событий функцией addEventListener. Этот слушатель будет обрабатывать события, происходящие с объектом и если реакции на них описаны в функции программистом, программа будет соответствующе реагировать.

Это лишь малая часть того, что нужно знать, приступая к созданию флеш-сайта. Сайт можно не создавать с 0. Есть специальные шаблоны-заготовки, которые можно купить и модифицировать под ваши нужды (например, сайт templatemonsters). Там уже полностью разработан дизайн, вам нужно изменить контент и в программной реализации все что будет необходимо можно перепрограммировать. Затем вам нужно купить домен и хостинг, разместить html-файл, в котором подключается swf.
Читайте книги (мне, например, для работы и статьи в том числе помогла книга laquo;100% самоучитель M.Flash MXraquo;), учитесь у коллег на форумах (демиарт, флешер.ру), а еще, что должно стать вашим самым первым помощником — это помощь на официальном сайте Adobe. очень детализированно и подробно опсиан язык ActionScript, показаны примеры, причем материал подан и на русском языке в том числе.
После создания ролика, его нужно опубликовать. Параметры публикации программы можно установить в пункте меню Файл Параметры публикации. Там указывается в какие форматы делать выгрузку ролика, каковы настройки качества графики и звука и многие другие. Получив swf-файл, можно использовать его как полноценное готовое приложение. Для изменения, обновления созданного ролика нужно отредактировать исходник ndash; fla- файл и снова опубликовать.

Многие из нас любят коротать время, играя в короткие флэш-игры, однако мало кто задумывается о том, как эти произведения виртуального искусства создаются. Между тем, данная технология существует еще с конца 90-х гг. Ее создателем является американская компания Macromedia (ныне Adobe Systems). Эта система активно применяется не только для разработки игр, но и в веб-мастеринге. Именно на флэше работают большинство сайтов в Интернете (хотя, некоторые уже переходят на HTML 5). Также детищем Adobe Systems является программа для создания приложений Macromedia Flash. Освоить ее может любой человек, даже далекий от компьютерных технологий. Однако, прежде чем мы начнем рассказывать о том, как делать игры, рассмотрим основные плюсы и минусы данной платформы.

Преимущества Adobe Flash

    Существует ряд достоинств, которые выделяют эту технологию на фоне других программных платформ и делают эту технологию превосходной для создания любительского игрового контента:
  • Во-первых, это скорость разработки. В отличие от других платформ, флеш позволяет создать любую игру буквально за час. Macromedia Flash не утруждает разработчика длинными кусками кода, предоставляя готовый инструмент для работы
  • Во-вторых, эта технология предлагает широкие возможности по работе с другим мультимедийным контентом. Вам не придется тратить время и силы на конвертацию одного файла в другой. Технология позволяет без лишних хлопот интегрировать в игру любые графические, звуковые и видеофайлы. Таким образом вы можете включить в работу над проектом художников, композиторов, монтажеров и создать по-настоящему уникальный продукт
  • В-третьих, Macromedia может похвастаться интуитивно понятным управлением и набором функций, значительно упрощающих работу в данной программной среде. Функция «drag and drop», командное меню Action Script, удобные рабочие панели и подсказки — все это делает работу с Adobe крайне приятной
  • В-четвертых, функционал платформы крайне удобен в плане подачи и распространения контента. Благодаря веб-расширению Adobe Player, приложения созданные на основе этой технологии легко размещаются на любом сайте, путем вставки на страницу простейшего кода. Также технология поддерживает создание автономных приложений в формате swf, которые легко воспроизводятся на любой операционной системе
  • Наконец, в-пятых. Эта технология позволяет создавать красочные игры с очень плавной анимацией и большой интерактивностью. Во многом, красота приложения зависит от таланта художника, а не программиста. Этим свойством данная платформа привлекает новичков, желающих попробовать себя в создании игр.

Недостатки Flash Player

    Как и любая другая программа, эта также имеет ряд минусов, о которых должен знать любой, кто хочет начать работать с флэш-приложениями:
  • Привязка к временной шкале. По сути, создание флэш-приложений представляет собой расположение последовательных кадров на временной шкале и дальнейшее их воспроизведение. Таким образом, эта система отлично подходит для создания анимаций. Однако нелинейности, которая является актуальной тенденцией для большинства игр, добиться не удастся.
  • Быстродействие. К сожалению, она не отличается особо быстрой работой. Поэтому на ее основе не создают кооперативные игры и аркады с большим количеством однотипных объектов.
  • Нет поддержки трехмерности. Существенным минусом является то, что технология флеш не поддерживает создание и использование трехмерных моделей и сцен окружения, а для большинства современных игр это является незыблемым стандартом. С другой стороны, браузерные онлайн игры используют преимущественно Flash, в связи с определенными ограничениями, характерными для сетевых игр.
  • Закрытость платформы. Adobe Macromedia не поддерживает добавление новых функций. В других программных средах (например в Java), можно добавить новые свойства. Здесь это могут сделать лишь сами разработчики. И несмотря на то, что они постоянно обновляют программу с учетом мнений пользователей, ее функционал продолжает оставаться ограниченным.

Несмотря на эти недостатки, флеш является незаменимой для создания небольших любительских мини-игр.

Как создать Flash-игру: основные аспекты

Создание анимаций на движке она напоминает детское увлечение, когда на уголках страниц по кадрам рисовался рисунок и при быстром перелистывании он начинал двигаться. Суть флэш-анимаций такая же — вы покадрово располагаете графические объекты на временной шкале и при воспроизведении они начинают двигаться. С играм все сложнее. Для того, чтобы создавать их, необходимо освоить язык программирования ActionScript 3.0. Изучить его можно при помощи специальных книг и учебников (например, книга Колина Мука «ActionScript 3.0 для Flash»). Также есть довольно много обучающих видео на YouTube. Достаточно проявить совсем немного старания, чтобы освоить эту программу. Сделав это, у вас вряд ли появятся вопросы о том, как написать flash-игру.

    При создании флэш-игры, важно придерживаться определенной структуре:
  • Титульное окно (заставка)
  • Правила
  • Окно окончания игры

Сначала идет «Титульное окно». Это заставка, которая должна произвести первоначальное впечатление на игрока. Здесь важно проявить весь свой художественный талант и фантазию.

Следующим этапом станет создание страницы «Правила». Несмотря на то, что некоторые разработчики игнорируют данный этап, лучше все-таки сформировать правила игры, сделав ее более понятной и дружелюбной. Иногда они пишутся на внешней странице, либо в отдельном окошке.

«Фон» — это окружение, на котором будут находиться графические объекты. В отдельных случаях, объекты занимают весь экран. Игровой фон можно создать инструментами Adobe Macromedia, либо воспользоваться сторонними программами (например, Ogmo Editor превосходно справляется с созданием двухмерных сцен). Важно, чтобы он был тематическим и дополнял общую концепцию игры.

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

Таким образом, после изучения adobe flash, как создать игру будет знать любой человек. Достаточно понять основные механизмы работы и уже достаточно скоро вы сможете создавать простенькие игры. Как и в любом деле, здесь главное проявить достаточно усидчивости и заинтересованности, и результат не заставит себя ждать.

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

1. В главном меню Adobe Flash Professional CS6 выберите File > New .

Перед вами появится диалоговое окно New Document (Новый документ).

2. Выберите вкладку General , а в ней ActionScript 3.0 .

Другие опции списка нацелены на другие среды воспроизведения, например, AIR for Android и AIR for iOS создадут новые файлы, которые сможет проигрывать AIR на устройствах под управлением операционной системы Android или устройствах, созданных компанией Apple (iPad, iPhone).

3. В правой части диалогового окна задайте нужные параметры для сцены.

Введите в соотвествующие поля необходимые значения:

  • 800 - для ширины (Width);
  • 600 - для высоты (Height);
  • для линейки оставьте единицы измерения - пикселы (Pixels);
  • частоту кадров и цвет фона тоже не меняйте, пусть остануться те значения, которые заданы по умолчанию. Вы сможете изменить их в любой момент. О том ка это сделать вы узнаете чуть позже.

4. Нажмите ОК.

Flash CS6 создаст новый файл с заданными установками.

5. Выберите File > Save .

Дайте имя вашему файлу 01_disneyland.fla . Из выпадающего списка Тип файла выберите Flash CS6 document (*.fla) . Сохраните его в папке Урок 01 . Сохранение файла в самом начале работы - это хорошая привычка. Обязательно выработайте ее у себя. Она здорово выручит в ситуациях, когда программа или компьютер зависнут или будут отключены по тем или иным причинам. Всегда сохраняйте ваш файл с расширением.fla .

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

Пожалуйста, включите JavaScript, чтобы увидеть комментарии.

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

Флеш редактор – это программа для создания flash анимации и редактирования уже готовых флеш роликов.

Формат FLA - это исходный документ вашего клипа. Открыв его, вы попадаете в программу Macromedia Flash и можете дальше редактировать клип.

Формат SWF - это исполняемый файл Flash, при "клике" мышью на нем вы имеете возможность просмотреть клип с помощью программы Macromedia Flash Player.

Анимация с помощью Adobe Flash Professional

Adobe Flash Professional CS3 – достоинства и функциональности данной программы можно описывать очень долго. Данная программа является безусловным лидером в среде флеш технологий. Adobe Flash Professional пользуются, как профессиональные разработчики Web-сайтов, так и flash дизайнеры.

С помощью этой программы можно реализовать во флеш даже самую больную фантазию. В общем если Вы решили создавать профессиональные анимированные флеш файлы , то Adobe Flash Professional – это именно та программа, без которой Вам не обойтись.

Объём зависит от версии от 500 Mb.

На данный момент Adobe Flash Professional CS5 - новая версия программы для работы с анимацией и мультимедиа.

ОС: Windows XP/Vista/7

Скриншот программы:

скачать Adobe Flash Professional CS3

Возможно, для начинающего web мастера создание флеш анимации с помощью программы Adobe Flash Professional покажется, чем то сложным и не досягаемым.

В этом случаи не стоит отчаиваться и бросать начатое. Попробуйте свои флеш идеи с программой Swishmax.

Swishmax – флеш редактор

SwishMAX – это альтернативная программа с дружественным и простым интерфейсом для создания flash-анимации, которая является менее функциональной, по сравнению с предыдущей, но при этом позволяет получить результат хорошего качества. Главное преимущество донного flash редактора - это простота использования. Даже начинающий пользователь, имея под руками видео уроки, за короткое время сможет создать с ее помощью профессиональные флеш - ролики.

Объём: 9.27 MB.

Язык интерфейса - русский есть.

Операционная система: Windows 98/Me/NT/2000/XP

Скриншот программы:


скачать Swishmax

Alligator Flash Designer

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

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

Здесь так же можно указать OnClick или OnOver.

Объём: 5.3 MB.

Язык интерфейса - русский есть.

ОС: Windows XP/Vista/7

Скриншот программы:


скачать Alligator_Flash_Designer_7.0

Ещё одна программа, которая не является flash редактором анимации, но её возможности необходимы для начинающего веб дизайнера.

Flash Decompiler Trillix

Flash Decompiler Trillix – основное предназначение этой программы - экспорта SWF файлов обратно в FLA формат одним нажатием кнопки мыши. Извлекает все объекты Flash из SWF файла и сохраняет их во FLA файл, который в дальнейшем можно редактировать во Flash.

Достоинство Flash Decompiler - редактирование звуков, изображений, цвета, градиента, линий, динамических текстов и ссылок без конвертации во FLA.

Объём: 7.27 MB.

Язык интерфейса - русский есть.

ОС: Windows XP/Vista/7

Скриншот программы:


скачать Flash Decompiler Trillix

October 13, 2014

Статьи по теме: