5.2 Director 8 > Privire de ansamblu

Macromedia Director 8 este o aplica]ie care permite utilizatorului s\ realizeze aplica]ii multimedia interactive ;n mod facil prin intermediul unei interfe]e grafice avansate. Aplica]iile multimedia pot cuprinde at=t anima]ii, c=t [i elemente de interactivitate cu utilizatorul.

SCENA(Stage)

DISTRIBU}IA(cast)

SCENARIUL(Score)

MACHIAJUL(Property Inspector)

Comportamente(behaviour - Library Palette)

timp

actori(spriteuri)

membrii distribu]ie(cast members)

cadre (frames)

propriet\ti cadimensiunea,

culoarea, fundalul etc.

Figura 5.1Principiul de func]ionare al programului Director 8

Ideea care st\ la baza cre\rii programului Macromedia Director 8 este

cinematografia. Programul este realizat ca o compara]ie cu realizarea unui film adev\rat. Exist\ astfel o distribu]ie, o scen\, un scenariu, actorii pot fi machia]i [i joac\ conform unor comportamente predefinite sau definite de utilizator (Figura 5.1). Pentru fiecare din acestea, Director pune la dispozi]ia utilizatorului o fereastr\ (Figura 5.2). Astfel>

- distribu]ia Cast care con]ine to]i membrii de distribu]ie sau cu alte cuvinte to]i actorii care vor juca ;n film<

- scena Stage locul pe care vor juca membrii distribu]iei< odat\ plasa]i aici, membrii distribu]iei se transform\ ;n actori (sprite-uri)< pot astfel exista mai mul]i actori proveni]i din acela[i membru de distribu]ie (ca ;n cinematografie unde un actor poate juca mai multe roluri)<

- scenariul Score este locul unde se specific\ c=nd vor apare actorii pe scen\ [i c=t timp vor r\m=ne acolo<

- machiajul Property Inspector care ca [i ;n lumea real\ stabile[te modul de apari]ie a unui actor, ca de exemplu dimensiunile acestuia, culoarea, fundalul etc.<

183

- comportamentele Library pallete care specific\ modul ;n care se comport\ un actor atunci c=nd este pe scen\.

Scena

Distribu]ia Machiajul

Comportamente Scenariul

Figura 5.2 Ferestrele aplica]iei Director 8

5.3 Exemplu Acest exemplu prezint\ utilizatorului principalii pa[i necesari pentru

crearea unui film (anima]ie) ;n Director 8. Realiz=nd cu succes acest exemplu, utilizatorul va ;nva]a aspecte fundamentale ale programului c=t [i o baz\ necesar\ pentru explorarea func]ionalit\]ii avansate a programului. Exemplul poate fi g\sit ;n meniul Help, op]iunea Director Help, eticheta Contents (Director 8 Tutorial).

Cu ajutorul acestui exemplu vor fi prezentate urm\toarele caracteristici ale programului>

- creare nou film (movie), actori (cast members) [i instan]e ale acestora (sprites)<

- folosire cerneal\ (ink)< - creare anima]ie folosind tweening [i anima]ie cadru cu cadru< - importare informa]ie multimedia< - ata[are comportamente unor sprite-uri< - controlul rul\rii filmului pe Internet.

184

Exemplul const\ dintr-un film care ;ncepe cu un peisaj. Norii se ;ndep\rteaz\, cerul se ;nsenineaz\ [i o floare ;nflore[te. O albin\ apare [i ;ncepe s\ se ;nv=rteasc\ [i s\ zumz\ie ;n jurul florii.

5.4 Preg\tirea filmului Prima etap\ pentru crearea unui film este ca [i ;n orice aplica]ie

Windows comanda film nou [i setarea atributelor scenei (;n acest caz dimensiunea [i paleta de culori care se folose[te ;n film). Astfel, din meniul File se alege New cu op]iunea Movie. :n cazul ;n care alt film este ;nc\rcat, atunci Director afi[eaz\ o fereastr\ de dialog ;n care utilizatorul este ;ntrebat dac\ vrea s\ salveze filmul curent.

Figura 5.3 Scena (Stage)

Dup\ generarea unui film nou, se poate observa c\ scena are o dimensiune implicit\ (Figura 5.3). Pentru schimbarea dimensiunii scenei se poate face clic pe sec]iunea Movie ;n fereastra Property Inspector. Dac\ pe ecran nu este afi[at\ aceast\ fereastr\ (Property Inspector), din meniul Window se alege Inspectors [i apoi op]iunea Property. Fereastra Property Inspector prezint\ dou\ tipuri de vizualizare a propriet\]ilor obiectelor asupra c\rora se lucreaz\. Astfel, exist\ Graphical view (Figura 5.4,a), care e modul implicit de vizualizare [i ;n care exist\ iconi]e [i reprezent\ri grafice ale tuturor propriet\]ilor obiectului [i modul List View Mode (lista de vizualizare, Figura 5.4,b) ;n care propriet\]ile sunt listate sub form\ de list\

185

(nivel avansat). Cele dou\ moduri de vizualizare au asociate un buton ;n

fereastra Property Inspector . Dac\ butonul este ap\sat (selectat), atunci modul de vizualizare este List View. Dac\ butonul este deselectat atunci modul de vizualizare este Graphical View.

a) b)

Figura 5.4 Tipurile de vizualizare a propriet\]ilor ;n fereastra Property Inspector

Pentru specificarea dimensiunilor scenei ;n pixeli se introduce

valoarea 450 ;n primul c=mp al sec]iunii Stage Size (l\]imea scenei)

[i 500 ;n cel de-al doilea c=mp (;n\l]imea scenei). Dup\ ce valorile au fost introduse, se poate observa c\ fereastra Stage se redimensioneaz\ la valorile specificate. De asemenea, utilizatorul poate selecta ni[te dimensiuni predefinite din lista ce apare ;n cazul ap\s\rii cu mouse-ul pe s\geata ;n jos din dreptul sec]iunii Stage Size.

:n func]ie de modul [i locul unde se va vizualiza fimul nou creat, se poate alege o anumit\ palet\ de culori pentru acesta. :n cazul exemplului de

186

fa]\, filmul este creat pentru vizualizare pe Internet [i de aceea se dore[te folosirea unor culori specifice pentru web. Pentru aceasta, ;n sec]iunea Movie din fereastra Property Inspector se selecteaz\ caseta derulant\ Movie

Palette . Din lista de palete de culori care apare se selecteaz\ Web 216. 5.5 Salvarea noului film

Pentru salvarea noului film creat se selecteaz\ din meniul File op]iunea Save sau Save As (sau se folose[te combina]ia de taste CTRL+S). :n caseta de dialog care apare, utilizatorul are posibilitatea select\rii loca]iei pe disc unde se vrea salvat filmul [i atribuirea unui nume a acestuia.

Observa]ie> Pe m\sur\ ce se lucreaz\ ;n Director 8, se recomand\ salvarea frecvent\ a filmului. 5.6 Creare informa]ie media ;n Director

Informa]iile multimedia cu care se poate lucra ;n Director 8 pot fi imagini, fi[iere audio sau video, texte etc. Exist\ dou\ modalit\]i de creare media ;n Director>

- creare media ;n Director 8< - importare media din alte programe.

Informa]ii media simple ca text sau fundaluri sunt ideale pentru a fi create ;n Director. 5.7 Crearea unei forme vectoriale

Director d\ posibilitatea utilizatorului s\ creeze curbe vectoriale (descrieri matematice ale formelor umplute cu culori sau culori graduale sau gradien]i). O form\ vectorial\ folose[te mult mai pu]in\ memorie (intern\ [i pe disc) dec=t ;n cazul folosirii imaginilor de tip bitmap [i astfel se descarc\ mai rapid de pe Internet.

Pa[ii de mai jos reprezint\ procesul de creare a unei forme vectoriale unplute cu gradien]i care va servi ca fundal pentru film>

- din meniul Window se selecteaz\ op]iunea Vector Shape, Director afi[=nd caseta de dialog Vector Shape (Figura 5.5)<

C\su]a Cast Member Name

Op]iuni specifice pentru Gradient

187

Butonul Filled Rectangle

Sec]iunea Gradient

Figura 5.5 Caseta de dialog Vector Shape

- se efectueaz\ clic pe instrumentul Filled Rectangle din bara de instrumente situat\ ;n st=nga ferestrei. :n suprafa]a de desen, cursorul devine ca o cruce. Folosind metoda tragerii cu mouse-ul se creaz\ un dreptunghi (tragere cu mouse-ul din col]ul din st=nga sus p=n\ ;n col]ul din dreapta jos al dreptunghiului). Dimensiunea exact\ a acestuia nu este important\ ;n acest moment. Imaginea creat\ se poate redimensiona mai t=rziu<

- se dore[te umplerea dretunghiului cu o culoare de tip gradient. O astfel de culoare este format\ astfel> se pleac\ de la o anumit\ culoare numit\ culoare de ;nceput [i gradual se ajunge la o culoare de sf=r[it. Pentru umplerea dreptunghiului creat cu un gradient de culori se selecteaz\ ;nt=i culoarea de ;nceput. Pentru aceasta se apas\ butonul din st=nga al sec]iunii gradient [i se ]ine ap\sat ( ). Pe ecran apare o list\ de culori (Figura 5.6). Se selecteaz\ o culoare ;nchis\ de albastru<

- ;n acela[i mod, se selecteaz\ [i culoarea de sf=r[it ca fiind o nuan]\ deschis\ de albastru<

188

Figura 5.6 Alegerea culorii

- se selecteaz\ butonul de umplere cu culoare tip gradient< - se poate observa c\ ;n partea de sus a ferestrei au ap\rut ni[te op]iuni

specifice pentru culorile de tip gradient (Figura 5.7). Astfel, se poate selecta tipul de gradient liniar sau radial. Radial creaz\ un efect gradient circular fa]\ de cel liniar. :n cazul de fa]\ se selecteaz\ Radial. :n c=mpul Y Offset se introduce valoarea 70. Aceast\ valoare deplaseaz\ centrul gradientului ;n sus cu 70 de pixeli, astfel ;nc=t s\ se creeze un efect de tip cer luminat de soare. :n cazul folosirii unei valori pozitive, atunci centrul gradientului se mut\ ;n jos cu num\rul de pixeli specificat. :n cazul gradientului de tip Liniar utilizatorul poate specifica [i unghiul sub care acesta se realizeaz\ (c\su]a Angle). De asemenea, este posibil\ specificarea num\rului de ori ;n care gradientul ;[i schimb\ culoarea ;n interiorul formei (c\su]a Cycles) [i a ratei cu care gradientul face schimbul ;ntre culori (c\su]a Spread). Valoarea acestei rate se introduce ;n procente [i pentru o valoare de 100% gradientul face trecerea de la culoarea de ;nceput p=n\ la culoarea de sf=r[it pe toat\ lungimea [i l\]imea formei< valori mai mici ca 100% fac schimbarea mai abrupt\< pentru valori mai mari ca 100% culoarea de sf=r[it este atins\ ;n mod teoretic doar, undeva ;n afara formei<

- ;n c\su]a Cast Member Name din partea de sus a ferestrei Vector Shape (Figura 5.7) se d\ un nume sugetiv pentru acest membru al distribu]iei (actor sau cast). Un nume sugestiv ;n acest caz ar fi cer. Atribuirea de nume membrilor distribu]iei face procesul de identificare a acestora ;n scenariu mult mai facil. Dac\ nu exist\ un nume atribuit, atunci Director specific\ ca nume un num\r ;n func]ie de pozi]ia membrului ;n distribu]ie<

