На данной web странице Вашему вниманию представлены программы для создания и редактирования флеш анимации. С их помощью Вы сможете реализовать собственные идеи в анимированные ролики для Вашего сайта.
Флеш редактор – это программа для создания flash анимации и редактирования уже готовых флеш роликов.
Формат FLA - это исходный документ вашего клипа. Открыв его, вы попадаете в программу Macromedia Flash и можете дальше редактировать клип.
Формат SWF - это исполняемый файл Flash, при "клике" мышью на нем вы имеете возможность просмотреть клип с помощью программы Macromedia Flash Player.
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 – это альтернативная программа с дружественным и простым интерфейсом для создания flash-анимации, которая является менее функциональной, по сравнению с предыдущей, но при этом позволяет получить результат хорошего качества. Главное преимущество донного flash редактора - это простота использования. Даже начинающий пользователь, имея под руками видео уроки, за короткое время сможет создать с ее помощью профессиональные флеш - ролики.
Объём: 9.27 MB.
Язык интерфейса - русский есть.
Операционная система: Windows 98/Me/NT/2000/XP
Скриншот программы:
Следующая flash программа является ещё более простой, как по функциональности, так и по содержимому интерфейса. Возможности этого флеш редактора позволяют с лёгкостью за считанные минуты создавать flash баннер для сайта.
Имеется более 130 эффектов: исчезновение, изменение масштаба, вращение. Анимированные рисунки, фигуры или текст, и даже звук без проблем добавляются к Вашей Flash-анимации.
Здесь так же можно указать OnClick или OnOver.
Объём: 5.3 MB.
Язык интерфейса - русский есть.
ОС: Windows XP/Vista/7
Скриншот программы:
Ещё одна программа, которая не является flash редактором анимации, но её возможности необходимы для начинающего веб дизайнера.
Flash Decompiler Trillix – основное предназначение этой программы - экспорта SWF файлов обратно в FLA формат одним нажатием кнопки мыши. Извлекает все объекты Flash из SWF файла и сохраняет их во FLA файл, который в дальнейшем можно редактировать во Flash.
Достоинство Flash Decompiler - редактирование звуков, изображений, цвета, градиента, линий, динамических текстов и ссылок без конвертации во FLA.
Объём: 7.27 MB.
Язык интерфейса - русский есть.
ОС: Windows XP/Vista/7
Скриншот программы:
October 13, 2014
Мы постоянно сталкиваемся с флеш-анимацией – в интернете и в телевизионных трансляциях. Создание простой флеш-анимации с помощью технологии Flash – довольно простая задача, так как Flash предлагает много полезных инструментов, которые упрощают весь процесс. Если вы хотите создать флеш-анимацию или мультфильм, то вы можете сделать его набросок всего за пару часов.
Часть 1
Покадровая флеш-анимацияОсновы покадровой анимации. Этот метод считается основным методом создания «традиционной» анимации, в которой каждый последующий кадр включает одно, но чуть измененное изображение. При воспроизведении всех кадров изображение «оживает». Этот же метод используется аниматорами, рисующими мультфильмы от руки, и отнимает больше времени, чем твининг (смотрите следующий раздел).
Установите Flash Professional. Есть множество программ для создания флеш-анимации, но наиболее мощной является Adobe Flash Professional CC. Вы можете бесплатно установить пробную версию этой программы или использовать другой продукт (если вы не хотите регистрироваться на Adobe Creative Cloud). Далее в этой статье описывается работа с Flash Professional.
Так как покадровая анимация требует наличия нескольких изображений (которые немного отличаются друг от друга), то вам нужно создать эти изображения вручную. Для этого воспользуйтесь Adobe Flash Professional или нарисуйте изображения в любом графическом редакторе.
Создайте первый кадр. При первом запуске Adobe Flash Professional вы увидите пустой холст (слой) и пустую временную шкалу. По мере добавления кадров временная шкала будет заполняться автоматически. Вы можете работать со слоями так же, как вы делаете это в Photoshop.
Преобразуйте изображение в символ. В этом случае вы сможете добавить изображение в кадр несколько раз. Это особенно полезно, если вам нужно быстро добавить несколько однотипных картинок в один кадр (например, рыбки в аквариуме).
Добавьте пустые кадры. Если ваш первый ключевой кадр готов, вставьте пустые кадры, а затем приступайте к созданию второго ключевого кадра. Нажмите F5 (четыре или пять раз), чтобы добавить пустые кадры после первого ключевого кадра.
Создайте второй ключевой кадр (после того, как вы добавили несколько пустых кадров). Есть два различных способа сделать это: вы можете скопировать существующий ключевой кадр и внести в него небольшие изменения, или вы можете создать пустой ключевой кадр и добавить в него новое изображение. Если вы используете рисунок, созданный в другой программе, воспользуйтесь вторым способом. Если вы вставляете изображение, созданное при помощи инструментов для рисования Adobe Flash Professional, воспользуйтесь первым методом.
Повторите процесс. После создания двух ключевых кадров повторите процесс – добавьте несколько пустых кадров между каждыми ключевыми кадрами и убедитесь, что анимация будет проигрываться «гладко».
Преобразуйте рисунок. Если вы создали ключевые кадры и траекторию, вы можете преобразовать изображение так, чтобы оно плавно менялось при движении по траектории твина. Вы можете изменить форму, цвет, наклон, размер и любой другой параметр изображения.
Добавьте заключительные штрихи. Проверьте созданную анимацию, нажав Ctrl + Enter. Убедитесь, что рисунок (персонаж) правильно меняется и что анимация воспроизводится с правильной скоростью. Если анимация воспроизводится слишком быстро, уменьшите значение FPS или увеличьте продолжительность твина.
Бесплатная
SWF.max 1.6.865 является многофункциональным проигрывателем файлов Macromedia Flash. Программа SWF.max имеет в своём составе медиа обозреватель, который поддерживает отображение эскизов и позволяет быстро и легко пройти по папкам для поиска Flash клипов с выбором нужного, ориентируясь при этом не только по их названиям, но и просматривая знакомые кадры.
Бесплатная
Flash Movie Player 1.5 является программой, которая проиграет для вас Flash-файлы. Программа Flash Movie Player умеет воспроизводить Flash-файлы в форматах EXE, SWF или FMP.
Бесплатная
Adobe Shockwave Player 11.6.4.634 представляет собой плеер, который предназначен для проигрывания Flash роликов. Технология Adobe Shockwave позволяет насладиться всеми возможностями и яркостью интерактивной 3D-графики при просмотре в интернете.
Бесплатная
Adobe Flash Player 11.1.102.62 является кросс-платформенным модулем, который будет вашим незаменимым инструментом для просмотра мультимедийного интерактивного Flash-контента (файлов FLV и SWF) в различных операционных системах и браузерах. Программа Adobe Flash Player даст возможность его пользователям без всяких ограничений совершать просмотр веб-сайтов, содержащих на своих страницах анимацию, видеоматериалы, игры, приложения и подобный Flash-контент.
Бесплатная
GetFlash 2.5 – это утилита, которая обладает способностью сохранять любые flash-ролики, которые встречаются на веб-страницах. Утилита GetFlash значительно облегчает сохранение роликов и анимации при помощи отображения Flash Toolbar в момент загрузки страницы с роликом или анимацией.
Бесплатная
Flash to Video Encoder Pro 5.2.21 представляет собой конвертер, который работает с флеш роликами в формате SWF и FLV, конвертируя их в видео формат MPEG, AVI, MP4, ASF или WMV. Также программу Flash To Video Encoder PRO можно использовать для записи файлов флеш на DVD диски. Помимо этого конвертер Flash To Video Encoder PRO даёт возможность сохранить каждый кадр в флеш файле в виде изображения в разном формате.
Бесплатная
Flash Saver 6.3 – это программа, которая сохранит flash анимацию с любой из страниц в интернете. Программа Flash Saver работает так же, как и при обычном сохранении картинок в стандартном режиме, то есть, используя для этого нажатие на флеш анимации правой кнопки мышки. Программа встраивается в браузер Internet Explorer и при её использовании не будет необходимости искать ролик, который вам понравился в недавних временных документах и затрачивать на это много времени.
Бесплатная
Alligator Flash Designer 8.0.24 - это программа для создания интерактивной мультипликации (Flash) на веб-сайты. Программа содержит порядка 130 эффектов анимации. Также программа позволяет выбрать onclick или OnOver действие для различных кнопок и даёт возможность сделать сразу же экспорт созданной анимации в формат html.
Бесплатная
SWF Maestro SCR 2.0 – это возможность использовать в качестве заставки для вашего дисплея SWF анимации. При помощи программы SWF Maestro SCR можно создать заставку экрана дл режима ожидания из модной Flash-анимации или демонстрации. Благодаря возможностям программы SWF Maestro SCR, которая компилирует выбранные вами файлы, вы можете использовать для создания заставки для вашего компьютера файлы в формате FLV, XML, JPG, MP3 и другие.
Бесплатная
Учебник по Macromedia Flash 5 является качественным и удобным помощником любому пользователю, ведь раскрывает тайны пользования плеером Macromedia Flash, который необходим для совершения просмотра различных роликов или создания собственных презентаций.
Бесплатная
Save Flash 4.3 будет полезна для многих пользователей, ведь её используют в том случае, когда нужно сохранить файл в формате flv или swf. Если вас увлекла флеш-игра, красивая открытка или баннер, с какого-либо сайта, и вы хотели бы получить её себе на компьютер или отослать другу, то данная программа как раз для вас. Программа SaveFlash отображает URL открытой вами страницы в интернете и показывает размер любого из Flash ролика на ней и предоставляет возможность сохранить любой из них на ваш компьютер.
Бесплатная
Macromedia Flash Player 8.5 b133 RU представляет собой не только удобный и простой в использовании, но и наиболее качественный плеер, который воспроизводит Flash-ролики.
Кажется, Дима Билан прав, говоря, что невозможное - возможно:). Еще совсем недавно веб-разработчикам приходилось либо пиратствовать, либо платить довольно большие деньги за возможность работать с флеш-анимацией. И вот, наконец, настал тот час, когда появился третий полноценный вариант - использовать бесплатный flash-редактор.
Ранее на нашем сайте уже была одна подобная программа , но ее минус был в некоторой устарелости, ограниченном наборе инструментов и отсутствии поддержки языка программирования ActionScript, который так нужен для создания сколь-нибудь функциональных сайтов, игр и т.п. Сегодня же я Вас познакомлю с вполне современным флеш-редактором, который может практически на равных соперничать с именитым Adobe Flash - Vectorian Giotto .
Как видим, разработчики Vectorian Giotto постарались на славу и попытались вместить в свою программу максимально возможный набор функций, аналогичных Adobe Flash. Кроме того, большинство «горячих» клавиш тоже совпадают, поэтому тем, кто привык работать с Эдобовским редактором, не составит особого труда перейти на бесплатную платформу Vectorian Giotto ! Ну, а на «десерт» в бесплатном редакторе есть еще и то, чего иногда так не хватает «старшему брату» - встроенная библиотека анимационных эффектов, которые придутся по вкусу особенно тем, кто создает флеш-баннеры.
Для начала работы с Vectorian Giotto нам потребуется скачать архив с инсталлятором, который весит, между прочим, всего 8 мегабайт! Когда архив будет загружен, откройте его и запустите файл installvectoriangiotto.exe . Несмотря на то, что установка (да и сама программа, как ни прискорбно:)) англоязычная, затруднений она вызвать не должна, поскольку менять что-либо в предложенных по умолчанию настройках необязательно. Просто кликаем кнопку «Next» несколько раз и дожидаемся окончания процесса инсталляции;).
По окончанию установки, если мы ничего не меняли в стандартных настройках, перед нами появится во весь экран рабочее окно Vectorian Giotto :
Как я уже говорил, интерфейс программы англоязычный, поэтому во избежание недоразумений и кривотолков при выполнении дальнейших действий, описанных в статье, я бы хотел ввести кое-какой понятийный аппарат:). Начнем, как обычно, сверху вниз и слева направо.
Строка меню . Это панель, на которой находятся все менюшки программы Vectorian Giotto . При работе с анимацией Вам могут понадобиться такие разделы, как «File» (для сохранения и экспорта в SWF своей анимации), «View» (для настройки параметров отображения рабочей области), «Modify» (для управления параметрами текущего документа и работы с библиотекой эффектов) и «Window» (для настройки отображаемых модулей и панелей программы).
Основная панель инструментов . Сюда вынесены кнопки управления действиями проекта и панель воспроизведения анимации.
Панель рисования (занимает всю левую часть окна программы). Здесь находятся все необходимые инструменты для создания любых желаемых объектов Вашей анимации, а также кнопки, позволяющие настраивать параметры нужных инструментов.
Раскадровка (или таймлайн). Позволяет управлять ячейками для кадров и созданными слоями.
Панель управления цветом . С ее помощью Вы сможете быстро менять цвет ранее созданных фигур. Также служит для выбора типа заливки объектов Вашей анимации (сплошная, градиентная и т.п.).
Рабочая область . Представляет собой виртуальный лист «бумаги», предназначенный для рисования Ваших анимаций:).
Редактор ActionScript . Если Вам нужно создавать не простые баннеры, а нечто более сложное, включающее кнопки и всевозможные интерактивные объекты, то без редактора скриптов Вам не обойтись.
Панель структуры клипа . Отображает все фигуры, находящиеся «в кадре» и позволяет быстро переключаться между ними и управлять их последовательностью.
Панель свойств . У каждого объекта во флеше есть определенные свойства. Для управления ими и служит данная панель.
Панель трансформации . Позволяет быстро изменять размеры и положение выделенного элемента анимации.
Библиотека элементов . Представляет собой список созданных или импортированных объектов, которые могут быть (и неоднократно!) вставлены в анимацию.
У нарисованного нами круга сейчас есть два параметра цвета: «Pen» - обводка и «Brush» - заливка (или дословно - «кисть»). Оба эти параметра можно изменять в Панели управления цветом («Shape»). Но пока нас интересует другое…
На Панели рисования выберем инструмент «Subselection Tool» (белая стрелочка) и нажмем им по нашей фигуре. На заливке внутри круга появятся точечки, а обводка превратится в зеленую линию, разделенную на небольшие отрезки зелеными же точками:). Не пугаемся - это так нужно. Мы вошли в режим правки контура фигуры и теперь, благодаря точкам, которые появились на контуре, мы можем превратить наш круг, например в лимон:).
Для этого захватываем наши точки и тащим в нужное положение. Если точек мало, мы их можем легко добавить. Для этого наведем инструмент «Subselection Tool» на нужную позицию и, зажав на клавиатуре клавишу «Alt», кликнем левой клавишей мыши.
Если у Вас получается слишком острый угол, а Вам его непременно нужно скруглить, то и с этой задачей можно справиться при помощи того же инструмента. Достаточно выделить любую точку на контуре и по бокам от нее появятся рычаги скругления , при помощи которых можно регулировать величину кривизны любого вектора:
Иногда (особенно, если мы рисуем симметрические объекты) удобно пользоваться направляющими . В Vectorian Giotto , как и во Flash, добавить их можно, зажав левую клавишу мыши на линейке (верхней или боковой) и переместив курсор на рабочую область.
Поскольку мы рисуем лимон, то и цвет нужно для него выбрать подходящий. Для того, чтобы изменить его достаточно выделить нашу фигуру и в разделе «Brush» Панели управления цветом кликнуть в палитре по нужному оттенку.
Для того, чтобы наш лимон стал более настоящим активируем инструмент «Pencil Tool» (Карандаш) и дорисуем хвостик и прочие декоративные элементы:
Теперь все готово, но наш лимон пока не является монолитным объектом и состоит из множества мелких деталей. Для того, чтобы «собрать» их в одно целое, нужно превратить наш лимон в символ . Символом во флеше называют сложные объекты, состоящие из множества деталей, которые обрабатываются как единое целое. Для создания символа нашего лимона нам нужно выделить его весь при помощи инструмента «Selection Tool» (черная стрелочка) и вызвать контекстное меню полученного выделения. Здесь остается отыскать пункт «Convert to Symbol» (или нажать кнопку F8 на клавиатуре):
Результатом данного действия станет добавление нашего лимона в библиотеку («Library» ), из которой мы можем его добавлять в анимацию неограниченное количество раз! Естественно, что теперь символ будет обрабатываться как один целый объект, но разделить мы его уже не сможем:
Итак, мы создали объект, который хотим анимировать. Сделать это в Vectorian Giotto можно двумя путями:
Предлагаю сделать анимацию вращения нашего лимона, который находится в первом кадре. Для создания анимации движения нам достаточно, как уже говорилось выше, только добавить еще один немного измененный кадр. Предлагаю выбрать 10-й кадр на таймлайне и нажать на клавиатуре клавишу «F6» . Наш первый кадр «скопируется на 10-й, а между ними появится цепочка промежуточных кадров, полностью идентичных между собой.
А вот теперь - самое главное . На 10-ом кадре нам нужно как-нибудь изменить положение нашего лимона. Мы договорились, что он должен вращаться, поэтому давайте перевернем его на 180°. Для этого можно использовать инструмент «Free Transform Tool» (Свободное трансформирование) или же Панель трансформации (что более удобно в нашем случае). Просто впишем в поле «Rotation» нужный угол поворота (у нас - 180°) и нажмем Enter.
Мы должны получить последовательность из 10-ти кадров, где в первом кадре лимон «смотрит» хвостиком вверх, а в последнем - вниз. Если все сделано правильно, то осталось всего ничего, а именно - превратить последовательность кадров в анимацию движения . Для этого выбираем первый наш кадр на таймлайне и вызываем его контекстное меню (правая кнопка мыши). Затем ищем в появившемся списке действий пункт «Create Motion Tween» и жмем его. У Вас между первым и последним кадром должна появиться черная стрелочка:
Если у Вас получилось, то можно Вас поздравить - Вы создали свою первую анимацию! Посмотреть ее можно, установив курсор на первый кадр и, нажав на панели воспроизведения кнопку «Play » (черный треугольник вправо). К сожалению, в Vectorian Giotto нет функции предварительной компиляции, поэтому просматривать анимацию Вы сможете только на рабочей области, что не так уж и плохо:).
Пока мы работали только с одним объектом, однако, в полноценных анимациях таких объектов могут быть десятки! Если нужно на одной сцене вместить несколько различных символов, то лучше всего размещать их на отдельных слоях. Принцип работы слоев во флеш - аналогичен принципу их работы в графических редакторах. Единственное отличие в том, что слои у нас будут появляться на всех кадрах.
Предлагаю продолжить нашу анимацию и добавить в нее новый элемент - стену , о которую будет ударяться наш лимон и вылетать за кадр.
Первым делом продолжим анимацию вращения лимона. Вставим новый «ключевик» (кнопка F6, если не забыли) в 18-ом кадре . На Панели трансформации увеличим градус вращения до 280° и нажмем Enter. Создадим анимацию движения между 10 и 18 кадрами, вызвав контекстное меню в 10-м кадре и кликнув «Create Motion Tween» .
А сейчас, давайте создадим новый слой . Для этого найдем под раскадровкой небольшую кнопку «Insert Layer» (белый листик с зеленым плюсиком) и нажмем ее. У вас должен появиться новый слой с пустым первым ключевым кадром. Перейдем на 18-й кадр и создадим в нем еще один «ключевик» (клавиша F6). Теперь можно начинать рисовать «стену» . Для этого выберите на панели рисования инструмент «Rectangle Tool» (Прямоугольник) и нарисуйте в правой части кадра небольшую полоску нужного цвета:
Теперь на каждом слое нам нужно создать по ключевому 20-му кадру . В нем наш лимон мы перевернем на 300°, а стену при помощи перетаскивания инструментом «Free Transform Tool» или «Subselection Tool» приблизим впритык к лимону:
Создадим по ключевому 21-му кадру. Здесь мы создадим иллюзию взаимодействия лимона со стеной. При ударе о поверхность все упругие предметы немного деформируются. Для того, чтобы показать эту деформацию мы можем опять же воспользоваться либо инструментом «Free Transform Tool» , либо Панелью трансформации. В нашем случае нужно немного сжать лимон по оси Y, поэтому меняем процентное значение в поле «Y Scale» на Панели трансформации со 100% на 80%, предварительно сняв галочку «Lock ratio» :
Последним штрихом будет вылет нашего лимона за пределы экрана. Для этого создаем на обеих слоях ключевые 25-е кадры и переходим на слой с лимоном. Раз он у нас сжимался по оси Y, то и лететь должен по диагонали. В 25-м кадре возвращаем нашему символу 100% размер и перемещаем его в левый верхний угол так. Чтобы часть его выходила за край кадра. Осталось только вернуться на 21-й кадр и применить анимацию движения:
На этом наша анимация готова и мы можем ее просмотреть, щелкнув «Play» .
В самом начале статьи я упомянул, что Vectorian Giotto выгодно отличается от аналогов не только бесплатностью, но и наличием встроенной библиотеки эффектов! Лучше всего эти эффекты смотрятся, если их применять к тексту. Предлагаю продолжить нашу предыдущую анимацию с лимоном текстовой вставкой. Для этого создадим на слое с лимоном новый ключевой кадр (26-ой), возьмем инструмент «Text Tool» и напишем в рабочей области какой-нибудь текст (например, «Game Over»:)):
Ну, вот мы и разобрались с основами работы в Vectorian Giotto . Единственное, что мы пока не сделали - это не сохранили нашу анимацию. Сохранить готовый ролик можно опять же двумя способами:
Здесь нам предлагают сжать наш ролик, активировав флажок «Compress movie» . Здесь однозначного совета дать не могу… Да, программа сжимает размер ролика где-то на треть, но иногда при активированной опции сжатия еще и обрезает анимацию. Поэтому если решили воспользоваться сжатием обязательно проверьте все ли кадры в итоге оказались на месте;).
Плюсы:
Минусы:
На данный момент Vectorian Giotto - наиболее функциональный бесплатный флеш-редактор, который могут с успехом использовать как начинающие флешеры, так и опытные профессионалы! Начинающим понравится простота и некоторая мультяшность интерфейса, а также возможность создавать красивые эффекты без необходимости знания языков программирования. Профессионалам же Vectorian Giotto может приглянуться именно наличием поддержки языка ActionScript и бесплатностью! Единственным существенным недостатком программы является ее англоязычность, что обычно останавливает новичков. Однако большинство уроков по флешу идут тоже создаются на английской версии Adobe Flash, поэтому особой разницы для Вас, я думаю, нет. А если все же хотите быстро изучить английский, то вот вам программа в помощь;). Дерзайте!
P.S. Данная статья предназначена для свободного распространения. Приветствуется её копирование с сохранением авторства Руслана Тертышного и всех P.S. и P.P.S.
P.P.S. Если Вам не хочется возиться с полноформатным флеш-редактором, а сотворить красивый баннер хочется, то можете воспользоваться следующим приложением: