И. С. Сакович,

руководитель высшей квалификационной категории кружка «Информатика и вычислительная техника» Гомельской городской станции юных техников, Беларусь

СОЗДАНИЕ ТЕСТОВ В СРЕДЕ MACROMEDIA FLASH

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

Тестирование как форма контроля и объективной оценки знаний и умений обучаемых все более привлекает внимание преподавателей - практиков. Однако многих педагогов не устраивают «готовые» тесты: их оформление, содержание, уровень сложности, несоответствие программному материалу. Программа Macromedia Flash предоставляет уникальные возможности для создания «авторских» тестов – красочных, анимационных, интерактивных, рассчитанных на разновозрастные группы обучаемых.

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

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

Типовые правила подготовки материалов для тестового контроля :

основной текст задания содержит не более 8-10 слов;

каждый тест должен выражать одну идею, одну мысль;

задания должны быть краткими, четкими, легко читаемыми;

неправильные ответы должны конструироваться на основе типичных ошибок и быть правдоподобными;

правильные ответы должны располагаться среди всех предлагаемых ответов в случайном порядке;

формулировка заданий не должна содержать двусмысленности и «ловушек»;

следует располагать тесты по возрастанию трудности;

ответы на один вопрос не должны зависеть от ответов на другие вопросы.

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

Для построения тестовых заданий наиболее пригодными методиками являются:

а) выбор варианта (альтернативные);

б) подбор пары;

в) поле ввода;

г) исключение лишнего.

Тестирование становится гораздо интересней, когда вопросы представлены не в стандартной форме, например: голосовой ответ (подходит для изучения иностранных языков), Drag -and -drop (возможность построения или перемещения объектов на экране), область на рисунке (для выбора правильного ответа необходимо отметить область на представленном рисунке) и другие.

Вашему вниманию предлагаются различные варианты тестов, разработанные в среде Macromedia Flash , на занятиях компьютерного кружка. Возраст авторов тестов: 12 – 16 лет.

Тест типа «Правилка»

Размещаем в каждом кадре fla -документа текст задания «Исправьте ошибки в словах», текстовое поле типа Static с текстом вопроса, текстовое поле типа Input c именем otvet для ввода ответа, кнопку перехода к следующему вопросу.

Каждому кадру с вопросами необходимо присвоить имя (например, vopros1, vopros2,…) и поместить на него скрипт stop();

Возможны два варианта сценария при неправильном ответе на вопрос:

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

Переход к следующему вопросу с подсчётом правильных ответов.

В первом случае на кнопку пишется следующий код:

on (release) {

if (otvet==” цыплёнок”)

{ gotoAndPlay(”vopros2”)}

else

{text =”вы не исправили ошибку”;}

}

Во втором случае на кнопку запишем следующий код:

on (release ) {

gotoAndPlay (” vopros 2”); // переход на новый кадр

if (otvet ==”цыплёнок”) // проверка ответа

{n =n +1};

}

Где n – переменная для подсчёта правильных ответов.

Примечание. На первый кадр следует записать следующий скрипт: n =0;

По окончании тестирования для второго варианта сценария необходимо вывести информацию: «Количество правильных ответов: … ». Для этого в текстовое поле типа Dynamic помещается значение переменной n .

Тест с вариантами ответов

Предлагается вопрос и 3-4 варианта ответа на него. Каждому варианту соответствует кнопка, при нажатии на которую осуществляется переход к следующему вопросу.

На каждый кадр с вопросами необходимо поместить скрипт stop();

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

on (release) {

gotoAndPlay(“vopros2”);

n =n +1;

//n – количество правильных ответов

}

На остальные кнопки помещается код:

on (release ) {

gotoAndPlay (“vopros 2”);

}

В последнем кадре flash -ролика следует поместить статический текст «Количество правильных ответов: » и вывести в текстовое поле типа Dynamic значение переменной n .

Иногда для выбора варианта ответа удобней использовать не объекты-кнопки, а сами текстовые записи ответов преобразовывать в кнопки.

Примечание. Условный оператор в этом типе тестов не используется.

Тест с вводом номера правильного ответа

Предлагается вопрос и 3-4 варианта пронумерованных ответов. Создается поле типа Input c именем otvet для ввода номера правильного ответа.

Для перехода к следующему вопросу используется кнопка, на которую помещается следующий код:

on (release ) {

if (otvet ==”…”)

{n=n+1};

gotoAndPlay (“vopros 2”);

}

Результат тестирования в виде количества правильных ответов оформляется в последнем кадре flash -ролика. Можно запоминать номера вопросов с верными вариантами ответа и дополнительно выводить информацию: «Правильные ответы были получены на вопросы со следующими номерами: …».

Тест «Установи соответствие»

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

Для проверки результата на кнопку следует написать следующий код:

on (release ) {

if (kk 1=="3" && kk 2=="5"&& kk 3=="2"

&& kk 4=="4" && kk5=="1" && kk6=="6")

{otvet =" Правильно"}

else {otvet ="Не правильно";}

}

Кроссворд

Рисуется сетка кроссворда. В каждую ячейку кроссворда помещается текстовое поле типа Input , которое получает имя. Для проверки решения кроссворда пишем код:

on (release )

{

if (s 1=="m " && s 2=="i " && s 3=="l "

&& s4=="k" && s5=="b" && s6=="

&& s7=="e" && s8=="a" && s9=="d"

&& s10=="c" && s11=="a" && s12=="r" && s13=="r" && s14=="o" && s15=="t"

&& s16=="t" && s17=="e" && s18=="a")

{otvet=" Всёверно"}

else

{otvet ="Не все слова отгаданы" }

}

Примечание. Задайте для всех текстовых полей выравнивание по центру.

Тест с перемещением объектов (метод Drag -and -Drop )

Для примера используется тест по английскому языку на тему «Произношение звуков»: расположенные на поле слова необходимо перенести в нужное место карусели в соответствии с их звуковым произношением.

Создаем текстовые поля, преобразуем их в кнопки, для перемещения на каждую кнопку пишем код:

on (press) {

startDrag("ka1",false);

}

on (release) {

stopDrag();

}

Гдеka1 – имякнопки.

Чтобы осуществить проверку, необходимо написать следующий условный оператор, учитывая координаты прямоугольных областей:

on (release ) {

if (ka 6._x >-60 && ka 6._x <30 && ka 5._x >-60 && ka 5._x <30 && ka 4._x >-60 && ka 4._x <30 && ka 7._x >-160 && ka 7._x <-110 && ka 8._x >-160 && ka 8._x <-110 && ka 9._x >-160 && ka 9._x <-110 && ka 1._x >100 && ka 1._x <140 && ka 2._x >90 && ka 2._x <150 && ka 3._x >90 && ka 3._x <150 && ka 1._y <100 && ka 2._y <100 && ka 3._y <100 && ka 4._y <100 && ka 5._y <100 && ka 6._y <100 && ka 7._y <100 && ka 8._y <100 && ka 9._y <100 && ka 1._y >-10 && ka 2._y >-10 && ka 3._y >-10 && ka 4._y >-10 && ka 5._y >-10 && ka 6._y >-10 && ka 7._y >-10 && ka 8._y >-10 && ka 9._y >-10)

{otvet =" Правильно"}

Else

{otvet ="Не правильно, попробуйте ещё раз";}

}

Тест «Лабиринт»

Рисуется лабиринт, по которому нужно провести объект, например, шарик. В каждом переходе лабиринта появляется очередной вопрос теста.

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

На кнопку проверки пишется следующий скрипт:

on (release ) {

if (ot ==11) // проверка ответа

{ gotoAndPlay (11);} // движение шарика

else

{ gotoAndPlay (4);} // откат шарика в начало

}

Примечание. Подробнее смотри в журнале «ИиО» № 10-2008.

Рисуются воздушные шарики, количество которых равно количеству вопросов в задании. При неправильных ответах шарики «лопаются» (исчезают). В итоге – сколько шариков осталось, столько было правильных ответов.

Примером служит текст стихотворения с пропущенными буквами. На местах пропусков создаются текстовые поля для ввода (лучше не оставлять их пустыми, а поместить в них символ «.»).

Для наглядности меняем цвет шрифта в полях ввода.

Кнопке проверки соответствует следующий код:

on (release ) {

if(x1!=" и") {q1._alpha=0;}

if(x2!=" о") {q2._alpha=0;}

if(x3!=" ю") {q3._alpha=0;}

if(x4!=" о") {q4._alpha=0;}

if(x5!=" одуванчики") {q5._alpha=0;}

}

Где q 1, …,q 5 – имена клипов-шариков;

x 1, …,x 5 – имена текстовых полей ввода.

Примечание. Свойство alpha характеризует прозрачность объекта. Как альтернативу можно использовать свойство видимости, например, q 1._ visible = false ;

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

Тест «Возводим дом»

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

На первый кадр поместить код, делающий каждый их клипов невидимым:

имя клипа. _ visible = false ;

На кнопку

on (release) {

q1._visible=true; // дверь

gotoAndPlay(“vopros2”);

}

На кнопку c неверным ответом пишем код:

on (release) {

text1=’ двери’;

gotoAndPlay(“vopros2”);

}

При правильных ответах на вопросы теста поэтапно «возводится» дом (становятся видимыми его отдельные фрагменты). В противном случае, под строкой «В доме не хватает:» в подготовленные текстовые поля типа Dynamic последовательно выводятся названия недостающих частей дома.

Тест « Раскрасьрисунок»

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

На кнопку c правильным ответом пишем код:

on (release ) {

gotoAndPlay ("vopros 2");

col=newColor(q1);

col.setRGB(0xFFcc33); // цветзаливки

}

Где q 1 – имя клипа-фрагмента рисунка.

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

Тест-шутка «Отгадайка-ка»

При наведении мышки на нужный объект, он становится видимым. Можно «спрятать» все объекты и искать их, водя мышкой по экрану. Необходимо использовать метод hitTest.

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