189

- salvarea noului membru al distribu]iei este facut\ automat prin ;nchiderea ferestrei Vector Shape.

C\su]a Cast Member Name

Op]iuni specifice pentru Gradient

Figura 5.7 Realizarea cerului ca un gradient radial 5.8 Creare membru distribu]ie de tip text

Fereastra de creare a unui membru distribu]ie de tip Text ofer\ utilizatorului controalele [i op]iunile standard de formatare, asem\n\toare cu aplica]iile de tip procesare de texte. Pentru crearea unui membru distribu]ie de tip text se parcurg urm\torii pa[i>

- se selecteaz\ op]iunea Text din meniul Window< - dac\ este necesar se redimensioneaz\ fereastra care apare (Figura 5.8)

pentru a putea fi vizualizate toate op]iunile posibile ;n partea de sus a acesteia<

- propriet\]ile textului pot fi setate folosind c=mpurile din partea de sus a ferestrei. :n cazul de fa]\ se folose[te Arial, 24-points, boldat<

- pentru selectarea culorii [i a altor op]iuni care nu sunt prezente ;n fereastra Text se selecteaz\ op]iunea Font din meniul Modify. :n fereastra care apare (Figura 5.9) se poate selecta culoarea textului (Color). Aceasta se face prin ap\sarea butonului asociat culorii curente. }in=ndu-se ap\sat butonul st=nga al mouse-ului pe ecran va

190

fi afi[at\ fereastra de alegere a culorii. Dup\ selectarea culorii, butonul asociat culorii curente va fi colorat ;n aceasta<

- dup\ setarea tuturor atributelor care se doresc pentru text, se introduce textul ;n fereastra asociat\. :n cazul de fa]\ se dore[te introducerea textului loading.... Pentru modificarea propriet\]ilor anumitor por]iuni din textul introdus se selecteaz\ respectiva por]iune [i se seteaz\ caracteristicile dorite pentru aceasta<

- ca orice membru de distribu]ie [i acestui membru de tip text i se poate asocia un nume (partea de sus a ferestrei)<

- se ;nchide fereastra Text pentru salvarea noului membru distribu]ie creat.

Casu]a Cast Member Name

Op]iuni specifice pentru Text

Textul propriu-zis

Figura 5.8 Crearea unui membru de distribu]ie de tip text

Figura 5.9 Propriet\]ile membrilor de distribu]ie text

191

5.9 Vizualizarea membrilor distribu]iei ;n fereastra Cast Se poate observa cu u[urin]\ c\ noii membri distribu]ie crea]i apar ;n

fereastra Internal Cast cu numele asociate (Figura 5.10). Dac\ fereastra Internal Cast nu este vizibil\ pe ecran, se poate selecta op]iunea Internal Cast din meniul Window.

Figura 5.10 Modul de vizualizare Cast List a distribu]iei (Cast)

Exist\ dou\ modalit\]i de vizualizare a distribu]iei. Pentru schimbarea

;ntre cele dou\ moduri se folose[te iconi]a Cast View Style din partea

superioar\ st=nga a ferestrei Internal Cast . Modul implicit de vizualizare este sub form\ de list\ (Cast List, Figura 5.10). Modul de vizualizare Cast Thumbnail (Figura 5.11) afi[eaz\ c=te o c\su]\ pentru fiecare membru distribu]ie care con]ine o imagine mic[orat\ a membrului respectiv, dar prezint\ mai pu]ine detalii dec=t modul Cast List (nu prezint\ detalii de genul data [i ora c=nd a fost creat/modificat etc.).

Figura 5.11 Modul de vizualizare Cast Thumbnail a distribu]iei (Cast)

Filmul din exemplul de fa]\ necesit\ doar o singur\ fereastr\ pentru

distribu]ie. Director 8 ofer\ posibilitatea cre\rii [i altor ferestrei de distribu]ie ;n func]ie de necesit\]ile utilizatorului. Pentru aceasta se selecteaz\ din meniul File, op]iunea New [i apoi Cast. :n fereastra de dialog care apare, utilizatorul poate atribui un nume noii distribu]ii.

192

Figura 5.12 Fereastra de dialog New Cast

Prin ap\sarea butonului Create se genereaz\ o fereastr\ pentru noua

distribu]ie. 5.10 Importarea de membri distibutie

Membrii distribu]ie care au fost crea]i anterior sunt tipuri de media ce pot fi create ;n Director. Pentru folosirea informa]iilor media complexe, acestea pot fi importate din alte aplica]ii. Director poate importa diverse tipuri de informa]ii media ca bitmap, texte, video digital, fi[iere audio, sunete, filme create ;n Flash. Pentru importarea de informa]ii multimedia, trebuie cunoscut\ loca]ia fi[ierelor asociate acestora pe disc. :n cazul de fa]\, toate fi[ierele multimedia necesare sunt localizate ;n acela[i folder Tutorial_media.

Se selecteaz\ din meniul File op]iunea Import. Director afi[eaz\ caseta de dialog Import Files (Figura 5.13).

:n sec]iunea Look In, se selecteaz\ folderul corespunz\tor fi[ierelor multimedia care se doresc a fi importate. Prin clic pe butonul Add All, toate fi[ierele existente ;n directorul selectat vor fi ad\ugate ;n lista fi[ierelor de importat. Se apas\ apoi butonul Import pentru ;nceperea procesului. Director va afi[a o caset\ de dialog ;n care utilizatorul este ;ntrebat tipul de format pentru fi[ierul curent ce se import\ (Figura 5.14). De asemenea, utilizatorul are posibilitatea de a specifica acela[i format pentru celelalte fi[iere r\mase de importat (se selecteaz\ Same Settings for Remaining Files ;n caseta de dialog Select Format). Se apas\ apoi butonul OK.

Fi[ierele importate apar ;n distribu]ie (fereastra Internal Cast, Figura 5.15) ;n ordine alfabetic\ dup\ numele acestora pe disc. Fiecare membru are asociat un num\r ;n func]ie de pozi]ia acestuia ;n fereastra Internal Cast.

193

Figura 5.13 Importarea unor membrii distribu]ie

Figura 5.14 Caseta de dialog Select Format

194

Figura 5.15 Distribu]ia dup\ procesul de import

5.11 Redenumirea membrilor distribu]iei

Utilizatorul are posibilitatea de modificare a numelui membrilor distribu]iei. Pentru aceasta se selecteaz\ respectivul membru, iar ;n c=mpul Cast Member Name din partea de sus a ferestrei Internal Cast se introduce noul nume.

:n cazul de fa]\ se dore[te schimbarea numelui membrului din flowerFrZero ;n flowerFr00 . 5.12 Ad\ugare comentarii/observa]ii pentru un membru distribu]ie

De cele mai multe ori este necesar ad\ugarea unu comentariu pentru fiecare membru al distribu]iei. Aceste comentarii pot fi introduse ;n fereastra Property Inspector ;n sec]iunea Member, c=mpul Comments (;n prealabil se selecteaz\ membrul c\ruia vrea s\ i se asocieze un comentariu). Comentariile pot fi vizualizate ;n modul List view al ferestrei Internal Cast (Figura 5.16).

195

Figura 5.16 Ad\ugarea unui comentariu pentru un membru distribu]ie

5.13 Creare actori din membrii ai distribu]iei (creare Sprites din Cast members)

Actorii (Sprites) sunt obiecte ob]inute din membrii distribu]ie (Cast members). Aceste obiecte controleaz\ c=nd, unde [i cum apar ;n film membrii distribu]iei. De exemplu, c=nd se mut\ un membru distribu]ie pe scen\ se creaz\ un sprite care indic\ unde respectivul membru apare ;n film. C=nd se mut\ un membru ;n scenariu (Score) se creaz\ un sprite care indic\ c=nd apare respectivul membru ;n film.

Pentru procesul de creare sprite-uri trebuie avut ;n vedere ca ferestrele Cast, Score, Stage [i Property inspector s\ fie vizibile pe ecran. Dac\ nu, acestea pot fi f\cute vizibile prin selectare din meniul Window.

:n principiu, sprite-urile se creaz\ prin metoda tragerii cu mouse-ul din distribu]ie pe scen\ sau ;n scenariu. Cu alte cuvinte, se face drag and drop din fereastra Internal Cast ;n fereastra Stage sau ;n fereastra Score.

Pentru a putea crea sprite-uri ;n mod eficient se impune mai ;nt=i prezentarea general\ a scenariului (Score). Fereastra Score (Figura 5.17)

196

