Tell me and I will forget Show me

“Tell me and I will forget, Show me, and I will remember, Let me do it and I will understand. ”

СЪДЪРЖАНИЕ I. III. IV. Въведение във Flash CS 5 – запознаване с основните термини, менюта, ленти, панели, работа с инструментите. Малко история Flash Lite. Предимства на Flash Създаване на анимации Задаване на общи настройки на movie преди неговото публикуване, еxport и тестването му. Времедиаграми и кадри, слоеве. Някои полезни клавишни комбинации и възможност за настройването им. Вграждане на филм в уеб страница. Оптимизиране на филми.

СЪДЪРЖАНИЕ V. Въведение в Action. Script 3. 0 Елементи на езика. Основни стандарти на езика. Прилики и разлики между Аction. Script 1. 0 и Аction. Script 2. 0. Аction. Script 3. 0. Планиране на проекти в интерактивния дизайн. Упражнение: създаване и тестване на първи скриптове.

СЪДЪРЖАНИЕ VI. Създаване на графични изображения Запълвания и очертания Векторни и растерни изображения Работа с цветове Създаване на графични символи Маски Използване на библиотеки Импортиране и оптимизация на изображения. VII. Литература

Въведение във Flash CS 5 – малко история Всичко започва в не толкова далечната 1996 г. Появява се plug-in за Netscape 2. 0 Web browser, който позволява разглеждането на малки анимации. Неговото име било Future. Splash. А Future. Splash е оригиналното име на продукта, който ние познаваме като Flash, инсталиран според статистиките на много повече устройства, в сравнение със софтуери като - Microsoft Windows, DOS; ), и Minesweep. Изгревът на Нова ера Flash е създаден като отговор на нуждата от по-съвършена и „лека” Уеб анимация. В зората на Интернет, в тези мъгляви далечни дни на 1995 единственият формат за добавяне на анимация бил прословутият анимиран GIF. Който представлява просто серия от bitmap картинки, подредени една след друга. Крайният файл става голям, тромав, а за интерактивност въобще не може и да се говори.

Въведение във Flash CS 5 – малко история Future. Wave, малка компания от шестима човека решили да променят ситуацията на GIF-господството; ) и създали нов продукт, наречен Future. Splash. Следващата картинка е screen shot от първия версия на Future. Splash.

Въведение във Flash CS 5 – малко история Мощта на новия инструмент се основавала на проста технология: векторната графика. Като използват вектори дизайнерите могат да създават поредица от сложни анимации и да ги комплектоват в много малки файлове. (Можете да видите, че цялостният интерфейс на Future. Splash не се е променил глобално през последните 10 години. ) Future. Splash става хит. Сайтове като MSN homepage започват да го използват широко. Създават се и взаимоотношения между Future. Wave и Disney. По това време Disney използва едновременно Macromedia's Shock. Wave и Future. Splash, за изграждането на уеб сайта си. Но било въпрос на време Macromedia да придобие Future. Wave и скоро се родил Flash 1. 0.

Въведение във Flash CS 5 – малко история Следващата забележителна Flash версия била Flash 3. 0 представя концепцията FSCommands, представляваща лесен начин за добавяне на програмируема функционалност на нашите Flash филми. FSCommands се налага и издига Macromedia на върха. Скоро се появява и Flash 4 с още повече и по-сложни възможности, една от които е съвсем нова – ражда се нов скриптов език за програмиране в Flash. Представена е първата версия на Action. Script. След това предимствата на Flash стават наистина големи. Векторната анимация, придружена със скриптовия език бързо правят Flash популярен в уеб. Macromedia бързо осъзнават, че това е шансът им да променят обстановката в Интернет пространството в световен мащаб. В началото някой смятали даже че Flash ще замести HTML като инструмент за създаване на цялостни Уеб сайтове, но това бързо било отхвърлено като идея като непрактично и Macromedia се заловила с усъвършенстването на Flash като силен Web инструмент.

