Deze rubriek is geschreven door Froodooo & -Matthijs-!

Vandaag gaan we weer een simpele animatie in Imageready maken:



We beginnen –uiteraard- met het maken van een nieuw bestand. Wij kiezen voor de grootte 500 px x 130 px. Selecteer achtereenvolgens de Gradient Tool en zoek twee donkere kleuren uit. Wij hebben gekozen voor zwart (#000000) en donkergrijs (#262626). Met de Gradient Tool geselecteerd trek je vervolgens van boven naar onderen een lijn op de background layer.

Op de animatie zie je dat de letters in een razend tempo van groot naar kleiner verspringen. Dit effect kun je creëren door verschillende groottes van letters achter elkaar te zetten. Selecteer je Text Tool en plaats aan de linkerkant, op grootte 90 en in een oranje kleur, de letter ‘G’. Doe hetzelfde voor ‘T’, ‘A’ en ‘4’. Nu heb je dus 4 verschillende layers; elke layer voor één letter. Om straks het overzicht te houden, geven we elke layer een aparte naam. Klik met je rechtermuisknop op de layer ‘G’ en kies voor ‘Layer Propeties’. Geef deze layer vervolgens de naam ‘G 90’. 90 staat in dit geval dus voor de grootte van de letter. Doe vervolgens exact hetzelfde voor elke andere layer, dat zijn dus de layers ‘T’, ‘A’ en ‘4’.

We gaan dan enkele Blending Options aan de letters toevoegen voor net dat beetje extra. Klik met je rechtermuisknop op de layer ‘G 90’ en ga naar ‘Blending Options’. Stel dan de instellingen als volgt in:

Drop Shadow:



Bevel and Emboss:



Gradient Overlay:



Om extra werk te besparen, slaan we deze style op. Dit kun je doen via de volgende knop:



Alle instellingen die we net gemaakt hebben worden als één style opgeslagen, zodat we ze met een druk op de knop op elke layer kunnen toepassen. Selecteer de layers ‘T’, ‘A’ en ‘4’ (hou CTRL vast!) en ga naar Windows > Style. Kies vervolgens de net gemaakte stijl, en alle geselecteerde layers worden voorzien van de betreffende style. Makkelijker kan het haast niet, wel?

Vervolgens duplicate je elke '90' text layer één keer. De geduplicieerde layers vergroot je dan met de Tekst Tool van 90 naar 105 en met de Move Tool zet je ze voor de andere letter. Op de volgende manier:



Elke gedupliceerde geven we wederom een nieuwe naam. Geef de layers de volgende namen:

[table=simple]

Oud:||Nieuw:|

G 90 copy |>>|G 105

T 90 copy |>>|T 105

A 90 copy |>>|A 105

4 90 copy |>>|4 105

[/table]

We gaan dan exact dezelfde stap herhalen. Deze keer duplicaten we alle '105' layers. We vergroten de tekst van deze layers dan naar 120 met de Tekst Tool en met de Move Tool zet je ze als volgt neer:



We veranderen dan wederom de namen van de layers:

[table=simple]

Oud:||Nieuw:|

G 105 copy |>>|G 120

T 105 copy |>>|T 120

A 105 copy |>>|A 120

4 105 copy |>>|4 120

[/table]

Dan rest ons enkel nog de glow die verschijnt als de letter op zijn plaats terechtkomt. Duplicate alle '90' layers en ga middels een rechtermuisknop op de layer naar de Blending Options. Zoals je ziet zijn deze al ingesteld, maar we gaan ze nog veranderen. Deactiveer elke style door ze uit te vinken en stel de nieuwe in:

Outer Glow:



Color Overlay:



We hebben bijna het Photoshop gedeelte afgesloten, we moeten enkel nog de layers van een nieuwe naam voorzien. Geef de layers de volgende naam:

[table=simple]

Oud:||Nieuw:|

G 90 copy |>>|G glow

T 90 copy |>>|T glow

A 90 copy |>>|A glow

4 90 copy |>>|4 glow

[/table]

Met de sneltoets 'CTRL' + 'SHIFT' + 'M' switchen we dan (met het bestand) naar Imageready. We hebben het layerscherm en het animationscherm nodig, dus zorg ervoor dat je deze aan hebt staan. Mochten ze er niet staan, stel ze dan in via 'Windows'.

Op je layerscherm zie je dat alle layers geselecteerd zijn. Vink alle layers uit door op het oogje te klikken, met uitzondering van de layer 'G 120' (de eerste letter). Maak dan een nieuw frame via de volgende knop:



Op dat frame vink je de layer 'G 120' uit en de layer 'G 105' aan. Vervolgens maak je weer een nieuw frame, zet je de layer 'G 105' uit en de layer 'G 90' aan. Je maakt dan wederom een nieuw frame, je vinkt 'G 90' uit en 'G glow' aan. Tot slot maak je wéér een nieuw frame, vink je 'G glow' uit en 'G 90' weer aan. Laat hem dan afspelen via de volgende knop:



Als het goed is, moet dat er zo uit zien:



Nu ga je voor elke letter hetzelfde doen. Daar waar in de uitleg dus steeds 'G' stond, kun je vervangen voor ‘T’, ‘A’ en ‘4’. Let er wel op dat het laatste frame per letter steeds moet blijven staan! Als alles goed verlopen is, heb je een mooie bewegende animatie. De laatste stap is het vertragen van de animatie. Klik op frame 1, houd SHIFT ingedrukt en klik op het laatste frame. Zoals je ziet, worden alle tussenliggende frames geselecteerd. Standaard heeft elk frame een 'delay time' van '0 sec'. Deze gaan we veranderen naar '0.05 sec'. Dit kun je doen door op '0 sec' te klikken en vervolgens de nieuwe waarde in te klikken. Het laatste frame moet een delay time van '1 sec' hebben, zodat de volledige tekst één seconde blijft staan.

Wanneer je volledig klaar bent, sla je het bestand op via 'File' > 'Save optimized As'.

We hopen je vandaag weer iets nieuws geleerd te hebben binnen Photoshop en Imageready. Mocht je toch nog vragen hebben over dit lesje, stel ze dan gerust!