organizeaz\ [i controleaz\ con]inutul filmului ;n timp ;n r=nduri care con]in informa]ie media, numite canale. Scenariul include canale speciale (Effects Channels) care controleaz\ temporizarea filmului, sunetul [i paleta de culori a acestuia. Fereastra Score include de asemenea cadre (frames) [i capul de redare (playback head).

Canale sprite-uri

Canale speciale

Buton ascundere/vizualizare

canale speciale

Cadru Capul de redare

Figura 5.17 Fereastra Score

Canalele pentru sprite-uri (partea de jos a ferestrei) sunt numerotate [i controleaz\ toat\ informa]ia media vizibil\ ;n film. Canalele speciale pot fi ascunse prin folosirea butonului de vizualizare prezentat ;n Figura 5.17.

Un cadru dintr-un film reprezint\ un punct singular ;n timp, similar ;n teorie cu un cadru dintr-un film real. Numerele afi[ate orizontal ;n canalele speciale [i canalele sprite-urilor reprezint\ cadre. Prin setarea num\rului de cadre care sunt afi[ate pe secund\ se stabile[te viteza de redare a filmului.

Capul de redare se mi[c\ de-a lungul ferestrei Score pentru a indica cadrul care este afi[at la momentul respectiv pe scen\ (Stage). Pe m\sur\ ce se ruleaz\ filmul, capul de redare se mi[c\ automat prin scenariu (de la st=nga la dreapta). Se poate de asemenea efectua clic pe orice cadru din Scenariu pentru a muta capul de redare pe respectivul cadru.

Pentru m\rirea sau mic[orarea con]inutului ferestrei Score se poate schimba procentajul de vizualizare (Zoom in sau Zoom out din meniul View). Comanda Zoom in m\re[te fiecare cadru, permi]=nd astfel utilizatorului s\ vad\ mai mult\ informa]ie ;n acesta. Comanda Zoom out permite vizualizarea mai multor cadre ;ntr-un spa]iu ecran mai mic.

197

Figura 5.18 Un sprite ;n Score

Un sprite se ;ntinde pe unul sau mai multe cadre ;n func]ie de timpul

;n care se vrea ca acesta s\ fie vizibil pe scen\ (Figura 5.18). Astfel, un sprite ;ncepe la un cadru specificat [i se poate termina ;n acela[i cadru sau ;ntr-un cadru ulterior. De exemplu, un sprite ;ncepe la cadrul 5 [i se sf=r[e[te la cadrul 5. Aceasta ;nseamn\ ca respectivul sprite este vizibil pe scen\ ;ntre cadrul 5 [i cadrul 5.

Pentru crearea unui sprite trebuie parcurse urm\toarele etape> o ;n fereastra Score se selecteaz\ cadrul unde se dore[te ca sprite-ul s\

apar\ ;n film< o se trage un membru distribu]ie din fereastra Internal Cast ;n fereastra

Stage (pe scena) pe pozi]ia unde se dore[te ca respectivul sprite s\ apar\ ;n film. De asemenea se poate trage un membru distribu]ie direct ;n fereastra Score (Director pozi]ioneaz\ sprite-ul astfel creat ;n mijlocul scenei).

Figura 5.19 Pozi]ionarea sprite-ului Cer ;n Score

198

Figura 5.20 Stabilirea dimensiunilor unui sprite

:n exemplul de fa]\, se selecteaz\ cadrul 10 din canalul 1 [i se trage

membrul distribu]ie Cer ;n centrul ferestrei Stage. Se poate observa c\ sprite-ul astfel creat ;ncepe de la cadrul 10 din Score (Figura 5.19). Acum trebuie ca sprite-ul nou creat s\ fie redimensionat la dimensiunea scenei. Cea mai elegant\ metod\ este folosirea ferestrei Property Inspector. Pentru aceasta se selecteaz\ sprite-ul nou creat [i ;n fereastra Property Inspector, sectiunea Sprite se seteaz\ op]iunile pentru st=nga (left), sus (top), dreapta (right), jos (bottom) la 0, 0, 450 [i respectiv 500 (Figura 5.20). Majoritatea schimb\rilor care sunt f\cute asupra unui sprite nu afecteaz\ ;n nici un fel membrul distribu]ie folosit pentru crearea acestuia (;n cazul de fa]\ nu se redimensioneaz\ [i Cast member Cer din fereastra Internal Cast).

:n mod implicit un sprite se ;ntinde pe 28 de cadre. Aceast\ valoare poate fi setat\ cu ajutorul casetei de dialog Sprite Preferences (din meniul File, op]iunea Preferences [i apoi Sprite).

199

5.14 Schimbarea cernelii pentru un sprite Utilizatorul poate controla modul ;n care culorile unui sprite apar pe

scen\ prin aplicarea de cerneal\ (ink). :n exemplul de fa]\ se trage membrul distribu]ie Sunny Landscape ;n

cadrul 10 al canalului 2 ;n fereastra Score. Noul sprite apare ;ntr-o cutie alb\ ;n centrul scenei. Pentru a pozi]iona sprite-ul Sunny Landscape astfel creat ;n alt\ pozi]ie pe scen\, se utilizeaz\ tot metoda tragerii (;n fereastra Stage se trage sprite-ul men]ionat ;n partea de jos a scenei).

Cutie alb\

Figura 5.21 Cutia alb\ care ;nconjoar\ sprite-ul Sunny Landscape

Cutia alb\ ce ;nconjoar\ sprite-ul (Figura 5.21) poate fi facut\ transparent\ aplic=nd o cerneal\ de tip Background Transparent, care ia fiecare pixel de o culoare specificat\ (implicit culoarea alb\) [i o face transparent\. Pentru aceasta, cu sprite-ul Sunny Landscape selectat, se selecteaz\ sec]iunea Sprite din fereastra Property Inspector.

Din caseta derulant\ de la op]iunea Ink se selecteaz\ Background Transparent (Figura 5.22,a). Cutia alb\ ce ;nconjoar\ sprite-ul devine acum transparent\ (Figura 5.22,b).

200

a) b)

Figura 5.22 Selectarea cernelii Background Transparent pentru peisaj [i efectul acesteia pe scen\

:n Tabelul 5.1 sunt prezentate pe scurt tipurile de cerneal\ existente ;n

Director.

Tabelul 5.1 Tipurile de cerneal\ ;n Director Cerneala Efectul aplic\rii acesteia asupra unui sprite suprapus pe

un alt sprite Copy Afi[eaz\ toate culorile originale dintr-un sprite< toate culorile

inclusiv albul sunt opace< modul implicit de afi[are. Matte :nl\tur\ dreptunghiul alb de jur ;mprejurul sprite-ului< toate

culorile din interiorul dreptunghiului sunt opace. Background transparent

Face to]i pixelii din fundalul sprite-ului s\ fie transparen]i [i permite astfel ca fundalul scenei s\ fie v\zut.

Transparent Face ca toate culorile deschise s\ fie transparente permi]=nd ca obiectele luminate s\ fie vizibile sub sprite.

Reverse Inverseaz\ culorile care se suprapun< c=nd este aplicat sprite-ului de deasupra, acolo unde culorile se suprapun, culoarea de deasupra se schimb\ cu negativul cromatic al culorii de dedesubtul ei.

Ghost Similar cu reverse, inverseaz\ culorile care se suprapun, cu excep]ia faptului c\ celelalte culori sunt transparente< sprite-ul nu este vizibil dec=t dac\ se suprapune cu alt sprite.

201

Cerneala Efectul aplic\rii acesteia asupra unui sprite suprapus pe un alt sprite

Not Copy Creaz\ un negativ cormatic al originalului. Not TransparentNot reverse Not Ghost

Varia]ii ale efectelor men]ionate mai sus< imaginea de deasupra este mai ;nt=i inversat\, iar apoi sunt aplicate efectele Transparent, Reverse sau Ghost.

Mask Determin\ p\r]ile sprite-ului care sunt transparente sau opace. Pentru aceasta este nevoie a fi definit\ o masc\ ca un membru distribu]ie (p\r]ile albe din masc\ sunt transparente, iar cele negre sunt opace).

Blend Asigur\ un amestec cu un procentaj specificat al sprite-ului cu sprite-ul de dedebsubtul lui.

Darkest Compar\ culorile pixelilor de deasupra cu cele ale pixelilor de dedesubt [i folose[te pixelul cu culoarea cea mai ;nchis\.

Lightest Similar cu Darkest, dar se folose[te culoarea cea mai deschis\.

Add Creaz\ o nou\ culoare prin adunarea celor dou\ culori (se realizeaz\ o normalizare dac\ culoarea RGB rezultant\ este mai mare ca 255).

Add Pin Similar cu Add, dar nu se realizeaz\ normalizare. Substract Scade valoarea RGB a culorii sprite-ului de deasupra din

culoarea sprite-ului de dedesubt (valoarea ob]inut\ nu poate fi mai mic\ ca 0).

Darken :n general ;ntunec\ un sprite. Lighten Deschide culorile dintr-un sprite.

(Tabelul 5.1 cont.) 5.15 Schimbarea duratei unui sprite

A[a cum s-a men]ionat anterior, durata implicit\ a unui sprite este 28 de cadre. :n exemplul de fa]\, sprite-urile Cer [i Sunny Landscape apar pe scen\ pe parcursul ;ntregului film, p=n\ la cadrul 180. Pentru aceasta se selecteaz\ ambele sprite-uri din fereastra Score (]in=ndu-se ap\sat\ tasta SHIFT). C=nd sunt selectate mai multe sprite-uri se pot modifica propriet\]ile pentru toate acestea. :n fereastra Property Inspector, sec]iunea Sprite exist\ dou\ c=mpuri (Figura 5.23)> cadrul de ;nceput al sprite-ului (Begin Frame) [i cadrul de sf=r[it al sprite-ului (End Frame).

202

Figura 5.23 C=mpurile de ;nceput [i de sf=r[it ale unui sprite ;n fereastra

Property Inspector

Se introduce valoarea 180 ;n c=mpul End Frame pentru a extinde sprite-urile selectate p=n\ la cadrul 180. 5.16 Blocare sprite-uri (Lock sprites)

Pentru a preveni schimb\ri neavenite asupra unor sprite-uri, acestea pot fi blocate (lock). Dup\ ce un sprite a fost blocat, acesta nu mai poate fi mutat sau s\ ;i fie schimbate propriet\]ile, p=n\ ;n momentul c=nd este deblocat. Pentru aceasta, ;n fereastra Property Inspector exist\ butonul

Lock Sprite . Pentru deblocarea sprite-ului selectat se utilizeaz\ acela[i buton Lock Sprite.

:n exemplul de fa]\ se blocheaz\ sprite-ul Sunny Landscape. 5.17 Creare alte sprite-uri

Din moment ce filmul ;ncepe cu o zi ;nnorat\, trebuie creat efectul de ;nnorare. Pentru aceasta, deasupra peisajului ;nsorit (Sunny Landscape) se adaug\ un sprite Cloudy Landscape (;n canalul 3, cadrul 10 al ferestrei Score). De asemenea se seteaz\ cerneala acestuia ca find Background Transparent (din Property Inspector). 5.18 Alinierea sprite-urilor

Sprite-urile Sunny Landscape [i Cloudy Landscape trebuie s\ fie aliniate perfect una peste alta. Pentru aceasta se selecteaz\ cele dou\ sprite-uri [i se alege op]iunea Align din meniul Modify.

Pe ecran este afi[at\ caseta de dialog Align (Figura 5.24,a), cu dou\

casete derulante cu op]iuni pentru alinierea pe vertical\ [i pe orizontal\

. Se selecteaz\ op]iunile AlignReg. Point (aliniere puncte de pozi]ionare, Figura 5.24,b). Aceste puncte de pozi]ionare (registration points) sunt definite implicit ;n centrul imaginii bitmap. Ele pot fi schimbate de c\tre utilizator ;n fereastra Paint.

Director avertizeaz\ c\ alinierea nu va afecta sprite-ul blocat (Sunny Landscape, blocat anterior).

203

a) b)

Figura 5.24 Caseta de dialog Align si op]iunile de aliniere a sprite-urilor