Въведение във Flash CS 5 – малко история Скоро на бял свят излиза и Flash 5 – една от най-важните като нововъведения версии. Macromedia прави предприемчив ход – преустройва Action. Script. Фактически Flash 4 се популяризира и заради възможността за скриптово програмиране. А новото във Flash 5 е въвеждането в Action. Script на структурни елементи от ECMA scripting, по-известен като Java. Script. Macromedia използват като предимство довода, че знаещите Java. Script лесно могат да започнат с програмиране на Action. Script. Flash 6 обогатява още Action. Script и представя нови технологии — две от най-важите са Компонентите и възможността за вграждане на Видео. Компонентите се появяват още във Flash 5 като Smart. Clips, но в новата версия са структурно променени. Видеото, обаче е голямата печеливша карта. Днес то се използва навсякъде в Web — даже повече от Real Player, Windows Media и Quick. Time последно време. Най-големият негов потребител е Google, но може да го видите и на сайтове като News. com и Weather. com.

Въведение във Flash CS 5 – малко история Flash 7 надстройва Action. Script към версия 2. 0 и прави езикa наистина обектно-ориентиран. Следва Flash 8 и голям тласък напред за Flash е вече налице с Flex 4. Adobe® Flex™ 4 е мощно средство за създаване и доставяне на така наречените Rich Internet Applications (RIAs) в рамките на фирмите и в Интернет. Позволява предприятията да създават персонализирани, мултимедийни приложения, които позволяват лесното обогатяване на потребителския опит във взаимодействието с Интернет. Сега има и Action. Script версия 3. 0 с цел да могат приложенията писани с него да се изпълняват със скоростта на обикновено приложение, работещо под нашата операционна система. Следващата версия - Flash 9 вече позволява създаването на приложения чрез Action. Script 3. 0. През 2005, Adobe купи Macromedia и сложи отпечатък върху цялата й продуктова линия. Flash, обаче оцеля. След множество версии и три компании той си остава ядрото при дизайна и разработката на Уеб сайтове и приложения под крилото на Adobе.

Въведение във Flash CS 5 – малко история В този курс ще разгледаме Flash CS 5. С него имаме основно 5 начина за създаване на анимация с Flash (без да включваме тук Action. Script; ): - frame-by-frame анимация - с clasic и shape tweening - с motion tweening създавате обект и дефинирате промени към неговите характеристики по време на изпълнение на анимацията. Програмата създава серия от картини, в които се трансформират и променят обектите. - чрез възможностите на Flash за използване на кинематиката, при които се създават скелетоподобни структури за контрол на обектите. А ето какво ново има и в него: 1) С Flash CS 5, Adobe представя нов формат, помагащ сортирането на материалите съзададени в анимацията: XFL (от XML—extensible markup language—for Flash). XFL формата съхранява файловете от Library-то и кода като отделни подфайлове. По подразбиране Flash компресира XFL файла и скрива структурата от вас.

Въведение във Flash CS 5 – малко история 2) XFG формат за да е лесно достъпен и в Adobe Photoshop, Illustrator. 3) нов инструмент за работа с текст: TLF. 4) нов инструмент за декорация deco-tool patterns. 5) редизайнът color панел. 6) ДРУГИ.

Въведение във Flash CS 5 – малко история Защо е толкова популярен Flash? Има още една причина поради, която е толкова популярен Flash: Flash Player винаги е бил под 1 Mb. В днешно време това е нищо, но в средата на 90 -те, когато повечето хора се свързваха с Интернет чрез dial-up модеми, работещи на скорост от 14. 4 и 28. 8 Kbps, размерът беше всичко или поне много. Целта на Macromedia бе да създаде рlayer, който може да се свали за по-малко от минута и винаги я постигаха. Днес, 700 милиона човека имат Flash Player, инсталиран на компютъра си. Това прави 97. 8% от хората в света, които са свързани с Интернет, включвайки потребителите на Windows, Mac и Linux.

Въведение във Flash CS 5 – малко история Бъдещето на Flash Светът се пробужда за ново поколение Уеб технологии – експертите го обозначават като "Web 2. 0. ". Както може да очаквате Flash е в центъра на новия пейзаж. . . Но за разлика от миналото сега Flash има конкуренция. Microsoft представиха като част от Windows 7. NET 3. 0 нова технология за презентиране, наречена Windows Presentation Foundation и мобилна версия, наречена Windows Presentation Foundation Everywhere – Silverlight; ). Е, това не е първият път, който Microsoft се борят с Flash, но времето ще покаже. Конкуренцията създава иновации. Следващите 10 години може би ще са интересни като открития, следейки развитието на Adobe и Microsoft в света на Web 2. 0.

