Передовой опыт — руководство по созданию SWF-приложений. Как сделать Flash ссылкой

Вот такую флешку я получила в программе SWF Text

Дождитесь полной загрузки. Не забудьте включить звук!!!

Для создания этой флешки я использовала програмку SWF Text. О самой программе и о том, как в ней работать я узнала из сообщения
(Спасибо за ссылочку * NIKA * )

SWF Text - программа для создания анимированного Flash текста. Вы можете использовать более 150 текстовых эффектов и более 20 эффектов фона, можете изменять по вашему усмотрению все свойства текста, включая шрифт, цвет, формат, и т.п.
С SWF Text, без любого опыта работы с Flash вы может легко создать красивый баннер или вводную страницу за несколько минут. Все что вам нужно сделать - ввести текст, выбрать шрифт и настроить эффекты.

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

Поэтому последовательность действий такова...
1. Сохраняем флешку в формате SWF
2. Кроме этого нам потребуется картинка
(значит сохраним нашу флешку на компьютер еще в формате GIF дополнительно)

Теперь нам надо определить нашу флешку куда-то в интернет, чтобы у нее появился законный Адрес.
Для этой цели я использовала свой дневник на Лиру.

Делаем это так...
В дневнике на ЛиРу открываем новую запись, и прикрепляем флешку (SWF) как картинку:
... (в полной форме под записью справа сбоку есть окошко "Прикрепить файл" ,
открываем окошко"Обзор", находим свою флешку, кликаем на нее),
и сохраняем в Черновик.
Потом идем в Черновик - там уже лежит наша флешка, только маленькая...и играет
Открываем ее для редактирования, увеличиваем размеры, и опубликовываем в дневник.
Отсюда же берем и адрес флешки в интернете, чтобы потом в блогах туда сослаться при изготовлении баннера.

Теперь о второй части - картинке формата GIF.
У меня она получилась очень тяжелой, - (более 5 Мбайт) и примерно - 80 слоев.

Задача - облегчить картинку.

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

В итоге вес картинки уменьшился в 10 раз и стал равен 586 Кбайт
(для сравнения у almiria картинка весит 3,22 Мбайт, т.е. в 6 раз больше - но она и красивее и больше в размере).
Здесь должен быть разумный компромисс.

В принципе, используя видеоформат AVI можно закачать флешку на Видео.Мей.ру так. как я делала это в

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

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

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

Вариант 3 (частично рабочий) . Чтобы избавить flash от бесконечного z-index"a, разработчики flash"a дали нам удобный параметр: Или же просто wmode="opaque" , если встраиваете flash через .

Здесь у нас получается следующий вариант:

Но и это еще не все! Ведь данный вариант, если в ссылке нет никакого текста, странным образом отказывается работать в IE 6-9 (если в ссылке все же будет текст, то этот текст поверх flash-баннера будет вполне кликабельным в IE), и как обычно для осла нам потребуется специальный костыль...

Вариант 4 (100% рабочий)

Чтобы вариант 3 работал и в IE, необходим уникальный костыль — задать для ссылки прозрачный бэкграунд при помощи однопиксельной прозрачной картинки (в данном случае s.gif):

Данный вариант работает во всех популярных браузерах. Я лично проверил на IE7-9, актуальных на сегодня версиях FF, Safari, Opera.

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

Что за файл.swf ?
Файл SWF - flash-анимация, созданная с помощью Adobe Flash или другой программы для разработки flash-приложений. Флеш-ролики могут содержать как обычный текст, так и векторные, растровые изображения, 3D-графику (ограниченно), аудио, видео, сценарии на языке ActionScript.

Платформа Flash получила очень широкое распространение в сфере создания интерактивных приложений. Это могут быть flash-мультфильмы, игры, видеоролики (файлы формата.FLV), web-сайты, созданые полностью или частично с применением данной технологии.

Ну а дальше по инструкции с сайта.

Для открытия, запускаете браузер (желательно создать новую вкладку в нем), "берете" ЛКМ за Ваш файл swf и перетаскиваете его в браузер.

2 вариант
Через программу.
Существует 2 хорошие программы для открытия таких файлов - это (оф. сайта не нашел) и .

Насчет второй - она бесплатная, но англоязычная и разработчики что то забили перестали выпускать обновления на неё и она максимум для XP пойдет.
Если заблудитесь на сайте производителя и не найдете как скачать эту прогу:
выбираете в верхнем меню вкладку Downloads

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

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

Для создания флеш баннера онлайн перейдите по ссылке .

В генераторе Banner Now нажмите на кнопку “Create Banner Now”.

На новой странице выбираем размеры будущего баннера.

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

Снова нажимаем кнопку “create banner”.

Вот мы и попали в редактор флеш баннеров. Если вас не устроил выбор вашего фона, то вы можете выбрать новый. Под рабочей областью документа в найдете галерею изображений (Image Gallery) и кнопку Upload files (загружаем свое фото в редактор). После добавления фона отредактируйте его положение и размеры, потянув мышкой за края изображения.

Используете предварительный просмотр (Preview Banner) для контроля за работой на промежуточных этапах.

Справа от рабочей зоны мы видим слои. Вы можете регулировать прозрачность (свойство alpha), менять последовательность слоев и удалять ненужные.

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

Меняем длительность слайда, изменяя время возле значка часов (найдете также под слайдом).

Сверху рабочей зоны вы видите эффекты для текста. Они разбиты на категории:

• appear (появление),
• stay (статичные),
• disappear (исчезновение).

Если вы нажмете на кнопку рядом с эффектами, то можете выбрать эффект для изображения.

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

Когда вы создали флеш баннер онлайн, нужно его скачать. Нажмите на кнопку download banner (swf).

Здесь проставляем настройки:

• autoplay (автоплей),
• repeat (повтор),
• button mode (режим кнопки),
• banner hyperlink (страница, на которую баннер будет ссылаться),
• open url in new page (открывать страницу в новом окне),
• use preload (использовать изображение загрузки страницы),
• send cope of banner to my e-mail (отправить копию баннера на мой e-mail).

Вот такой баннер получился у нас:

Предлагаю вам еще несколько генераторов флеш баннеров с поддержкой русского языка:

• www.animationonline.com
• www.lact.ru/banner/en
• www.flash-banner-maker-online.com/customsizebanner3.php

Эти сервисы более просты в использовании, поэтому инструкция по применению не требуется.

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

Многие создатели инфопродуктов, интерактивных интерфейсов, игр, баннерных материалов, видео и прочей анимации уже знакомы с SWF файлам и активно с ними взаимодействуют.

Этот формат работает с Flash-анимацией, векторной графикой, аудио, видео в сети интернет. Воспроизводиться любым браузером с установленным Flash Player.

У этого формата есть ряд достоинств, среди которых:

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

Если вы являетесь одним из тех, кто планирует заниматься работой с Flash медиа-файлами, вам понадобиться софт, а так же определённые знания. Какие? Читайте далее…

Программа для создания SWF

Для создания SWF-анимации вам нужен Adobe Flash. Программа коммерческая (платная), однако учитывая, что мы живем в мире «пиратства» и «беззакония», вы наверняка без проблем найдете крякнутую версию в Яндексе.

Но помните, пиратство преследуется законом! Так что, это все на вашей совести =)

Есть аналоги, например — Sothink SWF Quicker . К сожалению, программа тоже не бесплатная.

Видео уроки по созданию Flash

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

В профиле вы найдете еще очень много полезного материала по работе с Flash, в честности по созданию SWF-файлов .