Pentru sprite-ul Cloudy Landscape se introduce cadrul 130 ;n c=mpul End Frame din fereastra Property Inspector. 5.19 M\rirea sau mic[orarea ferestrei scenei

:nainte de a crea o secven]\ animat\ care mi[c\ norii de pe cer va fi nevoie de mic[orarea ferestrei scenei pentru a facilita aranjarea norilor.

:n Director se poate folosi comanda Zoom pentru a vizualiza scena mai mic\ sau mai mare dec=t dimensiunea ei original\. Comanda Zoom afecteaz\ doar vizualizarea scenei [i nu afecteaz\ dimensiunile scenei specificate ;n fereastra Property Inspector. Exist\ mai multe modalit\]i de m\rire/mic[orare a ferestrei Stage, astfel>

- cu scena activ\ se apas\ combina]ia de taste CTRL + - pentru zoom out (mic[orare) sau CTRL + + pentru zoom in (m\rire)<

- cu scena activ\ se selecteaz\ comenzile Zoom in sau Zoom out din meniul View<

- selectarea unui procent de vizualizare din partea de jos a ferestrei Stage (caseta derulant\ Zoom Menu)< Procentajul de vizualizare a scenei apare afi[at ;n bara de titlu a ferestrei Stage.

:n cazul de fa]\ se mic[oreaz\ fereastra Stage. Se observ\ c\ pe

m\sur\ ce [i scena se mic[oreaz\, spa]iul de culoare gri de jur ;mprejurul acesteia se m\re[te. Acolo pot fi plasate sprite-uri ;nainte de a intra ;n scen\. Numai obiectele plasate ;n scen\ vor fi vizibile ;n film, celelalte nefiind afi[ate.

204

Urm\toarea etap\ ;n exerci]iul propus este plasarea norilor. Pentru aceasta exist\ doi membri distribu]ie Cloud01 [i Cloud 02. Se selecteaz\ cadrul 10 din canalul 4. Se trage membrul Cloud 02 pe scen\, plas=ndu-l spre dreapta scenei (Figura 5.25). Nu conteaz\ dac\ sprite-ul se extinde ;n afara scenei. Se extinde durata acestui sprite p=n\ la cadrul 120. De asemenea, se seteaz\ cerneala de afi[are a sprite-ului ca fiind Background Transparent.

Figura 5.25 Pozi]ionarea primului nor pe scen\

Figura 5.26 Pozi]ionarea final\ a norilor pe scen\

205

Se selecteaz\ apoi cadrul 10 din canalul 5 [i se trage membrul Cloud01 pe scen\ pozi]ion=ndu-l ;n st=nga sus. Se extinde sf=r[itul acestui sprite p=n\ la cadrul 95 [i se seteaz\ cerneala ca fiind Background Transparent.

Se creaz\ un nou sprite ;n canalul 6, cadrul 10 folosind tot membrul Cloud02. Se seteaz\ cadrul de sf=r[it al acestuia ca fiind 75 [i de asemenea cerneala ca Background Transparent. Se pozi]ioneaz\ acest ultim sprite pe scen\ ;n a[a fel ;nc=t s\ acopere c=t mai mult din cer (Figura 5.26). 5.20 Creare anima]ii in Director 5.20.1 Creare anima]ie simpl\ folosind metoda tweening

Pentru a face norii s\ se mi[te de-a lungul cerului se va folosi o tehnic\ simpl\ de anima]ie numit\ tweening. Pentru aceasta, se definesc propriet\]ile unor cadre numite cadre cheie, iar Director umple automat cadrele dintre acestea (Figura 5.27). Un cadru cheie indic\ ;n general o schimbare ;n propriet\]ile sprite-ului. Propriet\]ile care pot fi tweened sunt pozi]ia, dimensiunea, rota]ia, amestecul de culori (blend) etc. Fiecare cadru cheie define[te o valoare pentru aceste propriet\]i (chiar dac\ ;n cele mai multe cazuri ;n mod explicit numai una dintre ele).

Cadre cheie Cadrul de

start Cadrul de

sf\r[it

e

Figura 5.27 Cadrele che

Cadrul de sf=r[it

Cadrul de start

Pentru aceasta se execut\ ur

- se selecteaz\ sprite-ul Cloud

Cadre cheiie pentru procesul de tweening

m\torii pa[i> 02 din canalul 4 al ferestrei Score<

206

- pe scen\, sprite-ul Cloud02 este acum selectat. :n mijlocul acestuia se poate observa un punct ro[u [i unul albastru. Aceste puncte reprezint\ ni[te m=nere pentru procesul de creare a unei c\i de anima]ie pentru un sprite<

- ]in=ndu-se ap\sat\ tasta SHIFT se trage de acest m=ner spre st=nga, p=n\ departe de marginea din st=nga a scenei. Pe m\sur\ ce se trage de m=ner, acesta se separ\ ;n mai multe puncte (cercuri). Un cerc verde indic\ loca]ia de ;nceput a unui sprite, un cerc albastru arat\ loca]ia sprite-ului ;n rela]ie cu cadrul curent [i un cerc ro[u reprezint\ pozi]ia de sf=r[it a sprite-ului. }in=ndu-se ap\sat\ tasta SHIFT se constr=nge mi[carea m=nerului la o linie vertical\ sau orizontal\<

- se selecteaz\ sprite-ul Cloud01 din canalul 5 [i se trage de m=ner p=n\ departe de marginea din dreapta a scenei<

- se selecteaz\ sprite-ul Cloud02 din canalul 6 [i se trage de m=ner p=n\ departe de marginea din st=nga a scenei<

- se aduce scena la scara 1>1 de vizualizare (100%)< - se organizeaz\ ferestrele ;n a[a fel ;nc=t s\ se vizualizeze ferestrele

Stage [i Score [i de pe bara de instrumente a programului Director se apas\ butonul Rewind (derulare ;napoi) [i apoi butonul Play (rulare film).

Se poate observa c\ norii se mi[c\ ;ntre punctul de start [i punctul de

sf=r[it definite prin opera]ia de tweening. De asemenea, ;n fereastra Score, capul de redare (playback head) se mi[c\ de-a lungul fiec\rui cadru din scenariu pe m\sura ce ruleaz\ filmul. Capul de redare sau citire indic\ cadrul curent. Pentru vizualizarea unui anumit cadru se trage capul de citire de-a lungul scenariului p=n\ se ;nt=lne[te respectivul cadru.

Pentru oprirea rul\rii filmului se apas\ butonul Stop din bara de instrumente a programului Director.

Observatie> :n fereastra Score, mici cercuri apar la ;nceputul [i sf=r[itul celor trei sprite-uri corespunz\toare norilor. Aceste cercuri reprezint\ cadruri cheie [i indic\ unde propriet\]ile unui sprite se schimb\ (Figura 5.28).

207

Capul de redare

Cadru cheie

Figura 5.28 Vizualizarea cadrelor cheie ;n fereastra Score 5.20.2 Stoparea rul\rii continue a unui film

:n momentul rul\rii unui film, capul de redare ajunge la ultimul cadru din film [i se ;ntoarce din nou la primul cadru. Se realizeaz\ astfel o bucl\ continu\, iar filmul se ruleaz\ teoretic de un num\r infinit de ori. Pentru a stopa reluarea filmului se dore[te ca respectivul cap de redare s\ se opreasc\ ;n momentul c=nd ajunge la ultimul cadru. Astfel, din meniul Control se deselecteaz\ op]iunea Loop Playback. Acum, c=nd se ruleaz\ filmul, capul de redare se opre[te pe ultimul cadru al filmului. 5.20.3 Amestecul de sprite-uri (blend sprite)

:n plus fa]\ de procesul de tweening a c\ii unui sprite, se poate folosi acela[i proces pentru alte propriet\]i ale sprite-urilor, ca de exemplu dimensiunea, rota]ia [i amestecul de culori dintre sprite-uri. Prin schimbarea propriet\]ilor cernelii [i ;n principal a cernelii de tip Blend se pot genera efecte de tip Fade in (apari]ie treptat\) sau Fade out (dispari]ie treptat\). :n exemplul propus, dup\ ce norii au disp\rut de pe scen\, se dore[te ca peisajul s\ apar\ ;nsorit. Aceasta se poate realiza prin folosirea propriet\]ilor cernelii (Blend) pentru a face ca peisajul ;ntunecat s\ dispar\ treptat, ;n timp ce peisajul ;nsorit s\ apar\ treptat.

Mai ;nt=i trebuie specificat ;n care cadru trebuie sa ;nceap\ efectul de amestec (Blend).

:n fereastra Score se selecteaz\ cadrul 80 al sprite-ului Cloudy Landscape (peisajul ;nnorat). Din meniul Modify se selecteaz\ op]iunea Split Sprite (desparte sprite-ul). :n acest fel, sprite-ul curent este desp\r]it ;n

208

dou\ sprite-uri de cadrul curent (80). Se selecteaz\ apoi cadrul cheie de sf=r[it al celui de-al doilea sprite Cloudy Landscape creat (dreptunghiul mic din cadrul 130). :n fereastra Property Inspector, sec]iunea Sprite se selecteaz\ cerneala ca fiind de tip Blend cu un procentaj de 10 % (Figura 5.29).

Figura 5.29 Selectarea cernelii de tip Blend

Se observ\ c\ respectivul cadru cheie se schimb\ ;ntr-un mic cercule]

pentru a indica o schimbare ;n propriet\]ile sprite-ului. Se deruleaz\ [i se ruleaz\ filmul pentru a putea observa efectul de amestec (blend). 5.20.4 Creare anima]ie cadru cu cadru

Un sprite este ;n general o instan]\ a unui singur membru al distribu]iei plasat pe scen\ sau ;n scenariu. Cu toate acestea, un sprite poate include mai mul]i membri ai distribu]iei. Anima]ia care folose[te mai mul]i membri ai distribu]iei se nume[te anima]ie cadru cu cadru. Aceast\ tehnic\ ofer\ posibilitatea cre\rii de anima]ii mai complexe dec=t anima]ia simpl\ prin tweening. 5.20.4.1 Schimbarea ordinei membrilor distribu]iei

Pentru crearea de anima]ie cadru cu cadru se poate folosi metoda Cast to Time care permite mutarea mai multor membri ai distribu]iei ;n scenariu ca un singur sprite. Pentru aceasta este necesar ca respectivii membri ai distribu]iei s\ fie ;n aceea[i ordine ;n fereastra Internal Cast ca [i ordinea ;n care apar ;n anima]ie. :n cazul de fa]\, anima]ia care se creaz\ reprezint\ o floare care r\sare, cre[te [i apoi ;nflore[te. Se poate observa ;n fereastra Cast (;n modul de vizualizare Thumbnail View) c\ membrul flowerFr00 este ;n afara secven]ei. Aceasta este prima imagine din anima]ie [i deci trebuie mutat\ ;naintea celorlal]i membri (;naintea lui flowerFr01).

Se trage membrul flowerFr00 peste membrul flowerFr01. Se poate observa c\ flowerFr00 ia pozi]ia membrului flowerFr00. Ceilal]i membri sunt deplasa]i spre dreapta. Acum, membrii distribu]iei necesari pentru anima]ie sunt ;n ordinea dorit\ (Figura 5.30).