Въведение във Flash CS 5 – малко история Action. Script е скриптовият език на Macromedia Flash. Скриптовият език е начин за комуникация с програмата, при който можете да окажете на Flash какво да направи или да го попитате какво става докато филмът върви. Този двустранен начин за комуникация ни позволява да създаваме интерактивни филми. Oсигурява елементи като действия (actions), оператори и обекти, които ние обединяваме в скриптове и казват на нашия филм какво да прави. Action. Script е обектно-ориентиран, интерпретируем език за програмиране. Вградените класове се наричат обекти. Movie clip са най-важните обекти във Flash филм, защото те са мини Flash филми. Потока на изпълнение на скрипта е от първото изявление, последователно следващите до края.

Въведение във Flash CS 5 – малко история Action. Script е разработен въз основа на ECMAScript (European Computers Manufacturers Association Script) (стандартен език, положил началото и на други езици като Java. Script, JScript - последните две са стандартизираните/ унифицираните версии на езика. Mного от синтактичните конструкции са познати, ако имаме опит с Java. Script. Някои съществени разлики: – (Различните обектни модели на документа (Different document object models) - Тъй като Flash работи в собствена среда, съотнесена с елементи като филми (movies) и звуци (sounds), той има напълно различен обектен модел. Няма да намерите вградени обекти като документ (document) и прозорец (window).

Въведение във Flash CS 5 – малко история Не се поддържат всички изрази на Java. Script - Като условният и частта за изключения (exception) - (try/catch/throw) блокът. Макар и в Аction. Script 2004 вече да се появява и тази особеност. Специфични изрази- Езикът поддържа някои не Java. Script изрази като контейнерите за събития (напр. , on. Clip. Event) и изпращането на съобщения (напр. , tell. Target). Функцията Eval - Функцията Eval, в Action. Script, оценява единствено променливи референции. Вградени Обекти - Action. Script поддържа множество от вградени Java. Script обекти Date (Дата) и String (Низ), и редица техни методи и характеристики. Например, към обекта String (Низ) липсват стандартни функции за регулярни изрази като search и replace.

Име на филм Етикети на документи Времедиаграма Лента за информация Фрейм Главно Меню Кутия с инструменти Панели Сцена Инспектор Property

Въведение във Flash CS 5 Авторската среда може да се раздели на няколко секции според функционалността им. Всяка от тях съдържа контроли, всеки от които ще разгледаме по-нататък. - Менюта - Времедиаграма - Панели (всички те могат да се отворят от падащия списък Window) - Сцена - Страница на документи (tab) и панел за редакция - Инспектор Property (контекстно-чувствителен панел, извеждащ информация за текущо избрания обект, независимо дали това е сцена, текст, бутон . . . От тук може да променим много от техните свойства).

Начален прозорец с избор на тип Flash проект

Въведение във Flash CS 5 Някои полезни клавишни комбинации и допълнителната им потребителска настройка от заглавната лента менюто: Edit -> Keyboard Shortcuts. (таблица с осн. комбинации) Задаване на потребителски настройки за редактиране, изрисуване, писане на код, заместване на шрифтове, ако липсват със съществуващите (т. нар. Font Mapping): Това става като изберем от основната лента менюто: Edit -> Preferences. . А сега да създадем първия си документ във Flash CS 5: ))). . .

Въведение във Flash CS 5 С Flash може да създадем няколко типа документи: - SWF- файлове, съдържащи анимация и/или видеоизображения. (техният изходен файл е с разширение FLA) - документи, които съдържат само код на Action. Script, които да се използват като вклщчени документи (includes) или класове (classes) Тук ще създадем нов FLA-документ, който ще служи за основа на останалата част от приложението, тоест ще се явява контейнер на всичко останало, което ще зареждаме по-нататък (текст, картинки, видео, други SWF- файлове)

Въведение във Flash CS 5 Подготовка на нашето филмче за публикуване в различни формати. Настойката става от менюто File -> Publish Settings или като изберете от инспектора Property характеристики на документа. След като направите необходимите настройки вече сте готови да публикувате филма. Това става като изберете: File -> Export Movie или ако искате предварително да прегледате резултата: Control -> Test Movie. И при двата варианта ви се създават два файла: единият е с разширение . fla, a другия: . swf Вграждане на Movie Clip в Уеб страница: Можете да добавите интерактивно филмче във вашата страница по два начина.