onClipEvent (enterFrame) {

if (this.hitTest

(_root._xmouse,_root._ymouse,true))

{_ root . dd 1._ visible = true ; //название города

col = new Color(_root.kr1);

col . setRGB (0 xFF 6600); //цвет красный

}

Тест с использованием компонентов CheckBox

Для оформления ответов на вопросы теста перетаскиваем в рабочий кадр главной сцены нужное количество компонентов CheckBox. В свойстве Label для каждого компонента вводим текст ответа на вопрос. Присваиваем компонентам имена.

Результаты тестирования оформляем в виде таблицы. Стрелка (клип с именем strelka ) указывает на текущий номер вопроса.

На кнопку проверки пишем следующий код:

on (release) {

gotoAndPlay(“vopros2”); //следующий вопрос

strelka ._ y +=17; //перемещение стрелки вниз

//проверка правильности ответа

if (k3.getValue() && !k1.getValue()

&& !k2.getValue())

{ o 2="+";} //занесение символа «+» в таблицу

else

{ o 2="-";} //занесение символа «-» в таблицу

}

Где k1, k 2, k 3 – имена компонентов CheckBox,

o1,…,o 5 – имена текстовых полей типа Dynaniс, расположенных во втором ряду таблицы,

getValue – свойство состояния флажка (true или false ).

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

Работа над созданием тестов в среде Macromedia Flash формирует конструкторские и исследовательские навыки активного творчества, способствует развитию креативного мышления, предоставляет возможность реализовать дизайнерские и художественные способности ребёнка.

Желаю всем удачи, вдохновения и полёта творческой мысли при разработке новых увлекательных тестов!

Введение

1.1 Структура Macromedia Fash

1.2 Принципы использование Macromedia Flash

1.2.1 Использование векторной графики в Macromedia Flash

1.2.2 Использование технология Symbol Conversation в Macromedia Flash

1.2.3 Передача данных в потоковом режиме в Macromedia Flash

1.2.4 Работа со звуком в Macromedia Flash

1.2.5 Использование Action Script в Macromedia Flash

1.3 Разделение данных и их представления

1.4 Существующие решения Macromedia Flash

1.5 Классификация Macromedia Flash

1.7 Сайт Bacardi Original Mojito

1.7.1 Дизайн сайта Bacardi Original Mojito

1.7.2 Структура и навигация сайта Bacardi Original Mojito

1.8 Сайт v5 Design

1.8.1 Дизайн сайта v5 Design

1.8.2 Структура и навигация сайта v5 Design

1.9 Сайт Nokia Trends Lab

1.9.1 Дизайн сайта Nokia Trends Lab

1.9.2 Структура и навигация сайта Nokia Trends Lab

1.10 Характеристики и элементы сайта Oral.kz

1.10.1 Дизайн сайта Oral.kz

1.10.2 Структура и навигация сайта Oral.kz

1.11 Сравнительный анализ используемых технологий flash

2. Применение технологии macromedia flash

2.2 Исследование потребностей различных групп потенциальных посетителей Flash сайта Oral.kz

2.3 Разработка макета Flash сайта Oral

2.3.1 Разработка информационной структуры Flash сайта Oral.kz

2.3.2 Дифференциация доступа пользователей к информации, разработка структуры меню сайта

2.3.3 Разработка дизайна сайта на основе Macromedia Flash

2.3.4 Формирование разделов на сайте Oral.kz

2.4 Создание сайта Oral.kz на программе Macromedia Flash

2.4.1 Создание меню сайта Oral.kz

2.15 Создание flash сайта Oral.kz в Macromedia Flash

2.16 Добавление объектов из библиотеки

2.17 Добавление динамических текстовых полей

2.18 Добавление новых кадров

2.19 Добавление стандартных компонентов в проект

2.20 Оформление теста

3. Экономическое обоснование разработки проекта

3.1 Цель проекта для формирование входных данных расчетов

3.2 Расчет затрат на создание и функционирование сайта

3.3 Оценка срока окупаемости единовременных затрат

4.1.1 Физические опасные и вредные производственные факторы

4.1.2 Повышенная или пониженная температура поверхностей оборудования

4.2 Повышенная или пониженная температура воздуха на рабочем месте

4.3 Повышенный уровень шума на рабочем месте

4.4 Отсутствие или недостаток естественного света, недостаточное освещение рабочего места

Заключение

Список используемой литературы

Введение

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

Macromedia Flash - очень мощное, при этом простое в использовании, средство создания анимированных проектов на основе векторной графики с встроенной поддержкой интерактивности. Flash является идеальным рабочим инструментом для художников и дизайнеров, позволяющим дополнять создаваемые ими Web – проекты анимацией и звуком.

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

Изначально Flash разработки были мало известны пока корпорация Macromedia не предложила переделать один из разделов сервера Walt Disney используя Flash. Это дало большую рекламу Flash технологии. Многие дизайнерские студии начали покупать пакеты программных продуктов для разработки Web страничек при помощи Flash технологии.

На сегодняшний момент существует множество Web-сайтов, построенных с использованием технологии Flash. Есть также довольно много программ, использующих для тех или иных целей Flash-графику. Создано большое количество неплохих Flash-фильмов, которые мы можем увидеть на сайтах http://waterlife.nfb.ca, и др. Существует Дмитрий Дибров, показывающий в телепередаче "Ночная смена" потрясающие по своей невразумительности Flash-ролики. И, наконец, существует целое сообщество «флэшеров».

Предмет исследования данной работы – применение технологии Macromedia Flash для разработки сайта.

1. Основные принципы работы с Macromedia Flash

1.1 Структура Macromedia Fash

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

Macromedia Flash – этот пакет предназначен прежде всего для создания именно анимации. Неподвижные изображения, конечно, с его помощью создавать тоже можно, но профессиональные художники используют его только тогда, когда под рукой нет ничего более подходящего. Для создания неподвижной графики существуют Adobe PhotoShop, Adobe Illustrator, Macromedia Freehand, Macromedia Fireworks и другие программы. Они приспособлены для этого лучше, чем Flash. Имейте это в виду. Главное преимущество Flash в том, что он предлагает непревзойденное сочетание достаточно богатых возможностей создания неподвижных изображений, анимации и интерактивности. В этом смысле все вышеперечисленные программы просто отдыхают. При всех их немалых достоинствах никто из них не может того, что может Flash. То, что проигрыватель Flash установлен на 98% всех компьютеров мира.

Интерфейс Macromedia Flash состоит из окна фильма, панели инструментов и других многочисленных панелей. Размещение всех этих элементов можно настроить в соответствии с собственными предпочтениями.

Пользовательский интерфейс во Flash значительным образом модернизирован. Параметры доступные на панели Property Inspector (Инспектор свойств), являются контекстно-зависимыми и открываются в зависимости от того, какой объект был выделен. Панель Property Inspector позволяет чрезвычайно быстро редактировать объекты. Панели Stroke (Штрих), Fill (Заливка), Text (Текст), Paragraph (Абзац), Character (Знак), Instance (Экземпляр), Frame (Кадр), Effect (Эффект) и Sound (Звук), применявшиеся в программе Flash 5, полностью заменены панелью Property Inspector, изображенном на рисунке 1. К сожалению, мечта реализована не полностью, и доступ к некоторым инструментам (например, Round Rectangle Radius, с помощью которого можно нарисовать прямоугольник со скругленными углами) пока что можно получить только в подразделе Options (Параметры) панели инструментов либо на других панелях. Некоторые параметры повторяются на разных панелях. В частности, параметры заливки и штрихования доступны на панели инструментов, а также на панели Property Inspector и Color Mixer. Тем не менее панель Property Inspector является существенным усовершенствованием интерфейса и практически полностью избавляет от необходимости открывать многочисленные диалоговые окна.

Рисунок 1. Property Inspector (Инспектор свойств)

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

Напомним, что представляет собой покадровая анимация. Это последовательность большого количества однотипных кадров, изображающих различные фазы движения. Такая последовательность очень быстро прокручивается перед зрителем, в результате чего он видит непрерывное движение. Как видите, все достаточно просто. Остается добавить, что на принципе покадровой анимации основаны весь кинематограф и все телевидение. Так что с покадровой анимацией вы сталкиваетесь, когда смотрите вечерние новости. Во Flash присутствует своя библиотека, которая изображена на рисунке 2, она является местом размещения символов и импортированных элементов фильма. Библиотека представляет собой список содержимого, где перед каждым элементом размещена пиктограмма, указывающая на его тип. Элементы можно группировать в папки, каждую из которых можно разворачивать отдельно, что позволит минимизировать прокрутку экрана при просмотре содержимого библиотеки. Как и в случае слоев, количество элементов библиотеки быстро увеличивается по мере разработки проекта, и если их не систематизировать, наступит полная неразбериха.

Рисунок 2. Панель Library (Библиотека)

В версии Flash MX объекты интегрированы более тесно. Теперь кнопки представляют собой истинные объекты, свойствами которых можно управлять посредством ActionScript, а видеоклипы могут получать события кнопок. Панель Actions изображена на рисунке 3.

ActionScript - это язык программирования, посредством которого во Flash осуществляется отправка команд и запросов о временных зависимостях, видеоклипах, кнопках и других объектах. Очень часто с помощью ActionScript можно легко достичь целей, которые в противном случае представляли бы собой труднодостижимую или, вообще, невозможную задачу. ActionScript необходим для реализации любого рода интерактивности, например, отклика после щелчка пользователем кнопкой мыши или нажатия клавиши на клавиатуре. Кроме того, ActionScript является единственным способом реализации перехода к определенному кадру временной шкалы либо начала или остановки воспроизведения видеоклипа. Как правило, при использовании ActionScript удается получить SWF-файлы меньших размеров и с лучшим качеством, чем при создании промежуточных отображений. Еще одним преимуществом является то, что различные задачи удается выполнять с большей точностью, например перемещать видеоклип в точно заданное место рабочей области. Возможности языка ActionScript безграничны, а использовать его очень легко. Знакомство с ActionScript лучше всего начать с панели Actions (Действия).

Компания Macromedia объединила множество мощных идей и технологии в одной программе, позволив пользователям получать через Web целые мультимедийные презентации. На данный момент используя программу Fash, мы можем позволить себе стильный, современный или оживленный виртуальный мир, а Flash баннер может затмить обычные анимированные GIF картины, Flash - клипы (и любые действия в них) можно озвучивать, превращая их мультипликационные ролики, так же, можно создать flash – игры, и пользоваться у посетителей своего сайта большой популярностью. По этим причинам возникает неугасаемое желание каким-либо из способов применить технологию Macromedia Flash. Способы применения этой технологии выражаются в следующих объектах:

· Для создания баннерных профилей на сайте (особенно популярно использование flash для создания больших баннеров на первой странице сайта);

· Для создания промо-разделов сайта (например, для презентации продукта) или промо-блоков;

· Для разработки интерактивной карты регионов;

· Для разработки развлекательных игр, с целью привлечения определенной аудиторию;

· Для разработки flash-версии сайта;

Преимущества использования flash:

· Неизменность вида flash-ролика в зависимости от типа браузера или разрешения экрана;

· Визуальная наглядность и эффектность;

· Возможность записи flash-ролика целиком на CD или DVD.

Этапы работ:

· Проведение интервьюирования Клиента

· Разработка двух различных по концепции вариантов flash

· Согласование выполненных работ с Клиентом, выполнение необходимых доработок

· Предоставление разработанного flash-ролика Клиенту (в электронном виде)

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

Macromedia выпустила Flash-проигрыватели для всех основных операционных систем и типов браузеров, что обеспечило необходимую для Internet кросс - платформенность и популярность этой технологии. Согласно последним опросам в сети Интернет, приблизительно 80% пользователей могут просматривать содержимое Web-сайтов на Flash без загрузки дополнительного программного обеспечения, и только 61% - Web-страницы с элементами Java. Скорее вынужденным шагом было свободное лицензирование Macromedia кода (Free Source licensing program) проигрывателя для Flash, которое ускорит использование формата swf в Web-приложениях нового поколения сторонними производителями программных продуктов.

Использование векторной графики как графического режима по умолчанию делает Flash незаменимым средством разработки для Web. Векторная графика – это объекты, определяемыми математическими уравнениями, или векторами, которые содержат информацию о размере, форме, цвете, границе и местоположении. Это эффектный способ обращения с графикой, в результате которого получаются файлы относительно небольших размеров даже при работе со сложными рисунками. Более того, векторная графика не зависит от разрешения, с которым просматривается объект. Векторная графика на сегодня - идеальное решение для разработки Web -сайтов, позволяющее с равной эффективностью воспроизводить изображения практически на всех типах компьютеров (Pc, Mac, NoteBook) и мониторов.

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

По сути, вектор - это прямая, направленная от точки до точки, так как векторное изображение состоит их координат угловых точек, между которыми проходят прямые. Чтобы изобразить простую линию в растровом формате, потребуется указывать местоположение каждой точки этой линии, для изображения той же линии в векторе, необходимо лишь указать две точки и расстояние между ними, плюс - толщина линии и ее цвет. Естественно, что многие цифровые параметры неоднократно повторяются, именно они и позволяют легко сжимать векторные изображения в два, три раза. В отличие от растровых форматов, таких как GIF и JPEG, используемых в сети повсеместно, векторные изображения - графика, тексты, схемы и анимация легко экспортируются в необычайно компактные файлы формата SWF (Shock Wave Flash), которые быстро грузятся и способны потоковом проигрываться непосредственно в Сети при помощи обычного браузера.

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

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

Цветовые палитры, а также градиентные заливки можно импортировать (и экспортировать) из других графических приложений (например, Macromedia Fireworks и Adobe Photoshop), что обеспечивает неизменность цветов на всем сайте. Палитра сохраняется в файле.fla и не влияет на размер экспортируемого файла.swf. По умолчанию Flash использует палитру web-safe.

Используя свойства технологии Symbol Conversation можно создавать текстовые поля позволяющие вводить данные во время воспроизведения Flash-проекта для создания всевозможных форм сбора сведений от пользователей: ввода паролей, регистрационных, опросных и др. Это, наиболее значительное нововведение и шаг к созданию полноценных Web-сайтов. Кроме того, поля применяются для динамической замены текста. Такое свойство может быть использовано для отображения постоянно обновляемой информации: биржевой, спортивной, прогнозов погоды. Когда пользователь создает текстовое поле, он назначает ему переменную. При этом возможно передавать переменные в разные сцены ролика, в server-side-приложения для занесения их в базы данных и даже загружать новые данные.

Главный решающий фактор, определяющий способность Flash создавать быстро загружающиеся приложения мультимедиа для Web – это передача содержимого в потоковом режиме. Несмотря на другие его достоинства, без этой особенности Flash вряд ли бы стал практичным для использования в Web.

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

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

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

Доказано, что dhtml, html или любой другой стандарт не может быть тесно интегрирован со звуковыми файлами. Фоновый звук, который подключается через тег BGSOUND или EMBED, может иметь формат mid или wav. При использовании первого формата страница начинает бренчать и поскрипывать, но по размеру mid вполне подходит для сети Интернет. Ясно, что mid качеством отличается в обратную сторону. Звуки в формате wav имеют неплохое качество, но размер дает о себе знать, замедляя загрузку сайта, что конечно, зависит от продолжительности звукозаписи.

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

Контроль над звуком происходит с точностью до единичного кадра, и его применение ограничено только воображением. Flash проигрывает звук несколькими способами. Он воспроизводится независимо от времени либо с синхронизацией анимации со звуковой дорожкой. Существует также возможность изменять уровень звука для каждого канала и применять эффект плавного увеличения и уменьшения громкости. Итак, Flash использует два типа звуков - связанный с событием (event sounds) и потоковый (stream sounds). Их главное различие в том, что первый должен полностью загрузиться, а второй начинает воспроизводиться по мере того, как будет получен достаточный объем данных, необходимый для синхронизации с первыми несколькими кадрами. На размер экспортируемого файла.swf значительно влияет степень компрессии, которая может составлять от 8 до 160 kBps и указывается в окне Publish Settings. Flash импортирует звуковые файлы в формате AIFF, WAV и MP3.

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

Возможность создавать кнопки, нажатие которых приводит к выдаче информации и воспроизведению звука или переносящее в другое место фильма проекта. Поэтому презентация в проекте может проходить в предопределённой последовательности или по пути указанному пользователем. Также возможно разработка проекта с какими либо расчетными действиями и обработки какой либо информации с помощью простого, но мощного языка сценариев “Action Script”. Action Script можно рассматривать как основной язык программирования во Flash. С его помощью можно запрограммировать проект Flash на выполнение различных задач. Подобно многим другим языкам программирования, термины Action Script определяют смысловую нагрузку, порядок их следования – логическую структуру, а знаки препинания – контекст.

Для разработки интерактивных элементов во Flash используют три основных компонента: событие (event), порождающее определённое действие, действие (action), порождаемое тем или иным образом событием, и целевой объект (target), выполняющий действие или изменяемый событием. Логическая схема интерактивной функции при которой происходят действия в проекте, может быть представлена следующим образом:

1. Событие – является инициатором какого либо действия в проекте. Во Flash события подразделяются на:

· События мыши/клавиатуры -эти события инициируются пользователем.

· События кадров – если разрабатывается Flash ролик, то по достижении какого либо кадра возникает событие.

· События переменных – событие происходит либо по истечении определённого интервала времени, либо значение переменной достигло того условия для которого запланировано событие.

2. Целевой объект – это непосредственно объект над которым будет проведено действие вызванное событием. Целевые объекты подразделяются на четыре основных типа:

· Текущий проект и его свойства.

· Другой проект и его свойства (если проект находится в рамках основного проекта)

· Графические элементы проекта (кнопка, рамка, фон и т.п.)

· Внешние приложения (Интернет браузер или другие программы)

3. Действие – действия которые выполняются над целевым объектом. Действия в Action Script состоят из самих действий, ссылок на целевой объект и параметров выполнения действий. Параметрами выполнения может быть, как и изменение свойств объекта, так и вычисление математического или логического выражения и присвоения результата его либо свойству объекта, либо какой либо переменной.

Для идентификации объектов или экземпляров проектов в сценариях Action Script им назначаются имена, что позволяет управлять отдельными объектами при помощи Action Script. В последних версиях Flash было включено множество дополнительных возможностей для управления проектов при помощи Action Script. Теперь Flash стал не просто красивой фоновой заставкой для Web сайтов, а полнофункциональным средством для разработки сложных Web сайтов. Flash может вполне применятся и для простых “статических” страничек, так и для многоцелевых сайтов, например: продажа в Интернете, электронная почта и чат.

Прежде всего, договоримся об используемой терминологии в применении к Macromedia Flash:

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

· Атрибут – один из признаков документа. Каждый документ обладает набором признаков – атрибутов. Например, для новости атрибутами являются название, автор, аннотация, текст, дата создания.

· Тип документа – обобщенное понятие документов, обладающих одинаковыми характеристиками. Например, «новость». Подразумевается, что ранее было описано, какими атрибутами обладают документы типа «новость» и далее создаем документы этого типа.

· Структурированные данные – представление данных, при котором каждый атрибут документа представлен отдельно и с ним могут выполняться независимые операции. Как было отмечено ранее, одним из преимуществ использования Macromedia Flash является структурирование информации и разделение содержимого и его представления (данных и дизайна):

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

· Разделение содержимого и его представления предоставляет возможность применения дополнительного сервиса – когда атрибуты хранятся отдельно, с ними можно выполнять дополнительные операции. Например, если у нас автор статьи хранится как отдельное поле, то очень легко просмотреть все статьи данного автора. Если имя автора хранится в тексте статьи, то формирование списка статей автора является отдельной ручной операцией.

· Разделение содержимого и его представления предоставляет возможность интеграции с внешними системами – быстрый экспорт новостей или товаров для обмена с другими ресурсами – сайтами, внутренними системами и т.д.

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

· Разделение содержимого и его представления предоставляет возможность использования одной информации в разных дизайнах – это особенно используется последнее время при создании информационных систем холдингов, когда вся информация хранится в центральной системе, но может быть показана, как на сайте холдинга, так и на сайте отдельного предприятия, но в разных дизайнах.

Macromedia Flash – один из наиболее конкурентных рынков приложений сегодня. Выделим основные классы приложений, где применение Macromedia Flash может отличиться:

· Системы с закрытым исходным кодом

· Системы с открытым исходным кодом

Существует множество приложений, где применяется Macromedia Flash с закрытым исходным кодом от крупных производителей, в основном предназначенных для крупных предприятий и организаций. Наиболее известными приложениями такого класса являются Microsoft Content Management Server, Documentum, Plumtree Portal, IBM WebSphere Portal. Стоимость внедрения проектов на базе данных решений высока. Поэтому сфера их применения узкая и ограничивается в основном созданием интранет-решений для крупных предприятий. Другим достаточно большим классом являются системы с открытым исходным кодом (Open Source). Преимуществами таких систем является доступность, наличие исходного кода, возможность локализации. Однако их использование связано со следующими проблемами:

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

· Узкая сфера применения – чаще всего продукт явился побочным результатом решения одной из собственных задач. Например, разработчики создали сайт-сообщество для общения между собой. И далее решение, на котором работает этот сайт, где применяется Macromedia Flash. Очевидно, что подобное решение может хорошо решать задачи создания такого же рода сайтов, но может быть совершенно неприспособленно для решения задач другого плана (электронная коммерция, b2b и т.д.). Наиболее известными примерами таких систем являются Open Macromedia Flash, PhpNuke, PostNuke, Portal Starter Kit и т.д.

За несколько лет системы управления содержимым веб-ресурсов значительно усовершенствовались. Классифицируем Macromedia Flash по областям применения:

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

· Движки без SQL. Это ответвление в разработке Macromedia Flash развито относительно, так как использование в качестве хранилища информации файлов вместо таблиц базы данных сопряжено с множеством труднорешаемых проблем. Достоинство этих Macromedia Flash – в доступности для модификации контента и возможности размещения на бесплатных хостингах.

· Блог. Происходит от англ. weblog. Русский термин – «сетевой дневник» – это сайт, на котором находятся личные заметки автора. В основном заметками являются ссылки на сайты, которые кажутся владельцу ресурса наиболее интересными, и комментарии к ним. Блог может содержать не только ссылки, но и просто электронный дневник пользователя.

· Игра - развлекательный вид занятий, не связанный с непосредственными задачами жизнеобеспечения. В Macromedia Flash на данном этапе созданы очень множество жанров Flash-игр. В которых можно применять не только для привлечения пользователей, но и использовать в качестве коммерческих целей.

· Фотогалерея - раздел, в котором помещают свои фотографии, или рисунки для общего обозрения. В программе Macromedia Flash эта категория очень развита, где предоставлены множества работ в сети Интернет.

· Гостевая книга – это инструмент для общения на сайте. Сообщения в форуме в чем-то похожи на почтовые – каждое из них имеет автора. Но для того, чтобы отправить сообщение в форум, нужно просто заполнить соответствующую форму на сайте.

· Развлечение – форма с использованием Интернета. Онлайновый проигрыватель, который не только может воспроизводить музыку и видео, но и давать возможность загрузить пользователю личные произведение. Главным стратегическим направлением является эффективное использование информации.

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

· Flash сайт – Bacardi Original Mojito (http://www.originalmojito.pl)

Анимированная графика и водные эффекты в медленном движении придают уникальности сайту, рисунок 4. Опять же вам нужно ввести дату рождения и ваш адрес электронной почты.

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

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

Исследуем эти продукты, отобранные по частоте и качеству упоминания в поисковых системах Google.com и Yandex.ru, на специализированных проектах, а так же согласно рейтингов Flash сайтов:

· Bacardi Original Mojito (http://www.originalmojito.pl)

· v5 Design (http://www.v5design.com)

· Nokia Trends Lab (http://www.nokiatrendslab.pl/)

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

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

Сайт расположен по адресу http://oral-kaz.narod2.ru/. Oral city – это развлекательный flash сайт. Основные направления деятельности данного сайта связаны с творческой деятельностью.

Oral city на сайте можно рассмотреть новости города Уральска, так же присутствует раздел Развлечения, по направлению игровой промышленностью бесплатных flash игр в соответствии с государственным стандартом.

Развлекательная программа предусматривает изучение следующих циклов:

· Аудио структура для развития творческой культуры

· Обще профессиональные видео направления

Основным направлением деятельности сайта является рассмотрения тестево режима сфер по направлению развлекательного flash сайта, что предоставляет правоведения образовательной деятельности по информатике в технологии Flash.

1.10.1 Дизайн сайта Oral.kz

Первая страница сайта Oral.kz представлена в разбитом на блоки виде: внизу слева – заголовок сайта (представляет собой графическое изображение с текстом названия сайта). Так же, имеется блок главного меню, расположены на вверху всех страниц сайта. На главной странице сайта расположен блок новостей города Уральска. Главная страница загружается быстро. Полностью сайт сделан во Flash, что является плюсом для развлекательного сайта. Цвета, шрифты и графика выдержаны в едином стиле. Цветовая схема салатно-зеленого с темным переливом текста. Все страницы сайта выполнены в едином стиле. Блок главного меню на главной странице не отличается от оформления других страниц, на которые осуществляется переход. Данный сайт удовлетворит целевую аудиторию, сразу ясно, что это развлекательный ресурс, на любой странице имеется заголовок с названием сайта. Для того, чтобы найти нужную информацию требуется не более 3х переходов по ссылкам. Главная страница не перегружена излишней информацией. Сайт удовлетворяет запросы целевой аудитории. Графическое оформление не препятствует восприятию информации. Качество графики хорошее. Цвета приятны для глаза. Текст читается легко, с фоном не сливается. Сайт поддерживает масштабирование и может работать в любом разрешении, начина с 800х600 пикселей и выше. Ссылка обратной связи в навигации есть.

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

На основе исследования flash сайтов, консолидирующую основные характеристики данных сайтов, приведено сравнение основных характеристик рассмотренных сайтов. В результате анализа данных, выделим те свойства, которых нет на flash сайте Oral.kz по сравнению с других flash сайтов.

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

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

2. Объединение кадров в действиях перемещения (motion tweens), которые позволяет автоматически просчитать некоторые промежуточные моменты перемещения, для ускорения разработки проектов.

3. Объединение кадров в действиях трансформации (shape tweens), которые позволяет автоматически просчитать некоторые промежуточные моменты трансформации объектов, для ускорения разработки проектов.

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

5. Использование слоёв, для разбиения перекрывающихся объектов клипа.

6. Сокращение числа различных шрифтов и стилей, путём преобразования их в объекты векторной графики.

7. Применение звукового формата mp3, как самого высококачественного и экономного музыкального формата.

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

9. Применение сценариев (Actions Script) вплоть до вставка их в отдельные кадры фильма.

10. Возможность сгруппировывать объекты на различных слоях.

11. Использование встроенных инструментов для изменения цветовых эффектов одного и того же объекта.

12. Использование единой палитры web-safe, во избежание расхождений с цветами браузеров.

13. Применение компонента управления проектом Library, который позволяет быстро найти любой объект и поменять его свойства.

14. Возможность вставки в текущий проект раннее созданный другой проект.

2. Применение технологии Macromedia Flash

2.1 Исследование структуры Flash сайта Oral.kz

Задачей данного параграфа является исследование структуры Flash сайта Oral.kz. Данное исследование проводится путем изучения программы Macromedia Flash, и причины применения возможности к Flash сайту Oral.kz.

В настоящее время Flash сайт Oral.kz сверстан на основе технологии Macromedia Flash версии MX с использованием Action Script. Данная технология подразумевает, что любая информационная страница данного сайта должна быть предварительно оформлена, и утверждена.

Анализ сайта производится на основе исследования содержания меню (разделов) Flash сайта. Результаты анализа информационной структуры представлены в таблице 1.

Таблица 1

Структура Flash сайта Oral.kz

В результате анализа развлекательного Flash сайта Oral.kz определим группы потенциальных посетителей сайта. Определим соответствие «пункт меню (раздел) сайта» – «группа пользователей». Выполним данное сопоставление в табличной форме таблицы 2.

Таблица 2

Информационная потребность групп потенциальных посетителей Flash сайта Oral.kz

Главное навигационное меню (разделы сайта)						Группа посетителей
1 уровень		2 уровень		3 уровень
№	Наименование	№	Наименование	№	Наименование	Наименование
1	ГЛАВНАЯ СТРАНИЦА	1	Новости 1	Все
		2	Новости 2	Все
		3	Новости 3	Все
2	РАЗВЛЕЧЕНИЕ	1	Бродилка	Учащихся
		2	Гонки 1	Учащихся
		3	Гонки 2	Рабочие
3	ФОТОГАЛЕРЕЯ	Все
4	ВИДЕО	Учащихся
5	АУДИО	Учащихся
6	КОНТАКТЫ	Все

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

В целом, структура Flash сайта Oral.kz достаточно грамотно организована, но главное меню состоит их 6 пунктов и имеет пункты, назначение которых не все посетители могут однозначно интерпретировать.

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

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

В связи с тем, что структура и информационное наполнение Flash сайта Oral.kz уже сформировано, нашей задачей является модернизация и применить возможностей Macromedia Flash в сайте Oral.kz, макета сайта и дизайна сайта с учетом использования в основе нового Flash сайта c Macromedia Flash.

Выделим задачи, требующие решаемые в процессе модернизации сайта:

1. Разносторонний стиль для всех страниц.

3. Единая навигация для всех страниц.

4. Использование в основе сайта возможности Macromedia Flash.

5. Разбивка содержимого нового сайта на разделы, категории и статьи по терминологии программы Macromedia Flash.

6. Распараллеливание возможности обновления содержимого сайта сразу между несколькими людьми или группами пользователей.

При разработке макета сайта будем придерживаться следующих критериев:

· Для доступа к нужной информации пользователь должен делать не более 3х переходов по ссылкам.

· Макет страницы должен быть сбалансирован и не перегружен информацией

· Графика не должна мешать пользователю воспринимать информацию

· Сайт должен быть удобен для тех людей, у которых разрешение экрана 600х800 пикселей и выше и поддерживать масштабирование

· На каждой странице должна быть доступна информация об авторских правах и обратная связь

· Навигация должна быть расположена в одном и том же месте на всех страницах

· Навигация должна позволять вернуться на предыдущие подуровни

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

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

· Все – группа, включающая в себя всех посетителей сайта

· Учащихся – посетители, обучающиеся в школе, готовящиеся к поступлению в институт или посетители, являющиеся студентами

На основе исследований, проведенных в таблицах 2.1 и 2.2, сформируем пункты главного навигационного меню на основе потенциальных групп пользователей:

1. Главная

2. Развлечения

3. Фотогалерея

6. Контакты

Самая простая схема меню для сайта (для посетителей) может отражать структуру содержимого:

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

В общем, администратор создает и правильно конфигурирует содержимое сайта в иерархии Разделов, Категории, Статей.

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

На основе исследования и изучения контента flash сайта Oral.kz, используя данные из таблицы 2.3, разработаем структуру меню нового сайта Oral.kz, с возможностями Macromedia Flash.

Раздел – это главный объект в иерархии структуры содержимого. В созданный Раздел добавляют Категории. Сформируем перечень разделов, которые нам надо сформировать в Macromedia Flash. Наименования разделов извлечем из ранее разработанной таб. 2.3 из столбца «Разделы».

В результате получим список разделов, которые следует сформировать:

· Общие сведения о сайте

· Структурные подразделения

· Развлечения

· Фотогалерея

· Видеотека

· Аудиотека

· Карта города

· Новости

· Контакты

Далее сформируем перечисленные выше разделы в системе. Для формирования сначала следует перейти в программу Macromedia Flash. Для работы с разделами необходимо перейти на главную страницу в программе Macromedia Flash. Можно нажать на главной странице панели управления временной шкалой, и выбрать нужный слой в левой панели программы Macromedia Flash. В основном меню будет находиться в нижнем краю сайта, а так же будет находиться информация об авторе.

На панели «Управление слоями», используя кнопки на панели инструментов, можно (перечисление справа налево):

· Открыть в страницу с инструкциями по работе с разделами.

· Создать новый раздел.

· Изменить существующий раздел.

· Удалить существующий раздел.

· Копировать существующий раздел.

Для создания нового раздела следует нажать кнопку «Новый» или на иконку виде знака «Плюс». Будет открыта страница редактирования «Раздел: Новый».

Когда открыта страница редактирования раздела, на листе главной странице программы Macromedia Flash, мы зарисуем дизайн меню, где сразу же укажем разделы нашего сайта, и к каждому разделу укажем свой скрипт ссылкой на страницу раздела. А также можем указать, что документ недоступен для редактирования объекта без программы Macromedia Flash, который открыт для редактирования (раздел, категория, статья и др.) другим пользователям с правами на редактирование данных объектов. Это называется блокировка (checked out). При попытке редактировать уже открытый другим пользователем объект можно будет увидеть значок блокировки справа от имени объекта. Бывает так, что объект остается заблокированным, даже если в данный момент не редактируется. Для разблокировки таких объектов необходимо воспользоваться функцией разблокировки, в главном меню «Система», пункт меню «Снятие всех блокировок».

На странице редактирования «Раздела» кнопок, на панели инструментов можно изменить, щелкнув два раза мышью:

· Открыть в страницу с инструкциями по работе с данным окном (редактирование «Раздела») действует кнопка F1.

· Закрыть страницу редактирования «Раздела» без сохранения изменений. Нажмите кнопку «Отмена».

· Загрузить изображение (сохраняется в папку images).

· В поле «Заголовок» ввести короткое имя раздела, которое будет использоваться в меню или в выпадающих списках панели управления.

· В поле «Название раздела» ввести длинное имя раздела, которое будет использоваться при отображении содержимого раздела на сайте, показывая заголовок раздела.

· В поле «Изображение» выбрать изображение, которое будет использоваться при отображении раздела в меню.

· В поле «Порядок отображения» после применения (сохранения) изменений можно изменить порядок отображения раздела в списке на панели «Управление временной шкалы».

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

· Кнопки на панели инструментов программы Macromedia Flash помогают задавать стиль и формат вводимого текста.

После окончания создания или редактирования раздела, следует нажать кнопку «Сохранить» для сохранения результатов работы и выхода. Можно нажать раздел «Файл» и «Опубликовать» для сохранения результатов, не закрывая программу Macromedia Flash для редактирования.

Используя данные о сайте, дополнительно определенных страниц создадим в Macromedia Flash. На панели инструментов укажем на инструмент квадрат, где послужит нам ввиде информации страницы.

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

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

Таблица 4

Исходные данные

Наименование показателей		измерения	Значения показателя
			Старый сайт oral.kz	нового дизайна сайта oral.kz
1	2	3	4	5
1. Количество посетителей за день	Nз	Пст./день	50	150
2. Время изготовления сайта	Tз	час	50 час	50 час
4. Время изготовления одной рекламы	tд	час	5 час	5 час
5. Стоимость одного часа дизайнера	Сд	тенге	200	200
6. Прибыль от показа рекламы для одного посетителя	Сзд	тенге	10	10
8. Регистрация домена и его обслуживание на год в kz	tбд	тенге	13000	13000
9. Время показа рекламы	T	день	-	30

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

Р = Tз × Сд+tбд

Определим затраты на сайт через стоимость затрат по созданию на год:

Изр = tд × Сд = 5 × 200 = 1000 (тг)

Иг = P + Изр × 12 = 23000 + 12000 = 35000 (тг)

а) суммарные текущие расчеты на функционирование старого сайта с рекламой в год:

Ис = ((Nз × Сзд) × T) × 12 = ((50 × 10) × 30) × 12 = 180000 (тг)

Выявим прибыль без затрат

И = Ис – Иг = 180000 – 35000 = 145000 (тг)

б) суммарные текущие расчеты на функционирование нового сайта с рекламой в год:

Ин = ((Nз × Сзд) × T) × 12 = ((150 × 10) × 30) × 12 = 540000 (тг)

Выявим прибыль без затрат

И = Ин – Иг = 540000 – 35000 = 505000 (тг)

Расчет затрат на создание и функционирование сайта без рекламы на год составляет 23000 тенге. Затраты на изготовления одной рекламы составляет 1000 тенге, а в год на изготовления рекламы затраты составляют в размере 12000 тенге. В год общие затраты составляют 35000 тенге.

Окупаемость старого сайта составляет в размере 145000 тенге в год.

Окупаемость нового сайта составляет в размере 505000 тенге в год.

4. Общие требования безопасности

4.1 Анализ опасных и вредных производственных факторов

Рассмотрим воздействующие на человека опасные и вредные производственные факторы в соответствии с классификацией.

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

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

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

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

Все необходимое для работы выведено на лицевую панель системного блока компьютера.

Если офис имеет автоматическую систему поддержания температуры воздуха кондиционерами или обогревателями, то нужно установить предел в соответствующих правил группе 2 по ГОСТ 22261-76.

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

Основным источником шума является компьютерное оборудование.

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

Повышенный уровень вибрации. Источников вибрации нет.

Повышенный уровень инфра - ультразвуковых колебаний.

Источников колебаний нет.

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

Повышенная или пониженная влажность воздуха.

Модуль управления не оказывает влияния на влажность воздуха.

Повышенная или пониженная подвижность воздуха.

Модуль управления располагается в лаборатории. Под него специально отведено место. Высота лаборатории четыре метра. Поэтому нет преграды для нормальной циркуляции воздуха.

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

Повышенная или пониженная ионизация воздуха.

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

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

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

Питание модуля управления осуществляется от напряжения 220 В частотой 50 Гц.

Монтаж исключает соприкосновение инженера-исследователя с токоведущими частями. Режим сети – с заземленной нейтралью. Для обеспечения электробезопасности применяется защитное зануление.

Повышенный уровень статического электричества.

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

Повышенный уровень электромагнитных излучений.

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

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

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

Заключение

В результате выполнения данной работы были выполнены все задачи.

Решение задачи обзора и сравнительного анализа возможностей и технологических основ Macromedia Flash, в данной работе, выражено в исследовании таких как использование возможности Macromedia Flash по созданию сайта, особенностей структуры сайта на основе Macromedia Flash, существующих решений Macromedia Flash, классификации Macromedia Flash, модели представления данных в Macromedia Flash. Так же был выполнен сравнительный анализ наиболее улучшенный вид сайта на программе Macromedia Flash. На основе исследования, проведенного в ходе выполнения данной задачи. В результате анализа данных о существующих системах сайта, был сделан вывод, что, в зависимости от целей и задач организации сайта, можно применять программу Macromedia Flash. Так для обеспечения работы сайта коммерческой организации наиболее целесообразно использовать Macromedia Flash и его возможности. Это может быть любая из рассмотренных программ Macromedia Flash, т. к. функциональность и качественные характеристики данных систем находятся на одном уровне. Организациям, целесообразно использовать для построения сайта одну из программ Flash систем. Из рассмотренных, в процессе решения данной задачи, Macromedia Flash наиболее универсальная программа, и с наибольшим количеством модулей сообществом разработчиков является Macromedia Flash, так же на данный момент Flash является наиболее бурно развивающейся системой. Таким образом, оптимальным выбором, для построения сайта некоммерческой организации, является Macromedia Flash.

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

1. Единый стиль для всех страниц

3. Единая навигация для всех страниц сайта, использование в основе сайта Macromedia Flash

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

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

Задача разработки дизайна сайта и варианта информационной структуры, рассчитанной на дифференцированный доступ к информации выполнена для всех посетителей. В результате решения данной задачи, с учетом критериев разработки сайтов, был разработан макет главной страницы сайта и макет последующих страниц flash сайта Oral.kz, основанного на Macromedia Flash. Разработан дизайн сайта. Так же была разработана новая информационная структура сайта ПРИПИТ (с учетом основных принципов построения сайтов на основе Macromedia Flash). Данная информационная структура разработана на основе информационной структуры flash сайта Oral.kz. В новой информационной структуре сайта учтены критерии разработки сайтов, а так же особенности структуры сайта, основанного на Macromedia Flash (основные элементы структуры Macromedia Flash: раздел, категория, объект содержимого).

Задача информационного наполнения модернизированного на основе Macromedia Flash сайта Oral.kz выполнена. В процессе выполнения данной задачи были сформированы разделы, категории, созданы объекты содержимого (статьи) сайта, сформировано меню, созданы и привязаны к определенным категориям сайта дополнительные группы пользователей. При создании разделов названия разделов мы извлекли из ранее разработанной таблицы 2.3 из столбца «Разделы».

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

В теоретической части курсового проекта был рассмотрен интерфейс программы, основные моменты и принципы работы.

В практической части более подробно рассмотрена работа с компонентами, создание кнопок, задание параметров Action – скритпа.

Данная курсовая работа может применяться как для обучения основам работы во Flash MX, так и непосредственно для проверки знаний по дисциплине «Теория бухгалтерского учета».

В дальнейшем планируется усовершенствование программной оболочки теста, автоматизация загрузки вопросов и ответов, внесение таймера, увеличение количества как ответов, так и вариантов ответа.

Сп

1. http://www.1ps.ru/

2. http://www.flasher.ru/

3. http://www.helpexe.ru/

4. Чанг Т.К., Кларк Ш. и др. «Популярные web-приложения на Flash MX». Пер. с англ. – М.:КУДИЦ-ОБРАЗ, 2003 – 272с.

5. Уотролл Э., Гербер Н. «Эффективная работа во Flash MX, - СПБ.: Питер; Киев: BHV, 2003. – 720 с.

6. Андрей Акопянц, Системы управления Web-контентом. eCommerce World, №2, 2000.

7. В.А. Козлова, Компьютерные сети и телекоммуникации: Учебное пособие и лабораторный практикум, 2005. – 192 с.

8. Станислав Макаров, Macromedia Flash, 2004. 2005. – 62 с.

9. Валерий Коржов, Использование сетевой модели данных для управления информационным наполнением. Computerworld, №21, 2000.

11. http://www.Flashobzor.ru

12. http://www.Macromedia.ru

13. Bacardi Original Mojito (http://www.originalmojito.pl)

14. v5 Design (http://www.v5design.com)

15. Nokia Trends Lab (http://www.nokiatrendslab.pl/)

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

Применение покадровой анимации также увеличивает размер итогового файла видео, так как вес имеет каждый кадр. В программе Macromedia Flash Professional 8 каждый кадр, содержащий уникальное изображение, называется ключевым кадром . Для создания покадровой анимации нужно нарисовать уникальное изображение в каждом кадре, и таким образом каждый кадр становится после этого ключевым.

Добавление ключевых кадров в Macromedia Flash Professional

Для того, чтобы добавить ключевой кадр , выделите на кадр, который будет ключевым, и выберите в меню Insert — Timeline — Keyframe . Можно также для создания ключевого кадра кликнуть на нужном кадре правой клавишей мыши, и выбрать команду Insert Keyframe .

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

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

Ключевыми кадрами можно сделать не все кадры. Допустим, Вы сделали ключевыми кадры 1, 5, 6, 7 и так далее. Изображение, которое Вы создадите в кадре 1, будет оставаться видимым, пока не дойдет очередь до кадра 5. Таким образом Вы как-бы увеличиваете длительность проигрывания первого кадра в пять раз.

Создание покадровой анимации

1. Сделайте изображение в первом кадре.
2. Выберите кадр, с которого начнется анимация. Сделайте его ключевым с помощью меню Insert — Timeline — Keyframe , или с помощью клика правой клавишей мыши Insert Keyframe .
3. Измените изображение в новом ключевом кадре.
4. Продолжайте добавлять новые ключевые кадры и изменять их содержимое до тех пор, пока анимация не будет готова.
5. Протестируйте Вашу покадровую анимацию, нажав Enter или выбрав в меню Controle — Play .

Копирование изображений при создании покадровой анимации

Для создания изображений в ключевом кадре может возникнуть необходимость копирования изображения, которое есть в другом кадре. Для этого выделите кадр, изображение которого будете копировать, и выберите в меню Edit — Select All , или нажмите клавиши Ctrl+A . Все изображение станет выделенным. После этого копируете изображение с помощью меню Edit — Copy (или Ctrl+C ), затем выделяете ключевой кадр, в который Вы будете копировать изображение, и выбираете меню Edit — Paste in Place (или Ctrl+Shift+V ). Изображение будет вставлено в новый ключевой кадр, и Вам останется только его отредактировать.

Еще проще скопировать сам ключевой кадр, и вставить его в другое место на временной ленте. Для этого нажимаете на кадре, который Вы хотите скопировать, правой клавишей мыши, и выбираете Copy Frame . Нажимаете правой клавишей мыши после этого на кадр, вместо которого хотите поставить скопированный кадр, и выбираете Paste Frame . Кадр будет скопирован.

Работа с кадрами в программе Macromedia Flash

Во время создания покадровой анимации Вам придется работать с кадрами: добавлять ключевые кадры, удалять лишние ключевые кадры, вставлять и удалять обычные кадры. Все это делается либо через меню Edit — Timeline , либо через клик правой клавишей мыши. Кликнув правой клавишей мыши на кадре, Вы можете:

• Insert Frame — вставить кадр;
• Insert Keyframe — вставить ключевой кадр;
• Remote Frames — удалить кадры (один или несколько). Если Вы выделите сразу несколько кадров с помощью перемещения по ним мышкой с нажатой левой клавишей, Вы их сразу все можете удалить.
• Insert Blank Keyframe — вставить пустой ключевой кадр, изображение в котором не будет повторять изображение предыдущего кадра;
• Clear Keyframe — удалить изображение ключевого кадра, при этом он перестанет быть ключевым.
• Clear Frames — удаляет изображение кадров (одного или нескольких). Если удалить изображение ключевого кадра, он станет пустым ключевым кадром.

Создаем анимацию в программе Macromedia Flash

Сделайте такой, или похожий ролик:

и сохраните его с помощью меню File — Save as , в формате .fla .

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

Используйте при создании Вашей покадровой анимации инструмент Text .

Инструмент Text

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

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

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

МИНИСТЕРСТВО ОБРАЗОВАНИЯ ИРКУТСКОЙ ОБЛАСТИ

ИРКУТСКИЙ ИНСТИТУТ ПОВЫШЕНИЯ КВАЛИФИКАЦИИ

РАБОТНИКОВ ОБРАЗОВАНИЯ»

Создание анимации
в программе Macromedia Flash

Основы Flash - технологий

Учебно-методическое пособие

Иркутск, 2008

Печатается по решению Редакционно-издательского совета ИПКРО

УДК 51

ББК 37.92

Создание анимации в программе
Macromedia Flash. Основы Flash – технологий. Учебно-методическое пособие. –Иркутск: ИПКРО, 2008. –104 с.

Рецензенты:

– кандидат физико-математических наук, доцент Иркутского государственного педагогического университета

– кандидат физико-математических наук, доцент, зав. кафедрой ИиМОИ Иркутского государственного педагогического университета.

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

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

ISBN -212-2

© Иркутский ИПКРО, 2008

© , 2008

	Тестирование анимации. Публикация фильма……………………….
	Практическая работа «Создание простого Web – сайта» ………..
	Организация навигации по проекту средствами ActionScript……….
	Пример разработки проекта «Анимация и программирование во Flash»...
	Приложение. Вопросы и задания для самоконтроля………………...
	Литература……………………………………………………………...

Введение

Это пособие предназначено для тех, кто хочет научиться основам работы с программой Flash. Мы будет рассматривать последнюю версию программы Macromedia Flash Professional 8.

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

Flash-технологии, или, как их еще называют, технологии интерактивной web-анимации, были разработаны компанией Macromedia.

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

Adobe Flash, Flash, Adobe Flash Player, Adobe Flash Professional, Macromedia Flash - все это названия программ разработки веб-приложений, игр и мультфильмов под flash-платформу (Flash Platform), наряду с ней существуют и другие инструменты (среды): Adobe Flex Builder, Flash Development Tool (FDT), и другие.

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

В основе Flash-технологии лежит плавное «перетекание» одного ключевого кадра в другой. Это позволяет создавать сложные мультипликационные сцены, задавая лишь несколько ключевых кадров для каждого персонажа. Такая технология применялась задолго до Macromedia Flash. В 1986 году была выпущена программа Fantavision, использовавшая эту технологию. В 1991 году на основе этой технологии была выпущена игра Another World, а двумя годами позже - Flashback. В 1995, после покупки программы для анимации FutureSplash Animator, компания Macromedia выпустила продукт под названием Flash.

Технология Flash использует векторную графику в формате Shockwave Flash (SWF).

Составляющими Flash-технологии являются:

· векторная графика;

· поддержка нескольких видов анимации;

· возможность создания интерактивных элементов интерфейса;

· поддержка взаимодействия с импортируемыми графическими форматами (в том числе растровыми);

· возможность включения синхронного звукового сопровождения;

· обеспечение экспорта Flash-фильмов в формат HTML, а также в любой из графических форматов, используемых в Интернете;

· возможность просмотра Flash-фильмов как в автономном режиме, так и с помощью Web-броузера;

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

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

I . Компьютерная графика и анимация

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

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

В векторных программах удобно работать с текстом, легко создавать геометрические фигуры, проста и легка работа с цветом.

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

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

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

Растровое изображение разбито на множество мелких элементов - пикселов. Цвет каждого пиксела записывается в память компьютера. Если изображение имеет размер 800 пикселов по горизонтали и 600 пикселов по вертикали, то говорят, что картинка имеет размер 800x600. Чем больше количество пикселов в изображении, тем лучше оно выглядит на экране и при печати.

Еще один важный параметр, который нужно знать, чтобы грамотно работать с растровым изображением - тип цветовой модели . Он определяет способ описания цвета или тона каждым пикселом. Например, модель RGB описывает любой цвет как композицию трех основ­ных составляющих: R (R ed) - красный, G (G reen) - зеленый, B (B lue) - синий. Этот параметр особенно важен при подготовке изображения для опре­деленных целей (вывод на экран или на принтер).

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

Компьютерная анимация

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

Как правило, для плавного воспроизведения анимации необходима скорость, или частота кадров, не менее 12 кадров в секунду.

Компьютерная анимация предполагает использование компьютерного оборудования и программного обеспечения для создания анимации.

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

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

Этот метод позволяет создавать анимационные фильмы очень высокого качества.

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

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

II . Знакомство с программой Flash

К концу 20-го века возможности компьютерной анимации достигли уровня обычных видеороликов. Но в Macromedia Flash внедрены такие возможности, о которых не могут и мечтать создатели видеофильмов - это диалог, участие пользователя в анимации. Первоначально это были обычные кнопочки, от нажатия которых происходили те или иные графические изменения. Но очень быстро Macromedia Flash превратилось в среду разработки профессиональных приложений: сайтов, справочников, игр, презентаций. В настоящий момент для создания таких приложений программисту необходимо быть немного дизайнером, знать графические возможности программы Flash и встроенного в нее языка программирования ActionScript.

Общая схема создания Flash-фильмов

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

Основные понятия

При построении любого Flash-фильма используется объектно-ориентированный подход. Это означает, что все элементы фильма интерпретируются как объекты того или другого типа, для каждого из которых заданы некоторые свойства и определен набор допустимых операций. Например, для объекта «Текст» должен быть установлен размер символов, способ начертания, цвет и т. д. Текст можно определенным образом редактировать, вырезать; копировать, создавать на его основе текстовые гиперссылки и т. п. То же самое можно сказать о графических изображениях и о звуке. Тем не менее, при работе с Flash вместо понятия «объект» чаще используется термин символ (Symbol) . Основное различие между ними состоит в следующем.

Символ представляет собой своеобразный шаблон объекта с определенным набором свойств. Символ хранится в специальной библиотеке символов (Library) и может быть многократно использован как в одном и том же фильме, так и в нескольких фильмах. Каждая новая копия символа, помещенная в фильм, называется экземпляром символа (Instance) . Экземпляр наследует все свойства самого символа, и между ними устанавливается связь: при изменении свойств символа соответствующие изменения автоматически применяются ко всем его экземплярам. Механизм символов позволяет сократить и размер фильма: если в нем используется несколько экземпляров символа, то информация о его свойствах не дублируется. Вместе с тем, вы можете изменять некоторые свойства конкретного экземпляра, что не влияет на свойства символа-оригинала. Например, можно изменить размер и цвет экземпляра, а если речь идет о звуковом символе - добавить тот или иной эффект.

Как правило, динамика в Flash-фильмах обеспечивается за счет того, что в течение некоторого интервала времени изменяются те или иные свойства экземпляра (например, координаты, цвет, размер, прозрачность и т. д.), то есть изменяется состояние экземпляра. С каждым состоянием экземпляра связан отдельный кадр фильма (Frame). Кадр, соответствующий изменению состояния экземпляра, называется ключевым кадром (Keyframe) . Ключевой кадр сам рассматривается как объект соответствующего типа, свойства которого пользователь может изменять. Для ключевых кадров предусмотрены некоторые специальные функции и команды.

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

В фильме может использоваться несколько различных объектов. Состояние каждого из них может изменяться независимо от других, либо вообще оставаться неизменным (если, например, некоторый объект используется в качестве фона). Чтобы упростить описание поведения различных элементов фильма, каждый из них помещается, как правило, на отдельный слой (Layer). Разработчики Flash для пояснения роли слоев в фильме сравнивают их с листами прозрачной кальки. Собрав воедино «стопку» таких листов, вы можете получить некую сцену, на которой действуют различные «персонажи». Сцена (Scene) - это еще один термин, используемый при работе с Flash. Каждая сцена представляет собой определенное сочетание слоев. Для простых фильмов бывает достаточно создать и описать одну-единственную сцену, содержащую один слой. Для более сложных может потребоваться создать несколько различных сцен. Переход от одной сцены к другой определяется уже не временной диаграммой, а несколько иным механизмом. В простейшем случае сцены фильма выполняются последовательно, в соответствии с их порядковыми номерами. Для более сложного построения фильма используются средства языка ActionScript.

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

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

Последовательность действий при создании Flash-фильма

При запуске большинства Windows-приложений автоматически создается «заготовка» (пустой документ, бланк) того типа, для работы с которым предназначено данное приложение. Например, при открытии окна текстового процессора Word в нем появляется пустой документ, в который вы можете ввести требуемый текст, добавить графику и т. д. Для нового документа используются параметры, установленные по умолчанию (размер и стиль шрифта, ширина полей и т. п.). Чтобы документ выглядел так, как хотели бы именно вы, целесообразно установить требуемые значения соответствующих параметров.

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

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

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

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

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

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

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

Интерфейс программы Flash

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

Строка заголовка – содержит название программы и имя документа;

Меню – включает все команды, предусмотренные программой;

Временная шкала- служит для контроля длительности показа изображений (управления анимацией).

Панель редактирования (Edit Bar ) - позволяет управлять сценами, редактировать символы, масштабировать рабочую область;

Инспектор свойств – отображает свойства выбранного инструмента, символа, или документа. По умолчанию отображаются свойства документа: размер, цвет фона, частота кадров, параметры публикации и параметры устройства;

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

Все панели можно открыть из основного меню Windows или содержащихся в нем подменю.

Меню View

В программе Flash предусмотрены некоторые возможности, повышающие точность рисования. Это средства для разметки стола и рабочей области: линейки (Rulers ), сетка (Grid ) и направляющие (Guides ). Получить доступ к ним можно через основное меню View .

Направляющие – это горизонтальные и вертикальные линии, которые можно использовать в работе в качестве вспомогательных, чтобы более точно разместить объекты на рабочем поле. Чтобы отобразить на экране направляющие нужно сначала отобразить линейки: View à Rulers . Чтобы отобразить направляющие выберите команду View à Guides à Show Guides , а затем перетащите направляющие с линеек: при перетаскивании направляющей с левой линейки вы получаете вертикальную направляющую, а с верхней – горизонтальную. Чтобы удалить направляющую, перенесите ее обратно на линейку.

Сетка на рабочем поле используется для большего удобства при изменении размеров, аккуратного и точного позиционирования объектов. И сетка, и направляющие видны только во время редактирования фильма, в результирующем ролике они отсутствуют.

Чтобы отобразить сетку, выберите команду View à Grid à Show Grid . Чтобы задать размеры ячейки сетки или изменить цвет линий сетки выберите команду View à Grid à Edit Grid .

III . Рисование в среде Macromedia Flash

В среде Macromedia Flash вы можете создавать векторные рисунки, которые состоят из контуров (Stroke ) и области заливки (Fill ). Отдельные контуры можно нарисовать с помощью инструментов Line (Линия) или Pencil (Карандаш) . Если с помощью этих инструментов вы нарисуете замкнутую область, ее можно будет окрасить произвольным цветом, градиентом или заполнить растровым рисунком, т. е. получить область заливки.

С помощью инструментов Rectangle (Прямоугольник) и Oval (Овал) можно создать одновременно контур и заливку. Инструмент Brush (Кисть) создает только заливку, без контура.

Давайте теперь более подробно рассмотрим панель инструментов и средства рисования, которые на ней расположены.

Панель инструментов разделена на 4 области:

1. Группа Tools (инструменты рисования и выделения);

2. Группа View (позволяет двигать лист и увеличивать/уменьшать изображение);

3. Группа Colors (позволяет выбирать цвет заливки (Fill color ) и контура (Stroke color ) из палитры, менять эти цвета местами, делать один из них прозрачным или устанавливать черно-белый режим);

4. Группа Options (отображает дополнительные возможности каждого инструмента).

Выбор инструмента и его модификаторов (режимов работы) осуществляется нажатием левой клавиши мыши в панели инструментов.

На рис. 3 показана панель инструментов с выбранным инструментов Selection (Стрелка) и в группе Options отображаются модификаторы именно для этого инструмента.

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

Для инструментов, создающих заливку (Rectangle , Oval , Brush , Paint Bucket ) в инспекторе свойств имеется возможность выбрать цвет заливки.

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

Для того чтобы объекты существовали независимо друг от друга или контур и заливка составляли единое целое используют режим рисования Object Drawing (этот режим имеют инструменты Line (Линия) , Pen (Перо), Oval (Овал), Rectangle (прямоугольник), Pencil (карандаш) и Brush (кисть)) или выполняют группировку объектов.

Рис.4 Модификатор Objekt Drawing

Для группировки необходимо выделить объекты, которые нужно сгруппировать (или только обводку и заливку, дважды щелкнув на объекте) и выполнить команду Modify à Group (Изменить à Группировать) . Вокруг выделенных объектов появится голубая ограничивающая рамка. Она означает, что объекты сгруппированы и будут вести себя как единое целое. Напрямую редактирование группы не возможно. Для того чтобы изменить объекты группы, выполните двойной щелчок на содержимом группе. Flash перейдет в режим редактирования данной группы (все остальные объекты приобретут более бледный тон). Выход из режима редактирование группового объекта производится на названии текущей сцены, указанном в левой части панели инструментов Edit Bar . Разгруппировать объекты можно командой Modify à Ungroup (Изменить à Разгруппировать) .

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

Рассмотрим подробнее наиболее часто используемые инструменты.

Инструмент Selection (Стрелка или Выделение) – используется для выделения объектов и изменения их формы. Чтобы выполнить над объектом те или манипуляции, его необходимо предварительно выделить. Во Flash можно выделить объект целиком либо только его часть, группу объектов. Чтобы выделить весь объект, следует выбрать инструмент Selection и затем выполнить одно из двух действий:

· щелкнуть дважды мышью внутри объекта;

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

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

Если контур объекта представляет собой многоугольник (то есть имеет углы), то щелчок на любом участке (отрезке) контура приводит к выделению только этого участка. Чтобы выделить весь такой контур, следует щелкнуть последовательно на всех отрезках контура, удерживая нажатой клавишу Shift . Инструмент Selection можно также применять для редактирования контуров объектов. Для этого требуется подвести указатель к контуру (он не должен быть выделен!). Когда возле указателя появится значок в виде небольшой дуги, нажать левую кнопку мыши и, не отпуская ее, переместить указатель в нужном направлении.

Инструмент Selection имеет параметры Smooth и Straighten – они позволяют улучшить качество рисунков (сгладить линии или выпрямить). Параметр Snap To Objects – привязка к объектам – заставляет создаваемые объекты привязываться к уже имеющимся на рабочем поле (появляется кружочек в той точке, в которой будет произведена привязка).

Инструмент Pencil (Карандаш) – можно использовать для выравнивания линий и сглаживания кривых при рисовании. Для этого предназначены 3 режима модификатора (см. рис.5).

Рис.5 Модификаторы инструмента карандаш; результаты работы инструмента карандаш с использованием разных модификаторов.

Инструмент Line (линия) – предназначен для рисования прямых линий. При нажатой клавише Shift – линии будут строго вертикальными (горизонтальными) или располагаться под углом 45°. При нажатой клавише Alt – рисование линии начинается от середины линии, в обе стороны.

Инструменты Линия и Карандаш создают контуры. Настроить внешний вид контуров можно при помощи инспектора свойств.

Основные параметры настройки – толщина (thickness ) и острые углы (sharp corners ). Дополнительные параметры зависят от типа контура:

Тип Линии	Дополнительные параметры	Возможные значения
Solid (Сплошная)
Dashed (Штриховая)	Dash (длина штриха и интервала)	От 0,25 До 300
Dotted (Точечная)	Dot Spacing (расстояние между точками)	От 0,25 До 300
Ragged (Неровная)	Pattern (Модель)	Solid (Сплошная)
	Simple (Простая)
	Random (Случайная)
	Dotted (Точечная)
	Random Dotted (Точечная случайная)
	Triple Dotted (Тройная точечная)
	Random Triple Dotted (Случайная тройная точечная)
	Wave Height (Высота колебания)	Flat (Ровная)
	Wavy (Волнистая)
	Very Wavy (Очень волнистая)
	Wild (Буйная)
	Wave Length (Длина колебания)	Very Short (Очень короткая)
	Short (Короткая)
	Medium (Средняя)
	Long (Длинная)
Stipple (Точечный Пунктир)	Dot Size (Размер точки)	Tiny (Крошечный)
	Small (Маленький)
	Medium (Средний)
	Large (Большой)
	Dot Variation (Варианты точек)	One Size (Одного размера)
	Small Variation (С небольшими различиями)
	Varied Sizes (Различных размеров)
	Random Sizes (Случайных размеров)
	Density (Плотность)	Very Dense (Очень плотно)
	Dense (Плотно)
	Sparse (Редко)
	Very Sparse (Очень редко)
Hatched (Поперечно-Штриховая)	Thickness (Толщина)	Hairline (Волосяная)
	Thin (Тонкая)
	Medium (Средняя)
	Thick (Толстая)
	Spaсe (Расстояние)	Very Close (Очень близкое)
	Close (Близкое)
	Distant (Удаленное)
	Very Distant (Очень удаленное)
	Jiggle (Невыровненность)
	Bounce (Скачки)
	Loose (Расплывчатая)
	Wild (Буйная)
	Rotate (Наклон)
	Slight (Слабый)
	Medium (Средний)
	Free (Свободный)
	Curve (Кривизна)	Straight (Прямая)
	Slight Curve (Слабая кривизна)
	Medium Curve (Средняя)
	Very Curved (Сильная)
	Length (Длина)	Equal (Одинаковая)
	Slight Variation (Со слабыми различиями)
	Medium Variation (Со средними различиями)
	Random (Случайная)

Выбрать цвет контура можно, воспользовавшись инструментом Stroke Color (группа Colors на панели инструментов). Для этого:

До сих пор мы рассматривали Flash-фильмы, которые воспроизводились без вмешательства зрителя от начала и до конца. Однако Flash позволяет также создавать интерактивные приложения, в которых пользователь может управлять демонстрацией контента. В данном уроке мы начнем знакомство с элементами языка описания сценариев Action Script и рассмотрим, как с его помощью можно создать интерактивные приложения. В качестве примера создадим фотоальбом с элементами интерактивного интерфейса. Но прежде чем приступить к описанию Action Script, следует рассказать еще об одном виде символов, который мы до сих пор оставляли без внимания, - это символы-кнопки. Для построения интерактивного интерфейса они просто необходимы.

Создание кнопок

Кнопка представляет собой четырехкадровый интерактивный мувиклип. Когда мы присваиваем символу тип «Кнопка», Flash создает для нового символа монтажную линейку из четырех кадров:

Up-состояние — это кадр, соответствующий ситуации, когда кнопка не нажата и указатель мыши расположен не над кнопкой;

Over-состояние — кадр, иллюстрирующий вид кнопки, когда указатель мыши расположен над кнопкой, но кнопка не нажата;

Down-состояние — данный кадр показывает вид кнопки при ее нажатии;

Hit-состояние — определяет область, в которой кнопка реагирует на щелчок мыши; эту область в клипе не видно.

Чтобы создать кнопку, выполните команду Insert => New Symbol (можно набрать сочетание клавиш Control+F8). В появившемся диалоговом окне Create New Symbol введите имя символа-кнопки (например, but1) и выберите тип символа Button («Кнопка»).

Flash переключится в режим редактирования символа, предоставив кадры Up, Over, Down и Hit. Первый кадр, Up, становится пустым ключевым кадром. Нарисуем в этом кадре ненажатый вид кнопки (рис. 1).

Рис. 1. UP-кадр кнопки

Выделим второй кадр, помеченный как Over и соответствующий состоянию, когда курсор занесен над кнопкой. Вставим в этом кадре ключевой фрейм (по команде Insert => Keyframe), в результате чего появится ключевой кадр, полностью повторяющий содержание Up-кадра. Изменим цвет кнопки, как показано на рис. 2.

Рис 2. Over-кадр кнопки

Аналогично добавим следующий кадр (Down-кадр) и нарисуем нажатое состояние кнопки (рис. 3).

Рис. 3. Down-кадр кнопки

В Hit-кадре пока не будем ничего рисовать, а вернемся к этому кадру чуть позже.

Перейдем к основной сцене, вызовем библиотеку по команде Window => Library и создадим экземпляр символа кнопки путем перетаскивания его на сцену (рис. 4.)

Рис. 4. Создадим экземпляр кнопки, перетащив его из библиотеки

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

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

Рис. 5. Hit-кадр кнопки

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

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

Понятие об Action Script

Action Script представляет собой язык написания сценария - набора инструкций, которые управляют элементами Flash-фильма. Сценарии Action Script могут быть встроены в фильм или храниться во внешнем текстовом файле с расширением AS.

При встраивании сценария в фильм его можно внедрять в разные части фильма. Точнее, сценарии Action Script могут содержать ключевые кадры, экземпляры кнопок и экземпляры мувиклипов. Соответственно сценарии называются сценариями кадра (Frame Action), сценарием кнопки (Button Action) и сценарием клипа (MovieClip Action).

Сценарии Action Script выполняются по наступлении определенных событий, инициированных пользователем или системой. Механизм, который указывает программе Flash, какой оператор следует выполнить при наступлении того или иного события, называется обработчиком событий.

Action Script имеет собственный синтаксис, во многом схожий с синтаксисом JavaScript. Flash MX 2004 поддерживает Action Script всех предыдущих версий Flash.

Одним из основных понятий Action Script являются Actions - команды, которые выдают инструкции во время исполнения SWF-файла. Например, gotoAndStop() отсылает воспроизводящую головку (Рlayhead) на определенный кадр или метку. От слова Actions и происходит название языка - Action Script (дословно - сценарий действий). С большинством понятий этого языка мы ознакомимся на конкретных примерах.

Интерактивный фотоальбом

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

Поместим на основной монтажной линейке первое фото и добавим кнопку из стандартного набора. Для доступа к нужной папке следует выполнить команду Windows => Сontrol Panels Common Libraries => Buttons (рис. 6).

Рис. 6. Добавим кнопку из стандартной библиотеки

В результате выполнения данной команды появится панель, содержащая большой набор заранее нарисованных кнопок различных типов. Выберем, например, Key Buttons (кнопки, похожие на клавиатурные клавиши), откроем соответствующую папку, выберем кнопку key-left (рис. 7) и создадим экземпляр данной кнопки (путем перетаскивания ее на сцену).

Рис. 7. Элементы папки Key Buttons

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

Рис. 8. Автоматическое выравнивание кнопок на одном уровне

Для того чтобы добавить сценарий, необходимо вызвать редактор Action Script по команде Window =>Development Panels => Actions или нажав клавишу F9. Если вы собираетесь часто писать скрипты, то эту клавиатурную команду стоит запомнить. В результате появится редактор Action Script (рис. 9).

Рис. 9. Панели редактора Action Script

Если вы поэкспериментируете, выделяя различные элементы на сцене, одновременно отслеживая сообщения в панелях редактора Action Script, то обнаружите, что программа подсказывает, на какой элемент можно «вешать» код. Если выделить на сцене кадр, то в верхнем левом углу панели редактора появляется надпись Actions - Frame, если щелкнуть по кнопке, то появится надпись Actions - Button, то есть программа подсказывает, что вводимый код будет относиться к сценарию кнопки. А если выделить фотографию, то в поле, предназначенном для ввода скрипта, появится сообщение: Current selection cannot have actions applied to it (к данному выделенному объекту нельзя применить сценария).

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

Итак, для кнопки со стрелкой влево нам нужно формализовать следующий сценарий: «Если кнопка отпускается на некотором кадре, то с этого кадра необходимо перейти на предыдущий кадр». В соответствии с синтаксисом языка Action Script (рис. 10) это будет выглядеть следующим образом:

В первой строчке записан обработчик событий кнопки on(), имеющий формат:

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

Если запустить на исполнение созданный фильм, то кадры будут непрерывно проигрываться один за другим, а следовательно, прежде всего нам нужно дать команду «Стоп» на первом кадре. Для этого первому кадру добавим соответствующую команду (рис. 11).

Рис. 11. Сценарий, присвоенный первому кадру

Обратите внимание: команда присваивается уже не кнопке, а кадру. Тот факт, что кадру присвоен сценарий, отмечается на основной монтажной линейке - в обозначении кадра над жирной точкой появляется строчная буква «a».

В результате мы получили следующий фильм .

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

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

Рис. 12. Кнопки из папки Circle Buttons

На кнопку перехода к первому кадру (третья слева на рис. 13) повесим код, как показано на рис. 13.

Рис. 13. Сценарий для кнопки «В первый кадр»

В случае с фотоальбомом из пяти кадров в последнюю кнопку добавим сценарий перехода «В последний кадр»:

Автоматизированное написание скрипта

До сих пор мы набирали все команды вручную, однако панели редактора ActionScript предоставляют целый ряд сервисов для автоматизированного написания скрипта. Рассмотрим эти возможности.

Рис. 14. Средства автоматизированного написания скрипта

Панель редактора Action Script позволяет выбирать, перетаскивать, перераспределять и удалять команды.

Покажем, как можно написать тот же скрипт для кнопки «Вперед» в автоматизированном режиме. Выбрав папку Movie Clip Control (верхнее левое окно на рис. 14) можно получить доступ к обработчику событий on, а далее нужно либо дважды щелкнуть по соответствующему пункту, либо перетащить выражение на поле написания скрипта в режиме Drag and Drop.

Рис. 15. Подсказка для завершения выражения

В результате на рабочем поле появится необходимое выражение и подсказка вида (рис. 15): вы выбираете из меню нужную команду и выражение завершается автоматически. Как видно из меню, можно выбрать не только условие, связанное с экранными кнопками, - можно, также, выбрать из меню рис. 15 пункт keyPress “”, или keyPress “”, что соответствует нажатию клавиатурных клавиш (стрелка влево, стрелка вправо), то есть имеется возможность создать фотоальбом, который будет «перелистываться» с помощью клавиш клавиатуры.

Рис. 16. Обращения к кнопке клавиатуры

Задействуем команду keyPress “” (рис. 16), затем перейдем в папку Timeline Control, выберем команду nextFrame и перетащим ее на рабочее поле (рис. 17).

Рис. 17. Команду nextFrame можно найти в папке Timeline Control

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

Стрелочки в подсказке позволяют просмотреть разные варианты синтаксиса. Программа предоставляет два варианта (рис. 18 и 19), то есть предлагает задать сцену и кадр или только кадр. В нашем случае достаточно указать только кадр (Frame). Если название сцены опущено, то по умолчанию осуществляется переход к кадру текущей сцены.

Рис. 18. Подсказка по возможному синтаксису команды

Рис. 19. Стрелочка-треугольник позволяет просматривать варианты синтаксиса

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

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

Рис. 20. При введении запятой в списке событий автоматически появляется меню дополнительных команд

Добавим к первому событию (нажатие клавиатурной кнопки) второе событие (отпускание экранной кнопки):

on (keyPress "", release)

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

В рассмотренном примере мы использовали переход по номеру кадра, но этот способ не всегда удобен: если в процессе редактирования фильма нумерация кадров изменится, то логика может нарушиться. Более удобно использовать переход по метке кадра. Рассмотрим пример, в котором потребуется не только перелистывание альбома, но и переход к разным разделам, то есть более сложная навигация.

Пусть альбом будет состоять из рисунков, компьютерной графики и фотографий.

Первому кадру раздела «рисунки» дадим метку Pictures, аналогично первым кадрам других разделов присвоим метки graphics и photo.

Создадим слой для размещения меток и назовем его Lables. Для того чтобы поставить метку кадру, в панели Properties необходимо выбрать тип метки Name и записать ее имя. В нашем случае Pictures (рис. 21). Аналогично разместим метки в кадрах 5 и 10 (рис. 22).

Рис. 21. Пример присвоения кадру метки

Теперь добавим новый слой и назовем его Actions. В первом ключевом кадре слоя Actions вызовем панель Actions Frame (путем нажатия кнопки F9) и наберем команду stop () (см. рис. 22)

Рис. 22. Сценарий первого кадра

Добавим еще один слой под именем Subjects (тематика), в котором дадим заглавия соответствующим кадрам: «Рисунки» (рис. 23), «Графика» и «Фото».

Рис. 23. Заглавие для кадров раздела «Рисунки»

Теперь добавим сбоку кнопки меню с аналогичными именами, которые расположим на новом слое под названием Мenu.

Напечатаем с левого края первый пункт меню «Рисунки» и переведем его в кнопочный символ. С помощью инструмента Arrow выделим текстовый блок «Рисунки» и выполним команду Modify => Convert to Symbol (эту команду можно выполнить и с помощью клавиши F8), в панели Convert to Symbol зададим тип символа Button и определим его имя как pictureButton (рис. 24).

Рис. 24. Назначим кнопке перехода к разделу рисунков имя рictureButton

Создадим четыре кадра для кнопки «Рисунки»: первый будет представлять просто исходный текст (рис. 25), второй - тот же текст только синего цвета, третий кадр мы пропустим (в этом случае Down-кадр будет такой же, как и Over-кадр), а в Hit-кадре нарисуем прямоугольную область, которая определит область нажатия кнопки (рис. 26).

Рис. 25. Up-кадр кнопки pictureButton

Рис. 26. Hit-кадр кнопки pictureButton

Теперь нам нужно повесить сценарий на вновь созданную кнопку. Для этого выделим кнопку в сцене Scene 1 и, нажав F9, вызовем панель Actions, а затем внесем код, показанный на рис. 27.

Рис. 27. Сценарий перехода на кадр с меткой

Android