209

Figura 5.30 Schimbarea ordinii membrilor de distribu]ie

5.20.5 Creare anima]ie de tip Cast to Time (distribu]ie ;n timp)

Se selecteaz\ cadrul 140 din canalul 7 ;n fereastra Score. Se selecteaz\ to]i membri flowerFr00 p=n\ la flowerFr16 (]in=ndu-se ap\sat\ tasta SHIFT). Din meniul Modify se alege op]iunea Cast to Time. Se poate obseva c\ florile apar ca un singur sprite ;n fereastra Score (Figura 5.31).

Figura 5.31 Un singur sprite rezultant din crearea unei anima]ii

de tip Cast to time

:n mod implicit, cerneala Background Transparent este folosit\ de Director pentru a face ca fundalul alb s\ fie transparent. :n cazul de fa]\, fundalul este negru. Utilizatorul poate face ;n a[a fel ;nc=t culoarea neagr\ s\ fie transparent\. Astfel, se selecteaz\ sprite-ul asociat florii [i ;n fereastra

210

Property Inspector se selecteaz\ culoarea pentru fundal (Background) ca fiind neagr\ (Figura 5.32).

Culoarea fundalului (background)

Figura 5.32 Selectarea culorii fundalului unui sprite

Se seteaz\ acum cerneala sprite-ului ca fiind Background transparent. De asemenea, se extinde sprite-ul p=n\ la cadrul 180. Pentru a vizualiza anima]ia se deruleaz\ [i se ruleaz\ filmul. 5.21 Ata[are comportamente sprite-urilor

Comportamentele adaug\ inteligen]\ [i flexibilitate unui film. :n locul rul\rii cadrelor exact cum dicteaz\ scenariul (Score), un comportament poate controla filmul car\spuns la condi]ii sau evenimente specifice.

:n acest exemplu se vor folosi comportamente pentru a face o albin\ s\ se mi[te aleator ;n jurul florii [i de asemenea s\ urmeze mi[carea cursorului mouse-ului.

C=nd se ata[eaz\ comportamente unui sprite ;ntreg, spre deosebire de un singur cadru, se poate trage comportamentul peste sprite-ul din fereastra Score sau din fereastra Stage.

Mai ;nt=i trebuie creat un sprite pentru albin\. Se selecteaz\ cadrul 175 al canalului 8 din Score. Se trage membrul de distribu]ie albin\ pe scen\, ;n apropierea florii. Se scurteaz\ sprite-ul p=n\ la cadrul 180 (acest lucru se poate realiza [i prin tragerea cu mouse-ul a cadrului de sf=r[it al sprite-ului pentru scurtarea sau extinderea sprite-ului selectat).

Numele categoriei

comportamente

Figura 5.33 Fereastra Library Palette

211

Director pune la dispozi]ia utilizatorului o serie de comportamente predefinite. Acestea se g\sesc ;ntr-o libr\rie Library Palette. Dac\ fereastra Library palette nu este vizibil\,se poate selecta din meniul Window. Aceast\ fereastr\ afi[eaz\ comportamentele grupate ;n categorii (Figura 5.33). Numele categoriei active apare ;n partea de sus a ferestrei (c=mpul Library List, Figura 5.34).

Numele fiec\rui comportament apare l=ng\ o iconi]\ care indic\ tipul acestuia.

Din categoria Automatic se alege comportamentul Random Movement and Rotation (mi[care aleatoare [i rota]ie). Pentru a citi o descriere a ceea ce face respectivul comportament se poate ]ine cursorul mouse-ului deasupra iconi]ei asociate cu acesta. Se trage comportamentul Random Movement and Rotation peste sprite-ul albinei din Score. O caset\ de dialog cu parametrii pentru respectivul comportament este afi[at\.

Figura 5.34 Selectarea unei categorii de comportamente din fereastra

Library Palette

:n acela[i mod se poate ad\uga [i comportamentul Turn Towards Mouse (;ndreapt\-te c\tre mouse) care face ca sprite-ul c\ruia ;i este asociat s\ se ;ntoarc\ c\tre cursorul mouse-ului. Acest comportament se g\se[te ;n categoria Animation, subcategoria Interactive din Library Palette. Comportamentul se poate trage [i asupra sprite-ului din fereastra Stage. Se observ\ c\ apare un dreptunghi ;mprejurul sprite-ului c=nd se trage comportamentul deasupra acestuia. {i de aceasta dat\ este afi[at\ o cutie de dialog cu parametrii ce controleaz\ comportamentul. Se selecteaz\ op]iunea Always (mereu) [i se apas\ butonul OK.

P=n\ acum s-au ata[at comportamente care afecteaz\ sprite-urile. Comportamentele pot fi asociate [i cadrelor pentru ac]iuni care afecteaz\ modul ;n care se comport\ filmul.

212

:n exemplul curent se va ata[a un comportament ultimului cadru al filmului (180) pentru a fi rulat ;n mod repetat, adic\ pentru a men]ine capul de citire acolo. Comportamentul se g\se[te ;n categoria Navigation (navigare) [i se nume[te Hold on Current Frame (men]ine pe cadrul curent). A[a cum ;i spune [i numele, acest comportament presupune men]inerea la nesf=r[it a capului de redare ;n cadrul c\ruia ;i este asociat. Aceste comportamente se trag ;n canalul special (Script channel). :n cazul de fa]\ este asociat cu ultimul cadru, a[a c\ este tras peste ultimul cadru ;n canalul script (Figura 5.35). Pentru vizualizarea filmului se deruleaz\ [i se ruleaz\ filmul. Se observ\ c\, atunci c=nd capul de citire ajunge la ultimul cadru, filmul continu\ s\ ruleze, dar capul de citire este men]inut pe acesta.

Figura 5.35 Asocierea unui comportament cu un cadru prin intermediul canalului special Script

Comportametul Hold on Current Frame asociat

cadrului 180

Canalul special script

5.22 Ad\ugare sunet

A[a cum s-a men]ionat anterior albina va b=z=i. Pentru aceasta trebuie ad\ugat sunet filmului. Director ofer\ mai multe posibilit\]i de ad\ugare [i sincronizare a sunetului. :n cele ce urmeaz\, se va prezenta o procedur\ simpl\ pentru controlul sunetului ;n Score. Controlul sunetului ;n scenariu (Score) este similar cu controlul altor sprite-uri, cu diferen]a c\ sunetul se adaug\ ;n canalele speciale de sunet din partea de sus a ferestrei Score. Dac\ canalele de sunet nu sunt vizibile, atunci se apas\ pe butonul de expandare . Se trage membrul distribu]ie buzzing (zumz\it) ;n cadrul 175 al canalului de sunet 1 [i se scurteaz\ cadrul de sf=r[it al acestuia la 180 (Figura 5.36). :n fereastra Property Inspector ;n sec]iunea Sound se selecteaz\ Loop (buclare). Aceasta face ca sunetul s\ fie rulat continuu ;n timp ce albina este aflat\ pe scen\.

213

Canelele speciale de sunet

Figura 5.36 Ad\ugarea sunetului ;n canalele speciale de sunet 5.23 Streaming desc\rcarea rapid\ de pe Internet a filmului

Atunci c=nd se inten]ioneaz\ publicarea filmului pe Internet este adesea necesar ca filmul s\ ;nceap\ s\ ruleze chiar c=nd con]inutul acestuia nu a fost complet desc\rcat pe calculatorul local, proces care se nume[te streaming. Streaming face ca filmul s\ ;nceap\ s\ ruleze de ;ndat\ ce con]inutul necesar pentru primul cadru este desc\rcat pe calculatorul local. Con]inutul r\mas se descarc\ apoi ;n continuare ;n fundal (proces care nu este ;ns\ sesizat de utilizator). Avantajul metodei streaming este c\ se scurteaz\ timpul perceput de utilizator pentru desc\rcarea filmului de pe Internet. Timpul este de fapt acela[i, dar utilizatorul nu percepe ca timp de desc\rcare dec=t timpul necesar desc\rc\rii con]inutului necesar pentru primul cadru. 5.24 Crearea unei introduceri pentru streaming

:n cazul streaming este adesea recomandat s\ se ;nceap\ cu o scen\ de introducere care se descarc\ rapid [i care este rulat\ ;ncontinuu p=n\ c=nd urm\toarea scen\ s-a desc\rcat de pe Internet. :n acest exemplu se va ad\uga un film de tip Flash care anun]\ utilizatorul ca restul fimului se ;ncarc\.

- se trage membrul distribu]ie Black Shape peste cadrul 1 din canalul 1 ;n Score. Sprite-ul astfel creat va cuprinde cele 10 cadre disponibile<

- folosind fereastra Property Inspector se redimensioneaz\ sprite-ul prin setarea Left, Top, Right [i Bottom la 0,0,450 [i respectiv 500<

214

- ;n fereastra Score se selecteaz\ cadrul 1 din canalul 2 [i se trage membrul distribu]ie text Loading ;ntr-un loc apropiat de centrul scenei (Stage)<

- se selecteaz\ sprite-ul text Loading [i i se seteaz\ cerneala ca fiind Background Transparent<

- se trage membrul de distribu]ie Loadloop ;n cadrul 1 din canalul 3 al ferestrei Score. Acest membru de distribu]ie este un film Flash [i ;i va comunica utilizatorului c\ filmul se descarc\ de pe Internet<

- pe scen\ (Stage) se trage sprite-ul Loadloop ;n a[a fel ;nc=t s\ fie centrat sub text<

- din fereastra Library List se selecteaz\ Internet [i apoi Streaming< - se trage efectul Loop Until Media in Frame is Available ;n canalul

script al cadrului 1< - ;n caseta de dialog Parameters se tasteaz\ 10 ;n c=mpul Wait for

Media in Frame field [i se apas\ Ok. De fapt, ;n acest fel se specific\ programului Director s\ ruleze filmul

Flash p=n\ c=nd tot con]inutul necesar p=n\ la cadrul 10 se descarc\. Odat\ ce sprite-urile din cadrul 10 s-au desc\rcat, efectul se termin\ [i filmul ;ncepe s\ ruleze, urm=nd ca procesul de desc\rcare s\ continue ;n fundal. 5.25 Publicarea filmului pe Internet

Director poate genera ;ntr-o singur\ etap\ o pagin\ web care s\ includ\ filmul realizat. Se selecteaz\ astfel op]iunea Publish din meniul File, dup\ ce ;n prealabil se salveaz\ filmul. Director creaz\ o versiune Shockwave a filmului ;n acela[i director ;n care se g\se[te salvat acesta. Se va deschide apoi o fereastr\ a browserului curent [i filmul Shockwave va fi rulat. Fimul va putea fi vizualizat ;n browser, dac\ acesta are instalat un plug-in pentru Shockwave. :n caz contrar, utilizatorul este ghidat spre pagina de desc\rcare gratuit\ de pe Internet a plug-in-ului. 5.26 Ad\ugare interactivitate cu Lingo

Lingo este limbajul de programare din spatele programului Director 8. Cu ajutorul acestuia se pot crea scripturi (programe) pentru a introduce interactivitate ;n film. Folosind Lingo, se pot realiza multe opera]ii care de regul\ pot fi realizate cu ajutorul interfe]ei grafice a programului Director (ca de exemplu schimbarea culorii sau dimensiunii unui sprite, mutarea unui sprite pe scen\ etc.).

Utilitatea folosirii limbajului Lingo vine din flexibilitatea pe care o aduce filmului. :n loc s\ se ruleze o serie de cadre consecutive, a[a cum sunt ele dictate de scenariu (Score), Lingo poate controla rularea filmului ca

215

r\spuns la diverse condi]ii sau evenimente. De exemplu, un sprite se poate muta sau nu dac\ utilizatorul a ap\sat sau nu un anumit buton de pe scen\.

Director include o serie de scripturi predefinite care se g\sesc ;n fereastra Library Palette [i se numesc comportamente. Aceste comportamente dau posibilitatea utilizatorului s\ adauge interactivitate f\r\ a scrie linii de cod, ci doar prin tragerea acestora peste sprite-urile corespunz\toare. Aceste scripturi predefinite pot fi modificate, sau utilizatorul poate scrie propriile scripturi pe care s\ le asocieze unor sprite-uri. 5.27 Folosire marcatori

Marcatorii identific\ loca]ii fixe la un anumit cadru din film. Cu alte cuvinte, un marcator este de fapt un nume asociat unui cadru din film. Marcatorii se folosesc atunci c=nd se creaz\ structuri de naviga]ie ;n film (meniuri). Folosind Lingo sau comportamente din Library Palette se poate muta capul de citire la anumite cadre identificate prin marcatori. Acest lucru este folositor atunci c=nd se sare la scene noi dintr-un meniu.

Odat\ ce un cadru a fost marcat (i s-a asociat un marcator), numele marcatorului poate fi folosit ;n comportamentele predefinite sau ;n scripturi pentru a face referire la cadrul asociat acestuia. Referirea la cadrele din filme se poate face de asemenea folosind num\rul acestora, dar folosind marcatorii este o solu]ie mai elegant\. Un dezavantaj al folosirii numerelor cadrelor ;n locul unor marcatori apare ;n cazul ;n care se insereaz\ sau se [terg cadre din Score. 5.27.1 Crearea unui marcator

Pentru crearea unui marcator se poate face clic simplu ;n canalul special asociat marcatorilor din fereastra Score (Figura 5.37). :n locul respectiv apare un nou marcator cu numele implicit New Marker n unde n este num\rul marcatorului. Utilizatorul poate asocia un alt nume cu respectivul marcator (Figura 5.38). 5.27.2 {tergerea unui marcator

Pentru [tergerea unui marcator se folose[te metoda tragerii cu mouse-ul al acestuia afar\ din canalul special al marcatorilor.

216

Canalul marcatorilor

Figura 5.37 Canalul marcatorilor din fereastra Score

Figura 5.38 Ad\ugarea [i atribuirea de nume a unui marcator

Figura 5.39 Lista marcatorilor

Figura 5.40 Fereastra asociat\ marcatorilor

:n timpul implement\rii aplica]iei multimedia ;n Director, utilizatorul

poate folosi butoanele Next Marker [i Previous Marker din partea st=ng\ a canalului special asociat marcatorilor pentru a muta capul de citire la marcatorul urm\tor sau cel dinainte. Exist\ o fereastr\ asociat\ marcatorilor care se nume[te Markers (Figura 5.40). Aceasta poate fi afi[at\ prin dou\

217

metode. Prima metod\ este folosirea butonului Markers Menu din st=nga canalului marcatorilor (Figura 5.39). Acest buton afi[eaz\ o list\ a marcatorilor, iar ;n finalul listei o op]iune Markers pentru afi[area ferestrei asociate marcatorilor. O alt\ modalitate de a afi[a fereastra Markers este selectarea op]iunii Markers din meniul Window. :n partea st=ng\ a ferestrei Markers sunt afi[a]i to]i marcatorii defini]i ;n film, utilizatorul put=nd selecta unul dintre ace[tia. :n partea dreapt\ a ferestrei, se afi[eaz\ numele marcatorului selectat, nume care poate fi editat. De asemenea, sus ;n fereastra marcatorilor este specificat num\rul cadrului asociat cu marcatorul curent. 5.28 Controlul naviga]iei

Se consider\ urm\torul exemplu simplu. Exist\ o sec]iune ;n film unde exist\ un meniu cu dou\ op]iuni (Optiunea1 [i Optiunea2, Figura 5.41). Execu]ia filmului se opre[te dup\ afi[area meniului [i se a[teapt\ ca utilizatorul s\ selecteze una din cele dou\ op]iuni. Dac\ se apas\ Optiunea1, atunci capul de citire va efectua un salt la o sec]iune din film asociat\ cu Optiunea1 (Figura 5.42). :n mod similar, capul de citire va s\ri la o sec]iune din film asociat\ cu Optiunea2 atunci c=nd utilizatorul apas\ cu butonul st=nga al mouse-ului pe sprite-ul asociat op]iunii 2 (Figura 5.43). Dup\ ce s-a terminat sec]iunea asociat\ unei op]iuni, pe ecran apare un sprite pe care dac\ se apas\ se revine ;n meniu (capul de citire face din nou un salt la sec]iunea de afi[are a meniului).

Figura 5.41 Scena pentru meniu

218

Figura 5.42 Scena pentru sec]iunea 1

Figura 5.43 Scena pentru sec]iunea 2

Figura 5.44 Fereastra Score pentru exemplul de fa]\

219

Practic, este implementat urm\torul exemplu (Figura 5.44)> - de la cadrul 0 p=n\ la cadrul 15 este afi[at meniul< - la cadrul 15 rularea filmului trebuie oprit\ pentru a da posibilitatea

utilizatorului s\ aleag\ o op]iune [i astfel se folose[te comportamentul Hold on Current Frame din categoria Navigation a Library Palette<

- sec]iunea din film asociat\ op]iunii 1 se g\se[te ;ntre cadrul 20 [i 30< - sec]iunea din film asociat\ op]iunii 2 se g\se[te ;ntre cadrul 35 [i 45.

Pentru ca dup\ afi[area sec]iunii corespunz\toare unei op]iuni din meniu aplica]ia s\ a[tepte interven]ia utilizatorului (re;ntoarcerea ;n meniu prin ap\sarea unui sprite) se folose[te la sf=r[itul acestor sec]iuni acela[i comportament asociat cadrelor de sf=r[it Hold On Current Frame.

Fiec\rui cadru de ;nceput a unei sec]iuni i se definesc ni[te marcatori, astfel pentru cadrul 0 marcatorul meniu, pentru cadrul 20 marcatorul opt1 [i pentru cadrul 35 marcatorul opt2.

Ceea ce mai trebuie f\cut acum este s\ se asocieze un comportament sau un mic script sprite-urilor care reprezint\ op]iunile, astfel ;nc=t capul de citire s\ sar\ la sec]iunea asociat\. Exista dou\ metode>

1. Folosind un script Lingo Pentru a asocia un script unui sprite se folose[te meniul context al sprite-ului respectiv [i se selecteaz\ op]iunea Script. Pe ecran este afi[at\ o fereastr\ ;n care utilizatorul, folosind limbajul de programare Lingo poate scrie scriptul (Figura 5.45). Implicit, c=nd se asociaz\ un script unui sprite se consider\ c\ respectivul script se execut\ ;n momentul c=nd se apas\ cu butonul st=nga al mouse-ului pe sprite (scriptul trateaz\ ;n mod implicit evenimentul care se produce la ap\sarea butonului st=nga al mouse-ului). De aici provin [i liniile de cod care apar ;n fereastra scriptului>

on mouseUp me end

Pentru a realiza s\ritura la sec]iunea asociat\ op]iunii, se poate folosi urm\toarea linie de cod>

on mouseUp me go to frame "opt1" end

220

Figura 5.45 Fereastra pentru scrierea scriptului ;n Lingo

Linii de cod asem\n\toare se introduc [i ;n scripturile asociate sprite-urilor Optiune2 [i :napoi la meniu (Figura 5.46 si Figura 5.47).

Figura 5.46 Scriptul Lingo pentru saltul la sec]iunea 2

Figura 5.47 Scriptul Lingo pentru saltul ;napoi la meniu

221

2. Folosind efectul Go To Frame X Button din categoria Navigation a Library Palette. Se folose[te metoda tragerii cu mouse-ul pentru a lua efectul din fereastra Library Palette [i a-l trage peste sprite-ul corespunz\tor. Pe ecran apare o caset\ de dialog ;n care utilizatorul trebuie s\ introduc\ num\rul cadrului la care se execut\ s\ritura. Aten]ie, nu se poate introduce un marcator c=nd se folose[te acest efect. Din aceasta cauz\ solu]ia cea mai elegant\ este cea de la punctul 1.

5.29 Realizarea efectului RollOver

Folosind comportamentele predefinite din Library Palette utilizatorul poate foarte simplu s\ realizeze a[a numitele efecte RollOver. Aceste efecte presupun schimbarea aspectului unui obiect, atunci c=nd mouse-ul este trecut deasupra lor. Cu alte cuvinte, c=nd cursorul mouse-ului se afl\ deasupra unui sprite, atunci acesta ;[i va schimba aspectul, iar c=nd cursorul mouse-ului p\r\se[te respectivul sprite, acesta revine la aspectul ini]ial. Un astfel de efect este util pentru a ad\uga interactivitate unei aplica]ii multimedia. :n continuare se va prezenta un exemplu foarte simplu. Un dreptunghi ro[u din scen\ va fi schimbat ;ntr-unul verde atunci c=nd cursorul mouse-ului este deasupra acestuia. C=nd cursorul mouse-ului p\r\se[te sprite-ul, atunci dreptunghiul va redeveni ro[u. Pentru aceasta este nevoie de doi membri distribu]ie [i anume un dreptunghi ro[u (cu numele rosu) [i un dreptunghi verde (cu numele verde), ambele cu acelea[i dimensiuni (Figura 5.48). Efectul de rollover va ;nsemna practic schimbarea sprite-ului rosu cu sprite-ul verde ;n momentul c=nd cursorul mouse-ului se afl\ deasupra dreptunghiului ro[u.

Figura 5.48 Cele doi membrii distribu]ie rosu si verde

:n primul r=nd se va pozi]iona ;n canalul 1, cadrul 1, dreptunghiul

ro[u [i se va extinde sprite-ul astfel format p=n\ ;n cadrul 30. Este apoi

222

nevoie de a men]ine capul de citire ;n cadrul 30 pentru a da posibilitatea utilizatorului s\ mi[te mouse-ul [i s\ aduc\ cursorul peste sprite-ul respectiv. Se folose[te astfel din Library Palette comportamentul Hold on Current Frame din categoria Navigation [i se trage peste cadrul 30 din canalul special Script. Dac\ se ruleaz\ acum filmul, se poate observa capul de citire care r\m=ne pe cadrul 30, f\r\ ;ns\ ca filmul s\ se termine.

Tot din Library Palette se va folosi acum comportamentul asociat cu efectul RollOver. Din categoria Animation, subcategoria Interactive se alege comportamentul Rollover Member Change [i se trage peste sprite-ul rosu (fie ;n Stage, fie ;n Score). Pe ecran va ap\rea caseta de dialog cu parametrii respectivului comportament (Figura 5.49). :n cazul de fa]\ utilizatorul este ;ntrebat cu ce s\ fie substituit sprite-ul ;n cazul unui rollover (dac\ cursorul mouse-ului se afl\ deasupra acestuia). Se alege din caseta derulant\ disponibil\ sprite-ul verde [i se apas\ butonul OK.

Figura 5.49 Caseta de dialog cu parametrii comportamentului Rollover

Member Change

Singurul lucru care mai r\m=ne de f\cut este testarea filmule]ului. Dac\ se ruleaz\, se poate observa c\ atunci c=nd cursorul mouse-ului se afl\ deasupra dreptunghiului ro[u, acesta ;[i schimb\ culoarea ;n verde, iar c=nd cursorul p\r\se[te dreptunghiul, culoarea acestuia redevine ro[ie. 5.30 Realizarea unei aplica]ii executabile de sine-st\t\toare

Director pune la dispozi]ia utilizatorilor un mecanism de realizare a unei aplica]ii executabile de sine-st\t\toare (aplica]ie numit\ Projector). Pentru aceasta se selecteaz\ op]iunea Create Projector din meniul File. Director ;ntreab\ dac\ s\ salveze eventualele schimb\ri ale filmului curent, deoarece acesta trebuie ;nchis pentru a crea un projector. Pe ecran va fi afi[at\ caseta de dialog Create Projector (Figura 5.50). Utilizatorul poate alege acum filmul Director (fi[ierul cu extensia dir) care se vrea a fi convertit ;ntr-o aplica]ie de sine-st\t\toare.

223

Figura 5.50 Caseta de dialog Create Projector

Figura 5.51 Caseta de dialog Save Projector As

224

Odat\ ales un fi[ier dir, se poate ap\sa pe butonul Create pentru crearea fi[ierului Projector. Pe ecran va fi afi[at\ o nou\ caset\ de dialog Save projector as ;n care utilizatorul trebuie s\ selecteze sub ce nume va fi creat\ aplica]ia executabil\ [i loca]ia pe disc unde va fi salvat\ aceasta (Figura 5.51).

Prin ap\sarea butonului Save, Director trece la crearea aplica]iei executabile, pe ecran fiind afi[at\ o fereastr\ de dialog cu starea curent\ a acestui proces (Figura 5.52).

Aplica]ia creat\ este o aplica]ie executabil\ (un fi[ier cu extensia exe), care poate fi executat\ pe orice PC care ruleaz\ sub un sistem de operare Windows. Aplica]ia poate fi scris\ pe un CD [i astfel s\ fie folosit\ pe un alt calculator.

Figura 5.52 Crearea aplica]iei

5.31 Etapele de realizare a unei aplica]ii ;n Director 8

Pentru realizarea unei aplica]ii multimedia ;n Director 8 trebuie parcurse urm\toarele etape>

- Stabilirea temei [i a audien]ei pentru respectiva aplica]ie Aceasta este prima etap\ a realiz\rii unei aplica]ii multimedia [i presupune ;n primul r=nd stabilirea temei pentru aceasta. :n func]ie de tema aleas\ (prezentarea unui proces, serviciu, a unei companii etc.) se specific\ [i audien]a ]int\ a acesteia. Acest lucru este foarte important ;n principal pentru modul de prezentare a informa]iilor c\tre publicul ]int\. :ntr-un fel se prezint\ informa]iile c\tre ni[te copii, sau c\tre un public care nu are cuno[tin]e despre domeniul respectiv, fa]\ de modul de prezentare a informa]iilor c\tre un public avizat. - Storyboard Fiind vorba de o aplica]ie multimedia, trebuie realizat un a[a numit storyboard. Acesta este ;n esen]\ o copie desenat\ pas cu pas pe h=rtie a aplica]iei multimedia (ecran cu ecran). Astfel se poate decide at=t asupra

225

unui design [i format de prezentare a informa]iilor c\tre publicul ]int\, c=t [i asupra tipului de informa]ii multimedia necesare ;n acest scop. Pentru fiecare ecran sunt necesare anumite tipuri de informa]ii multimedia pentru a transmite c\tre publicul ]int\ mesajul corespunz\tor. :n unele cazuri, doar textul este suficient, pe c=nd ;n altele sunt necesare imagini, informa]ii audio sau video etc. - Adunarea informa]iilor multimedia Aceast\ etap\ presupune str=ngerea tuturor informa]iilor necesare pentru realizarea aplica]iei multimedia. Cu alte cuvinte, aceast\ etap\ presupune str=ngerea tuturor membrilor de distribu]ie necesari. O surs\ important\ de informa]ii multimedia este Internetul. Trebuie avut ;ns\ grij\ la drepturile de autor. Pentru folosirea informa]iilor multimedia prezentate de un site Internet, trebuie cerut acordul ;n scris a administratorilor acestuia. :n cazul realiz\rii unor aplica]ii non-comerciale (de exemplu proiecte studente[ti), majoritatea site-urilor Web permit folosirea propriilor materiale ap\rate de drepturile de autor. - Stabilirea liniei temporale (timeline) Anterior a fost prezentat modul de realizare a unei aplica]ii multimedia ;n Director. Cea mai important\ parte a acestei aplica]ii este scenariul, adic\ momentul de apari]ie a fiec\rui actor [i durata c=t acesta este pe scen\. Cu alte cuvinte, pentru fiecare actor trebuie stabilit cadrul ;n care va ap\rea pe scen\ [i cadrul ;n care va disp\rea de pe scen\. Aceasta este de fapt linia temporal\ (timeline) pentru aplica]ia multimedia. Este recomandat ca, ;nainte de trecerea la implementarea propriu-zis\ a aplica]iei, s\ se decida linia temporal\ pentru aceasta. Astfel se poate decide asupra timpului necesar pentru ca ;ntreaga aplica]ie s\ ruleze. - Implementarea aplica]iei cu Director 8 Aceasta este etapa de realizare a aplica]iei multimedia propriu-zis\. - Testarea Odat\ aplica]ia implementat\, aceasta trebuie testat\. Etapa curent\ presupune verificarea at=t a informa]iilor prezentate ;n aplica]ie, c=t [i buna func]ionare a acesteia. De exemplu, dac\ aplica]ia con]ine un meniu, atunci trebuie verificat\ corectitudinea func]ion\rii leg\turilor (s\riturilor) din acesta. - Evaluarea interfe]ei Aplica]ia multimedia este prezentat\ publicului prin intermediul unei interfe]e grafice. Aceast\ interfa]\ trebuie evaluat\ ;n scopul stabilirii