Въведение във Flash CS 5 Първият е директно да укажете на Flash да ви генерира. html страница при настройване Publish Settings, а вторият е като добавите следния код (в етикета ) във вашата уеб страница:

Въведение във Flash CS 5 Укажете колко фрейма в секунда ще бъдат заредени. Тук единица за това е: fps (frames per seconds). За Уеб приложения най-добрата стойност е 24 -30 fps. Задава се в Windows -> Properties. За анимация и презентации обикновено тази стойност е: 24 fps. , а за филми в. avi и Quik Time формат, е отново 24 fps. Всъщност, колкото е по-високо това число, толкова поплавно се възпроизвежда филма. Като съвет: Тествайте крайния резултат на различни машини за да получите оптималния вариант за вас! Горните настройки са просто по стандарт; )))

Въведение във Flash CS 5 Панелът Components –> Категория User Interface -> Button (един от компонентите в програмата, които представляват самостоятелни елементи, предварително изградени за бързо разработване) Панелът Align (подравняване) Панелът Actions Записване на текущата подредба на панели с избирането на Window >Workspace layout -> Save current

Въведение във Flash CS 5 Какво е времедиаграма? – 1. показва как е разположено съдържанието във времето. 2. съвкупност от кадри, ключови кадри и слоеве, които се използват за пространствено организиране на слоевете. Показване/скриване на слой Слой Име на слой Заключване на слой Показва слой в изглед Outline Глава Изтриване на слой Вмъкване на слой Добавяне на водач за движението Вмъкване на папка за подреждане на слоеве Падащо меню на изглед Frame

Въведение във Flash CS 5 Дoбавяне на кадри: - с F 6 на ключов кадър - с F 7 на празен ключов кадър -с F 5 на обикновен кадър Изтриване на кадри: След селектиране на желаните за премахване кадри: или избираме от менюто Edit->Timeline->Remove Frames, или клавишната комбинация Shift + F 5

Въведение във Flash CS 5 – работа със слоеве Видове слоеве: - нормални слоеве – използвани за разполагане на съдържание - водещи слоеве – за проследяване - слоеве за движение – указват на дадена анимация да се движи по определена траектория - маскиращи слоеве – използват се за специални ефекти, когато искаме да се вижда само определена част от дадена анимация. Водещите слоеве не се публикуват в изпълнимия SWF-файл, а слоевете за движение са невидими за публиката. Етикети на слоеве (за именуване на кадри), биват: - име - коментар (използва се само за съхраняване информация за кадъра) - котва

Въведение във Flash CS 5 Диалоговият прозорец Preferences (Ctrl+U)

Въведение във Flash CS 5 – намиране на помощ Какво ни дава Flash Help (F 11 или Help-> Flash Help): - Инфо за възможностите на програмата - Самоучител и примери - Информация за Action. Script 3. 0 - Информация за компонентите - Информация за програмата при използването и за мобилни устройство и др.

Преглед на проекта Проектът, който ще правим този семестър ще представлява изграждането на мултимедиен уеб сайт на тема “Feel the Natural”. Който ще включва всичко разглеждано по време на курса ни (графики, анимации, презентации, видео, динамични и звукови елементи, компоненти. . . ).

Какво представлява един Flash уеб сайт? Вграден SWF файл в HTML-страницата е модифициране, така че SWF файлът в нашия случай ще е центриран в нея.

Създаване на графични обекти ü ü Повече за запълванията и очертанията Работа с векторни и растерни изображения – първите се състоят от линии и криви, които са дефинирани чрез математически формули и изчисления. А растерните – от пиксели върху решетка с фиксирана големина на клетките. Използване на цветове - потребителската палитра Web Safe (съдържа 216 цвята) - добавяне на потребителски цвят към палитрата с Color Mixer (чрез eyedropper tool или цветовете от конкретен gif файл, които искаме да използваме, заредени като изберем от Color Mixer - Add Colors -> imegif. gif) Цветови модели - RGB (събира три числови стойности, за да дефинира цвета). - HSB (използва стойност за ъгъла на завъртане на колелото на цветовете и проценти за насищане на яркостта).

Създаване на графични обекти

Създаване на графични обекти

Създаване на графични обекти

Създаване на графични обекти

Създаване на графични обекти

