1 Pagina 1 van 17 In deze kennismakingsoefening ga je enkele basishandelingen aanleren die je met Macromedia Director 7.0. kunt uitvoeren. In de volge...
In deze kennismakingsoefening ga je enkele basishandelingen aanleren die je met Macromedia Director 7.0. kunt uitvoeren. In de volgende oefeningen zullen we deze handelingen verder bespreken. Om die volgende oefeningen beter te begrijpen is het raadzaam deze Tour oefening te maken. Je krijgt daardoor ook een beter idee van wat Director is en kan.
Director 7.0
Tour
Oefenboek Pagina 2 van 17
Introductie oefening Voor dat je met het plaatsen van media in een movie begint ga je de grootte van de Stage bepalen. Omdat je een advertentie via het web gaat publiceren kies je best een web palette voor de movie.
1. Een movie (.dir bestand) aanmaken en de Stagegrootte bepalen. 1. Kies File>New>Movie Als je reeds wijzigingen gemaakt hebt bij de openstaande movie vraagt director je die te bewaren. 2. Om de movie eigenschappen te bepalen kies Modify>Movie>Properties. 3. Om een nieuwe Stagegrootte te bepalen geef je het volgende in; Width box 364 en Height box 320. 4. Om een palet voor een nieuwe movie te bepalen kies je Web216 in het Default Palette pop-up menu (Web 216 is het kleurpalet dat gebruikt wordt bij de meeste webbrowsers) Klik O.K. en de Stage gaat er ongeveer zo uitzien. 5. Kies File>Save as en bewaar de movie (.dir) onder de naam "Louis".
Director 7.0
Tour
2. Maken van een vector tekening 1. Kies Window>Vector Shape 2. Klik op de gevulde rechthoek in het gereedschapsvenster. 3. Teken een rechtopstaande rechthoek. 4. Klik op het kleurverloop (gradient) icoontje. en kies voor de eerste kleur (links) zwart en voor de tweede kleur grijs. 5. Kies in het kleuroverloop pop-up menu Lineair. 6. Kies als hoek 90°. 7. Geef een naam aan de tekening in het "Cast member name venster" vb: "Kleurverloop"
Oefenboek Pagina 3 van 17
Director 7.0
Tour
Oefenboek Pagina 4 van 17
3. Maken van een tekst cast member 1. Kies Window>Text 2. Klik op het pijltje naast het font menu van het tekstvenster om BTimes Bold te selecteren. 3. Klik op het pijltje naast size menu om corps 18 te selecteren. 4. Plaats de rechter marge op 2. 5. Klik op het "Align Center" icoon 6. Selecteer de kleur geel (RGB:#FFCC33) in het gereedschapsvenster. 7. Typ "The Story of Louis Armstrong" 8. Plaats nu de cursor juist voor Louis en druk op enter. 9. Geef tenslotte een naam aan de castmember in het "Cast member name venster" vb: "The story of".
Director 7.0
Tour
Laat ons nu een tweede tekst cast member maken. 1. Klik op "+" in het tekstvenster. 2. Versleep de rechterrand naar 3 3. Typ "Binnenkort op CD-ROM" 4. Geef terug een naam aan de castmember in het "Cast member name venster" vb: "Binnenkort"
Oefenboek Pagina 5 van 17
Director 7.0
Tour
Oefenboek Pagina 6 van 17
4. Tekst zetten met het Paint venster. 1. Kies Window> Paint 2. Dubbelklik op het tekstgereedschap. 3. Selecteer als voorgrondkleur grijs (#888888) en als achtergrondkleur zwart. 4. Selecteer in het Font venster "Arial Black, kies als Size 24, en klik daarna op O.K. 5. Klik op het witte tekenbord en er verschijnt een knipperende cursor. Typ nu "Wonderful World"
6. Selecteer "World" met het selectiegereedschap en verplaats het woord tot het gecentreerd. staat met "Wonderful".
Director 7.0
Tour
Oefenboek Pagina 7 van 17
7. Benoem daarna de cast member in het "Cast member name venster" nl: "Wonderful grijs" 8. Selecteer alles (Win: Ctrl-A, Mac: command-A) en kopieer de castmember naar het klembord (Win: Ctrl-C, Mac: command-C). 9. Maak een nieuw castmember aan door op de "+" in het Paint venster te klikken en benoem de castmember in het "Cast member name venster" nl: "Wonderful kleur1" 10. Plak (Win: Ctrl-V, Mac: command-V) de castmember op het tekenbord en deselecteer door gewoon buiten de selectie te klikken. 11. Selecteer als voorgrondkleur groen (#009900) 12. Selecteer hierna het emmertje in het gereedschapspalet van het Paint venster en klik ermee op de "W","e" en "l" van "Wonderful" en de "W" en "d" van "World". 13. Selecteer nu als voorgrondkleur Rood (#FFOOOO) en klik met het emmertje op de letters "o" en "r" van wonderful 14. Selecteer nu een Gele kleur als voorgrondkleur (#FFCCOO) en selecteer nu met het emmertje de letter "n" en "u" van wonderful en "r" van "World". 15. Selecteer voor de laatste keer een voorgrondkleur nl. blauw (#3366FF) en klik op de overgebleven grijze letters. 16 Herhaal stappen 8 t.e.m 10 en benoem de cast member in het "Cast member name venster" nl: "Wonderful kleur2" 17 Selecteer met het rechthoekig selectiegereedschap de verschillende letters en verplaats die.
18. Herhaal stappen 8 t.e.m 10 en benoem de cast member in het "Cast member name venster" nl: "Wonderful kleur3". Selecteer opnieuw de letters en verplaats die. 19. Sluit het Paint venster.
Director 7.0
Tour
Oefenboek Pagina 8 van 17
5. Importeren van Cast members 1. Kies File>Import. 2. Open de map Start en klik op het bestand Louis.psd in het bovenste venster en klik daarna op Add. 3. Klik op het bestand "Wonderful.aif" en klik opnieuw op Add. Selecteer daarna Import. 4. In het import-optie-venster selecteer je Color Depth: 8bit, Palette remap to web 216, en selecteer dither. Klik daarna op O.K.
Beide media elementen die aangemaakt zijn in een extern programma, nl. Photoshop en Sound Edit, worden als Castmember in de cast geplaatst. Nu we enkele castmembers hebben aangemaakt of geïmporteerd zijn we klaar om te werken met Sprites. Sprites zijn objecten die controleren wanneer, waar en hoe castmembers zullen verschijnen in een movie. Je sleept sprites op de Stage om te bepalen waar ze zullen verschijnen en je versleept de sprite balken op de score om te bepalen wanneer ze zullen verschijnen.
Director 7.0
Tour
Oefenboek Pagina 9 van 17
6. Maken van sprites Voorbereiding: 1. Zorg er voor dat zowel het Cast-, Score, als het Stage venster zichtbaar zijn. 2. Kies File>Preferences>Sprite en geef in het dialoogvenster in: Span duration 48 frames. 3. Kies View>Sprite Overlay>Settings en selecteer RollOver.
Plaatsen van een sprite op de score en de eigenschappen veranderen. 1. Selecteer castmember Louis.psd in de cast en sleep die naar het eerste visuele kanaal op de score. Als je de Stage bekijkt zie je de Afbeelding "Louis".
2. Selecteer de sprite op de Stage of op de score en kies Modify>Sprite>Properties. 3. Selecteer het Top venster en verander de waarde 10 in O klik op O.K. en merk dat de sprite afbeelding naar boven verschoven is.
Director 7.0
Tour
Oefenboek Pagina 10 van 17
4. Selecteer de tekst cast member "Binnenkort" in de cast en sleep die naar het tweede kanaal op de score. kies Mofify>Sprite>Properties en geef de volgende waardes in nl; Location: 79, Top: 299 en klik op O.K. 5. Selecteer de tekst sprite op de stage of op de score en kies Mofify>Sprite>Properties en geef de volgende waardes in nl; Location: 79, Top: 299 en klik op O.K. 6. Je hebt waarschijnlijk al gemerkt dat de tekst sprite een witte achtergrond heeft. Om die achtergrond transparant te maken selecteer je de sprite en kies je in het ink menu van het Score venster Background Transparent.
7. Selecteer het "Kleurverloop" Castmember en sleep het naar het derde kanaal. Wijzig dan de volgende eigenschappen in het propertie venster. (Deselecteer maintain Proportions). Width: 95, Height 85, Left:230, Top:0 en klik daarna op O.K. 8. In plaats van parameters in te geven in het properties venster kun je ook manueel een sprite positioneren op de stage. Selecteer de "Wonderful grijs" castmember en sleep die rechtstreeks op de stage onder de kleurverloopbalk. Bemerk het witte rechthoekje links onder de sprite. Dit is de witte achtergrond van die sprite. Om dit weg te krijgen selecteer je de sprite en kies je in het ink menu in het Score venster Background Transparent. 9. Herhaal stap 8 maar nu met de castmember "The Story" en plaats die onder "Wonderful World". 10. Wat we nu gaan doen is de tekst "The story of" vervangen door "Het verhaal van" Je kan de tekst rechtstreeks wijzigen op de stage. Dubbelklik op de sprite "The story of" en sleep met de cursor over "The story of" en "Typ het verhaal van" in de plaats. Zoals je merkt is de tekst veranderd op de stage.
Director 7.0
Tour
Oefenboek Pagina 11 van 17
7. Het maken van een eenvoudige animatie. 1. Kies View> Sprite Overlay, deselecteer Show info en selecteer show paths. 2. Zet alle kanalen onzichtbaar behalve het kanaal waar de sprite "binnenkort" in staat. Klik daarvoor op het sluitvakje naast het kanaalnummer van ieder kanaal. 3. Selecteer op de Stage de "Binnenkort" sprite en bemerk de grote blauwe knop en de kleine rode knop in de linker bovenhoek van de sprite. Dit is een speciale hendel om een animatie met de sprite te maken. 4. Houd de Shift toets ingedrukt en sleep de hendel ietsje naar rechts (tot boven de "k"). Nu zie je een blauwe en een rode cirkel. De rode duidt het einde van de animatie aan en de blauwe het begin. Wanneer je de Shift toets indrukt beperk je de beweging tot horizontaal of vertikaal. 5. Klik nu op de blauwe knop en sleep die tot aan de linker rand van de Stage. 6. Om de animatie te zien klik je op de play knop in het Control venster. De tekst beweegt tussen het start- en eindpunt die je hebt gedefinieerd.
7. We gaan de tekst nu laten in- en uitfaden. Selecteer het 24ste frame van kanaal 2 in de score. 8. Kies Insert>Keyframe en selecteer daarna het eerste keyframe van de sprite in kanaal 2. Geef in het blend venster bovenaan het score venster de waarde 0 in.
9. Selecteer daarna het laatste keyframe van de sprite in kanaal 2 en geef in het blendvenster terug waarde 0 in. 10. Zet alle kanalen weer zichtbaar door op het sluitvakje naast het kanaalnummer van ieder kanaal te klikken. 11. Om de animatie te zien klik je terug op de play knop in het Control venster. De tekst beweegt tussen het start en eindpunt die je hebt gedefinieerd en het licht aan en uit.
Director 7.0
Tour
Oefenboek Pagina 12 van 17
Als je de movie afspeelt merk je dat na een tijdje al de beelden op de stage verdwenen zijn. Dat komt omdat de playback head doorloopt. Aangezien we maar sprites hebben geplaatst tot frame 48 zal er na frame 48 niets meer te zien zijn behalve een lege stage. We moeten dus de playback head van frame 48 terug naar frame 1 laten springen, met andere woorden de animatie in een loop plaatsen. We gaan een Lingo script gebruiken die zegt dat de playback head terug naar frame 1 moet gaan. Frame 1 kunnen we ook anders definieren door er een marker boven te plaatsen.
8. Plaatsen van een marker 1. Klik met de cursor in de marker balk ter hoogte van frame 1. Een marker verschijnt met de naam "New marker". Vervang die naam door "Start" te typen. (Je kunt de marker wegdoen door die gewoon uit de balk te slepen.) Gebruiken van het behaviors palette 1. Kies daarna Window>Library palette en kies in de library list "Navigation". Selecteer het "Go loop" pictogram en sleep het naar frame 48 op de Score. 2. Als we nu onze film terugspoelen en laten afspelen dan zien we op de Stage en Via de Score dat onze movie in een loop draait. De playbackhead springt van frame 48 naar frame 1 of de eerste vorige marker.
Director 7.0
Tour
Oefenboek Pagina 13 van 17
9. Gebruiken van de behavior inspector. Een volgende stap in de creatie van onze movie is een Roll-over maken. Daarvoor hebben we terug een Lingo script nodig. We gaan dit Lingo script maken door een behavior te creëren in de behavior inspector. 1. Kies Window>Inspectors>Behavior 2. Klik op het behavior pop up menu en selecteer new Behavior. In het "Name Behavior" dialoogvenster geef je de naam "Roll over Wonderful" in en je klikt op O.K. 3. Klik op het Event pop up menu en selecteer "Mouse Enter". 4. Klik op het Actions Pop-up menu en selecteer Sprite>Change Cast Member Selecteer in het pop-up menu van het dialoogvenster "Wonderful kleur1" 5. Selecteer terug het Event pop-up menu en selecteer "Mouse Within". 6. Klik op het Actions Pop-up menu en selecteer Sprite>Change Cast Member Selecteer in het pop-up menu van het dialoogvenster "Wonderful kleur1" 7. Selecteer terug het Event pop-up menu en selecteer "Mouse Leave". 8. Klik op het Actions Pop-up menu en selecteer Sprite>Change Cast Member Selecteer in het pop-up menu van het dialoogvenster "Wonderful grijs" en sluit het behavior Inspector venster. 9. Sleep de nieuwe behavior "Roll over Wonderfull" die zich nu in de cast bevindt naar de sprite "Wonderful grijs in de Score. Resultaat: Wanneer we de movie afspelen en we gaan met de cursor boven de grijze tekst verandert die in een gekleurde tekst.
Oefenboek
Director 7.0
Tour
Pagina 14 van 17
Wat we nu gaan toevoegen aan onze movie is geluid en een nieuwe animatie. De bedoeling is dat als we op "Wonderful World" klikken Louis begint te praten en dat de "Wonderful World" tekst danst. Willen we de tekst niet meer horen dan klikken we terug op "Wonderful World".
10. Een geluidsbestand plaatsen in het geluidskanaal. 1. Selecteer alle kanalen waar sprites in staan door de Shift-toets in te drukken en op hun symbool of nummer te klikken links van het kanaal. 2. We kopiëren de sprites door de (Win: Alt-toets; Mac: Option-toets) in te drukken en die te verslepen. Plaats het eerste keyframe van de sprites in frame 60. 3. In de marker balk in frame 60 plaatsen we een nieuwe marker en noemen die "Gesprek". 4. In frame 107 in het behavior kanaal plaats je een nieuw script. Dubbel klik op dit frame en je krijgt een behavior script venster te zien. Tussen regel On exitFrame en end typ je: go to frame "Gesprek". Noem die behavior "go gesprek" en typ dit in het "cast member name venster". 5. Sleep de castmember "Wonderful.aif" naar het eerste geluidskanaal en laat het beginnen op frame 60.
11. Het maken van een eenvoudige animatie. Deel2 1. Vooraleer je de letters laat dansen doe dit. Kies File>Preferences>Sprite en zet de Span duration op 1 frame. 2. Selecteer de castmember "Wonderful Kleur 1" in de cast en sleep die naar Frame 60 in Kanaal 4. Plaats vervolgens de castmembers "Wonderful Kleur 2" en "Wonderful Kleur 3" in respectievelijk frame 61 en 62. 3. Selecteer de drie sprites door de Shift-toets in te drukken en op de sprite te klikken in frame 60. Kopieer ze door de (Win Alt-toets; Mac Option-toets) in te drukken en ze te verslepen naast de eerder geplaatste sprites. Kopieer telkenmale die drie sprites tot kanaal vier van frame 60 tot 107 gevuld is. 4. Bewaar de movie.
Director 7.0
Tour
Oefenboek Pagina 15 van 17
12. Een behavior aanpassen. 1. Dubbelklik op castmember "Rollover Wonderful" in de cast en er verschijnt opnieuw een "behavior inspector venster". 2. Klik op de event pop-up en selecteer "Mouse Down" 3. Klik op het action pop-up menu en selecteer Navigation>Go to Marker en selecteer in het pop-up menu van het "Specify Marker venster" "Gesprek". Klik daarna op O.K. We gaan een laatste behavior aanmaken die ons in staat stelt als we op de dansende letters klikken de muziek ophoudt. Daarvoor moet de playback head terug naar de "Start marker springen". 1. Kies Window>Inspectors>Behavior 2. Klik op het behavior pop-up menu en selecteer new Behavior. In het "Name Behavior" dialoogvenster geef je de naam "Go to Start" in en je klikt op O.K. 3. Klik op het Event pop-up menu en selecteer "Mouse Down". 4. Klik op het action pop-up menu en selecteer Navigation>Go to Marker en selecteer in het pop-up menu van het "Specify Marker venster" "Start". Klik daarna op O.K. Bemerk dat de nieuwe Behavior ook in de cast staat. 5. Sleep de nieuwe behavior "Go to Start" die zich nu in de cast bevindt naar de sprites die zich in Kanaal 4 tussen frame 60 en 107 bevinden. 6. Speel de movie af door het controle venster te gebruiken. 7. Bewaar de movie.
Director 7.0
Tour
Oefenboek Pagina 16 van 17
13. Onze movie publiceren op het net. Wanneer we ons director bestand willen publiceren via Internet gaan we een aantal stappen volgen. Eerst wordt het Director bestand omgezet naar een Shockwave bestand (.dcr) Een Shockwave bestand is een gecompresseerde versie van onze movie (.dir) die geoptimaliseerd is voor publicatie op het internet. Je kan een Shockwave bestand niet meer wijzigen. Dit houdt in dat je het niet kunt openen en de score veranderen. Dit kun je enkel bij een movie (.dir). Een Shockwave bestand kan niet geopend worden door een browser. Het moet in een HTML document verwerkt zitten. Het HTML document moet bepaalde tags bevatten (