226

performan]ei acesteia. Practic, publicul ]int\ are acces la informa]iile con]inute ;n aplica]ia multimedia doar prin intermediul acestei interfe]e. Dac\ interfa]a este facil\ [i u[or de ;n]eles de c\tre publicul ]int\, atunci aplica]ia multimedia poate avea succes din start. Dac\ ;ns\ interfa]a nu este proiectat\ a[a cum ar trebui, publicul ]int\ poate avea dificult\]i ;n folosirea acesteia [i implicit accesul la informa]iile oferite de aceasta poate avea de suferit. Exist\ ;n principal patru modalit\]i de evaluare a unei interfe]e>

- ;n mod formal cu ajutorul unor tehnici de analiz\< - ;n mod automat prin anumite proceduri computerizate< - ;n mod empiric prin experimente cu subiec]i umani< - ;n mod heuristic prin observarea interfe]ei [i comentarea

acesteia ;n func]ie de anumite concepte. Se va prezenta ;n continuare metoda de evaluare heuristic\ a unei interfe]e. Aceast\ metod\ a fost propus\ de Nielsen [i Molich ;n 1990 [i este o metod\ inginereasc\ de g\sire a problemelor de folosire a unei interfe]e ;n scopul corect\rii acestora ca parte a unui proces iterativ de proiectare. Evaluarea heuristic\ presupune ca un grup mic de evaluatori s\ examineze interfa]a [i s\ judece compatibilitatea acesteia cu anumite principii recunoscute de folosire a acesteia. Aceste principii se numesc principii heuristice. :n principiu, evaluatori individuali pot realiza o evaluare heuristic\ a unei interfe]e, ;ns\ experien]a a indicat c\ oricare evaluator individual nu va g\si o mare parte din problemele de folosire a interfe]ei respective. Nielsen a aratat c\ folosind evaluatori individuali, numai aproximativ 35% din erorile de proiectare ale unei interfe]e au fost g\site de ace[tia. Partea bun\ a lucrurilor este aceea c\ majoritatea evaluatorilor g\sesc erori sau probleme diferite ale interfe]ei [i de aceea se poate ob]ine o performan]\ ridicat\ a acestei metode de evaluare prin agregarea rezultatelor evalu\rii mai multor evaluatori. Practic, fiecare evaluator inspecteaz\ interfa]a ;n mod individual. Dup\ ce toate evalu\rile au fost terminate, evaluatorilor li se permite s\ comunice unul cu cel\lalt ;n vederea agreg\rii rezultatelor. :n acest fel se ob]ine o evaluare independent\ [i neinfluen]at\ a interfe]ei respective. Pentru realizarea unei evalu\ri corecte, grupul de evaluatori trebuie s\ se ghideze dup\ anumite principii de folosire a interfe]ei. Nielsen a propus ;n 1990 un set de 9 principii heuristice care pot fi folosite pentru a genera idei ;n timpul evalu\rii critice a unei interfe]e. Acestea sunt>