Създаване на графични обекти ü ü ü Създаване на графики чрез инструменти за изчертаване - упражнение Използване на водачи, решетки, координати и прилепване - програмата не разполага със свойство z-координата, но пък има свойство depth (дълбочина). - водачи (guides), решетки (grids), размерни линии (rulers), възможност за прилепване (snapping) Създаване на нов графичен символ Insert -> New Symbol -> Graphic Създаване използване на маски (свойство на слоевете и се постига като един слой се използва за маска, а друг е маскиран от него) Добавяне на очертание (контур около обект или самостоятелна линия)

Създаване на графични обекти ü ü ü Използване на библиотеката Library (F 11) Импортиране и оптимизиране на растерни изображения File->Import to Library Импортиране на векторни изображения Използване на текст и градация Манипулиране на графики.

Въведение в Action. Script

Елементи на езика Посредникът между това, което разбираме ние и Flash е езикът Àction. Script. В един проект на Flash езикът ни дава възможност да задавате инструкции, ориентирани към действия (направи еди какво си) и инструкции (анализирай нещо, преди да направиш друго). Подобно на всички езици за про-грамиране, Àction. Script съдържа множество елементи като думи, препинателни знаци и структури. В продължение на лекциите ще се опитаме да ги изясним.

Елементи на езика Ето как изглежда един примерен код на езика Àction. Script: on (release) { // задаване на стойност на първа променлива var promenliva 1: Number = 3. 00; // задаване на стойност на втора променлива var promenliva 2: Number = 2. 00; // задаваме променлива, чиято стойност е произведението // им var mult: Number = promenliva 1 * promenliva 2; // визуализация на съобщение за потребителя my. Text. Box_txt. text = “Произведението на двете променливи е: ” + mult; // изпращане на инстанцията на филмов клип // calculator_mc на кадър 9 calculator_mc. goto. And. Play (9); }

Програмите в Action. Script представляват отделни скриптове, които управляват филмо-вите клипове във Flash и ни позволяват да комуникираме с тях. Тези скриптове се получават чрез обединението на елементите на езика като: действия (actions), оператори и обекти, на които предварително сме присвоили определени характеристики. Тоест нямаме някаква основна програма, а съвкупност от части код, които отговарят за определен елемент от нашия филм.

Основни стандарти на езика

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

Един от добрите начини да осъществим това планиране е като си отговорим на следните въпроси: I. Какво искате да се случи? – това е найважният въпрос в процеса на планиране на скрипта. Тук трябва да сме ясни, информативни, но още е рано за определяне на всички детайли. II. Кои части от данни трябва да се проследяват? – и по-точно кои стойности, числа, низове в нашия проект са съществени при изпълнението му. III. Какво трябва да се случи във филма, преди да бъде тригериран (задействан) филмът? - тоест задаване и създаване на начални данни при първо изпълнение на клипа, познато като инициализация на данните.

Един от добрите начини да осъществим това планиране е като си отговорим на следните въпроси: IV. Кое събитие ще тригерира (задейства) главния скрипт? V. Трябва ли да бъдат вземани решения, когато се тригерира главният скрипт? VI. Какви елементи изграждат сцената? Как функционират те? VII. Как ще изглежда нашата сцена? – скициране на сцената/е.

Литература Action. Script 3. 0 Game Programming University, Second Edition, Gary Rosenzweig Action. Script 3. 0 Game Programming University, Second Edition, Foundation Flash CS 5 for Designers, Tom Green and Tiago Dias HOW TO cheat IN Adobe. Flash. CS 5 - The art of design and animation, Chris Georgenes Adobe Flash Professional CS 5 FOR WINDOWS AND MACINTOSH, KATHERINE ULRICH Аdobe Flash CS 3, официален учебен курс Официалният учебен курс на Macromedia Flash 8, с автори: Официалният учебен курс на Macromedia Flash 8 Джеймс Инглиш, издателство Софт Прес. HELP- към Flash CS 5. HELP- "FLASH 4 Анимация в Web Ефекти & Дизайн", автори: Кен Милбърн и Джон Крото, издателство: Софт Прес http: //www. adobe. com "Action Script fundamentals seminar“ http: //www. actionscript. org “Flash MX Project”, с автор: “Flash MX Project” Черил Брумбау-Дънкан (Cheryl Brumbaugh-Duncan) www. flashbg. org www. kirupa. com и други. .

Къде ще намирате всичко за курса по Flash ? http: //maya. gmbbg. com/fla sh-cs 5 -course. html