1) Design simplu [i natural (Simple and natural design) Dialogurile nu trebuie s\ con]in\ informa]ii irelevante sau care sunt folosite prea rar. Orice informa]ie irelevant\ dintr-un

227

dialog este ;n competi]ie cu informa]iile relevante. Toate informa]iile trebuie s\ apar\ ;ntr-o manier\ natural\ [i logic\.

2) Folosirea limbajului natural al utilizatorului (Speak

the users language) Dialogurile cu utilizatorii trebuie s\ fie exprimate ;n cuvinte, fraze [i concepte familiare acestora.

3) Minimizarea ;nc\rc\rii memoriei utilizatorului

(Minimize the users memory load) Dup\ cum se [tie, capacitatea memoriei umane pe termen scurt este limitat\. De aceea, utilizatorul nu ar trebui s\ fie nevoit s\ ;[i aminteasc\ informa]ii dintr-un dialog ;n altul. Instruc]iunile pentru folosirea sistemului trebuie s\ fie vizibile [i u[or de g\sit sau reg\sit dac\ este cazul. Instruc]iunile complicate trebuie s\ fie simplificate.

4) Consecven]\ ;n design (Be consistent) Utilizatorii unei interfe]e nu trebuie s\ se ;ntrebe dac\ anumite cuvinte, situa]ii sau ac]iuni ;nseamn\ acela[i lucru. O anumit\ ac]iune a sistemului trebuie s\ fie ;ntotdeauna atins\ printr-o anumit\ ac]iune a utilizatorului.

5) Fiecare ac]iune a utilizatorului are o reac]iune din

partea interfe]ei (Provide feedback) :n permanen]\, sistemul trebuie s\ ]in\ utilizatorul la curent cu ceea ce se ;nt=mpl\. Astfel, prin punerea la dispozi]ie cu reac]iuni ;n timp util la ac]iunile utilizatorului, sistemul men]ine un contact permanent cu acesta.

6) Interfa]a trebuie s\ posede ie[iri vizibil marcate

(Provide clearly marked exits) Un sistem cu un design bun nu trebuie s\ permit\ utilizatorului s\ se g\seasc\ ;ntr-o stare f\r\ ca acesta s\ aib\ posibilit\]i de ie[ire vizibil marcate. :n general, utilizatorii folosesc adesea anumite func]ii ale sistemului sau interfe]ei din gre[eal\ [i de aceea ace[tia vor avea nevoie de anumite porti]e de ie[ire din starea nedorit\.

228

7) Interfa]a trebuie s\ pun\ la dispozi]ia utilizatorului scurt\turi (Provide shortcuts)

Propriet\]ile unei interfe]e care o fac u[or de ;nv\]at, ca de exemplu dialogurile interactive, sunt adesea obositoare pentru utilizatorii experimenta]i. Pentru ace[tia, sistemul trebuie s\ pun\ la dispozi]ie anumite scurt\turi care s\ ;i u[ureze acestuia munca.

8) Interfa]a trebuie s\ pun\ la dispozi]ia utilizatorului

mesaje de eroare corespunz\toare (Provide good error messages)

Mesajele bune de eroare sunt defensive, precise [i constructive. Mesajele de eroare defensive dau vina pe deficien]ele sistemului [i nu critic\ niciodat\ utilizatorul. Mesajele de eroare precise specific\ utilizatorului informa]ii exacte despre cauza sau cauzele acestora. Mesajele de eroare constructive specific\ utilizatorului sugestii pentru corec]ia acestora.

9) Preven]ia erorilor (Error prevention) Un design mai bun dec=t cel care specific\ mesaje de eroare bune este un design care previne ca erorile s\ apar\.

:n 1994, Nielsen a ;mbun\t\]it aceste principii heuristice [i a anun]at

un set de 10 principii>

1) Vizibilitatea st\rii sistemului (Visibility of system status)

Sistemul trebuie ca ;n permanen]\ s\ ]in\ utilizatorii la curent cu ceea ce se ;nt=mpl\ (;ntr-un interval de timp rezonabil).

2) Compara]ie ;ntre sistem [i lumea real\ (Match between

system and the real world) Sistemul trebuie s\ vorbeasc\ limba utilizatorului prin intermediul cuvintelor, frazelor [i a conceptelor familiare acestuia [i nu ;n termeni specifici sistemului.

3) Controlul [i libertatea utilizatorului (User control and

freedom) :n general, utilizatorii folosesc adesea anumite func]ii ale sistemului sau interfe]ei din gre[eal\ [i de aceea vor avea nevoie de anumite porti]e de ie[ire din starea nedorit\.

229

Sistemul trebuie s\ pun\ la dispozi]ia utilizatorilor posibilitatea de undo sau de redo. 4) Consecven]\ [i standarde (Consistency and standards) Utilizatorii unei interfe]e nu trebuie s\ se ;ntrebe dac\ anumite cuvinte, situa]ii sau ac]iuni ;nseamn\ acela[i lucru. O anumit\ ac]iune a sistemului trebuie s\ fie ;ntotdeauna atins\ printr-o anumit\ ac]iune a utilizatorului. Trebuie folosite ;n acest scop ac]iuni care au fost deja intrate ;n uz (ac]iuni standard).

5) Preven]ia erorilor (Error prevention) Un design bun trebuie s\ pre;nt=mpine eventualele erori care pot ap\rea.

6) Recunoa[tere ;n loc de amintire (Recognition rather

than recall) Obiectele, ac]iunile [i op]iunile trebuie s\ fie vizibile. Memoria utilizatorului nu trebuie ;nc\rcat\ cu informa]ii care nu sunt necesare.

7) Flexibilitate [i eficien]\ ;n folosire (Flexibility and

efficiency of use) Sistemul trebuie s\ pun\ la dispozi]ia utilizatorilor experimenta]i mecanisme de accelerare a anumitor dialoguri sau ac]iuni.

8) Design estetic [i minimal (Aesthetic and minimalist

design) Dialogurile nu trebuie s\ con]in\ informa]ii care nu sunt relevante sau sunt folosite foarte rar.

9) Ajutarea utilizatorilor s\ recunoasc\, diagnosticheze [i

s\ revin\ din erori (Help users recognize, diagnose, and recover from errors)

Mesajele de eroare trebuie s\ fie prezentate ;n limbaj natural [i nu ;n coduri. Acestea trebuie s\ indice ;n mod precis problema ap\rut\ [i s\ sugereze o posibil\ solu]ie la aceasta.

10) Ajutor [i documenta]ie (Help and documentation) Cu toate c\ este de preferat ca un sistem s\ poat\ fi folosit f\r\ documenta]ie, ar putea fi necesar\ punerea la dispozi]ia utilizatorului a unui help [i documenta]ii. Orice astfel de informa]ie trebuie s\ fie u[or de c\utat [i trebuie s\ comunice

230

utilizatorului pa[ii concre]i pe care trebuie s\ ;i urmeze pentru atingerea scopului. De asemenea, documenta]iile nu trebuie s\ fie laborioase.

Practic, folosind aceste principii heuristice, un set de evaluatori examineaz\ interfa]a respectiv\ [i o judec\ ;n raport cu aceste principii heuristice. De exemplu, se presupune c\ se evalueaz\ o interfa]\ a unui magazin online de pe Internet. Utilizatorul poate naviga prin catalogul de produse [i alege pe acelea pe care le dore[te. De regul\, acestea sunt puse ;ntr-un co[ de cump\r\turi (shopping basket). Odat\ ajunse acolo, utilizatorul poate merge la cas\ (checkout) pentru a ;ncheia tranzac]ia electronic\, sau poate renun]a la ele. De multe ori, un astfel de co[ de cump\r\turi con]ine obiectele dorite de utilizator, dar sunt folosite ni[te coduri interne [i pre]ul acestora. Dac\ cump\r\torul vrea s\ renun]e la anumite obiecte, atunci ar trebui s\ ;[i aduc\ aminte care coduri corespund acestor obiecte. Acest lucru contravine principiilor heuristice Minimizarea ;nc\rc\rii memoriei utilizatorului [i Folosirea limbajului natural al utilizatorului. O alt\ problem\ ar fi aceea ca ;n momentul efectu\rii tranzac]iei electronice, datorit\ codific\rilor [i verific\rilor ce au loc, ;nc\rcarea urm\toarei pagini Web este greoaie [i majoritatea cump\r\torilor sunt tenta]i s\ apese butonul Refresh al browserului pentru c\ sunt convin[i c\ ac]iunea lor nu a avut efect. Acest lucru duce de cele mai multe ori la realizarea aceleia[i tranzac]ii de dou\ ori, deci apari]ia unei erori. Aceasta ar putea fi prevenit\ prin anun]area cump\r\torului c\ cererea este procesat\, c\ trebuie s\ a[tepte p=n\ c=nd tranzac]ia este ;ncheiat\ [i s\ nu apese pe butonul Refresh al browserului. Principiile heuristice ;nc\lcate acum sunt Preven]ia erorilor [i Fiecare ac]iune a utilizatorului are o reac]iune din partea interfe]ei.

Acest proces poate continua p=n\ la g\sirea tuturor ;nc\lc\rilor principiilor heuristice (de regul\ se folosesc cel pu]in 3 evaluatori independen]i ale c\ror rezultate sunt agregate ;ntr-unul singur). Se poate trece apoi la corectarea problemelor g\site, o nou\ evaluare heuristic\ [i procesul continu\ p=n\ c=nd nu mai sunt g\site erori.

231

5.3 Exemplu5.4 Preg\tirea filmului5.5 Salvarea noului film5.6 Creare informa]ie media ;n Director5.7 Crearea unei forme vectoriale5.8 Creare membru distribu]ie de tip text5.9 Vizualizarea membrilor distribu]iei ;n fereastra Cast5.10 Importarea de membri distibutie5.11 Redenumirea membrilor distribu]iei5.12 Ad\ugare comentarii/observa]ii pentru un membru distribu]ie5.14 Schimbarea cernelii pentru un spriteCerneala

5.15 Schimbarea duratei unui sprite5.17 Creare alte sprite-uri5.19 M\rirea sau mic[orarea ferestrei scenei5.20.2 Stoparea rul\rii continue a unui film5.20.4 Creare anima]ie cadru cu cadru5.20.4.1 Schimbarea ordinei membrilor distribu]iei5.21 Ata[are comportamente sprite-urilor5.22 Ad\ugare sunet5.23 Streaming desc\\rcarea rapid\\ d5.24 Crearea unei introduceri pentru streaming5.25 Publicarea filmului pe Internet5.26 Ad\ugare interactivitate cu Lingo5.27 Folosire marcatori5.27.1 Crearea unui marcator5.28 Controlul naviga]iei5.29 Realizarea efectului RollOver5.30 Realizarea unei aplica]ii executabile de sine-st\t\toare5.31 Etapele de realizare a unei aplica]ii ;n Director 8