Jack in the box

De lege doos van mijn nieuwe dekbed en mijn kleine vriendje brachten me op het idee om deze geanimeerde verjaardagskaart te maken. Ik nam een hele serie foto’s terwijl mijn kleine vriendje, zoals altijd, weer fantastisch poseerde en ging aan de slag. In Google Sketchup, het gratis 3D tekenprogramma van Google, zocht ik in de 3D bibliotheek een kado doos. Ik vond een hele mooi en exporteerde deze als JPG bestand waardoor ik hem in Photoshop kon gebruiken. Zo eenvoudig  kan 3D dus zijn 🙂

OK, aan de slag!

We beginnen met de achtergrond. Open een nieuw document in Photoshop van 800 x 600 px. Dubbelklik op de achtergrondlaag zodat deze ontgrendeld wordt en vul de achtergrond met kleur #f9e8cc. Geef de laag een patroonbedekking door op het laagstijlicoontje onder aan in je lagenpalet te klikken en te kiezen voor een van deze ruitjes  patronen te nemen. Als je niet weet hoe je een patroon in Photoshop zet kun je dat hier lezen.

Neem je rechthoekige selectiekader en selecteer een rechthoekig gedeelte zoals hieronder te zien is. Maak een nieuwe laag aan en vul deze met wit.

Geef de laag de volgende laagstijlen:

Selecteer de aangepaste vorm neem doel 2, deze zit standaard in Photoshop. Maak een nieuwe laag aan en zet boven in de opties balk de modus vullen met pixels aan. De kleur maakt niet uit want je gaat de vorm bedekken met een kleurbedekking.

Trek de vorm over je canvas zoals hieronder te zien is in het voorbeeld. Selecteer een rechthoekig gebied en ga naar menu SELECTEREN-SELECTIE OMKEREN en delete de selectie in de laag van het doel. Geef de laag van het doel een kleurbedekking met kleur NB: Kleur # fba8d1

Selecteer een rechthoek om de vorm van het doel en maak een nieuwe laag aan. Vul de laag met wit en zet de vulling van de laag van de laag op 0%.

Ik heb de laag bedekt met een  klukeart_stars (1) patroonset en een omlijning in kleur #fcba4e

Open dit plaatje en kopieer het in je document. Roteer het met je vrije transformatie (CTRL+T) en vervorm het met menu BEWERKEN-TRANSFORMATIE-VERVORMEN. Vervaag de rand totdat het zo uit ziet als in het plaatje.

Voeg aan de laag een kleurbedekking toe met kleur # f51b87 toe:

Geef ook een patroonbedekking met hetzelfde patroon als je zojuist gebruikte maar stel de schaal op 38% en de modus op kleurbedekking. Selecteer alle lagen en groepeer ze in menu LAAG-LAGEN GROEPEREN en noem de groep achtergrond:

Download de kado doos, hij is al in JPG formaat dus je kunt hem in Photoshop openen.

Maak de afbeelding vrij uit zijn achtergrond met je pen of je veelhoeklasso. Weet je niet hoe dat moet kijk dan hier. Sleep of kopieer de doos in je document en schuif hem met je verplaatsen gereedschap op zijn plek. Noem de laag kadodoos. Maak een nieuwe laag aan  en selecteer de voorkant van de doos. Vul de laag met een kleur naar keuze, het maakt voor het effect niet uit. Noem de laag voorkant. Zet de vulling van de laag op 0% boven in je lagenpalet. Maak een nieuwe laag aan en noem deze linkerkant en herhaal deze stappen op de nieuwe laag. Maak nog een nieuwe laag aan en noem deze deksel. Stel de voorgrondkleur in op kleur # f1a001 en verf met je penseel de deksel zoals te zien is op het plaatje. Zet de modus van de deksel laag op vermenigvuldigen.

Geef de deksel laag een kleurbedekking met kleur # fbed06:

De linkerkant een patroonbedekking met een van de klukeart patronen:

De voorkant bedek je met hetzelfde patroon:

Daarna geef  je de laag van de kadodoos  een slagschaduw:

Selecteer alle lagen en groepeer ze. Noem de groep hele kado doos:

Kopieer de groep en noem de groep hele kado doos rechts. Schuif de groep met je pijltjes toets 5 px naar rechts. Kopieer de hele kado doos groep nog een keer en noem de groep hele kado doos links. Schuif deze groep 5 px naar links.

Kopieer de groep van de hele kado doos nog een keer en noem deze kado doos open. Verwijder alle lagen behalve van de kado doos. Haal bij de laag van de kado doos de gedeelten die buiten de kubusvorm uitsteken weg. Maak een selectie met je pen of veelhoeklasso van de voorkant en vul deze in een nieuwe laag die je voorkant noemt met wit. Selecteer de linkerkant van de doos en vul de selectie in een nieuwe laag die je linkerkant noemt met een lichtgrijze kleur. Selecteer dan de bovenkant van de doos en vul de selectie met een donkere kleur grijs  in een  nieuwe laag die je bovenkant noemt. Trek in de laag van de bovenkant een zwarte streep met je potlood en geef de laag van de bovenkant een omlijning met zwart van 1px aan de buitenzijde.

Geef de voorkant dezelfde lijn en een patroon bedekking:

En de linkerzijde omlijn je ook op deze manier en geef je een patroonbedekking volgens met deze instellingen:

Teken met je pen een lint aan de voorkant en vul dat met rood #dd0000 in een nieuwe laag die je lint voor noemt. Maak nog een lint voor de rechterkant en ook eentje voor links. Geef de linten wat accenten. Het lint aan de voorzijde en aan de rechterzijde heb ik schuine kant en reliëf gegeven en een omlijning:

Geef het lint aan de voorzijde een schaduw door een selectie te maken en deze te vullen met zwart in een nieuwe laag onder de laag van het lint. Vervaag deze laag met 5px
via menu FILTER-VERVAGEN GAUSSIAANS  zet de dekking van de laag op 12%. Maak een nieuwe laag aan boven de laag van het lint aan de rechterzijde en breng daar wat accenten in aan met een zwak afgesteld ( 5 a 10 % dekking en 0% hardheid) zwart zacht rond penseel  zodat je een schaduweffect krijgt op het lint.

Open foto 1 en snijdt de foto uit.

Schuif de foto boven de groep kado doos open selecteer de pixels van de laag en maak een laag aan onder de laag van de foto. Vul met zwart en vervaag op dezelfde manier als bij het lint aan de voorzijde en zet de dekking op 25%. Groepeer de foto laag en de schaduwlaag en noem de groep foto 1:

Maak een nieuwe laag aan en maak met je pen een vorm zoals hieronder aangegeven vul de vorm in de nieuwe laag met wit. Selecteer met je pen een rechthoek aan de linkerzijde en vul deze in de laag met grijs. Selecteer een vierkant gedeelte aan de bovenzijde en vul dit met een lichtere kleur grijs:

Selecteer de pixels van de laag en maak een nieuwe laag aan. Vul de nieuwe laag met# f1a001 en zet de modus van de laag op vermenigvuldigen.

Omlijn de onderste laag van de deksel en geef een slagschaduw:

Maak een schaduw van de laag zoals je ook bij foto 1 deed en groepeer de 3 lagen. Noem de groep deksel.

Kopieer de groep en noem hem deksel 2. Roteer de groep met je transformatiegereedschap (CTRL +T)en verschuif  hem  een stukje:

Groepeer de groepen van de twee deksels, foto 1 en de open kadodoos. Noem de groep doos open + deksel.

Kopieer de groep en zet de lagen van de linten uit en foto 1 uit. Noem de groep linten plat. Schuif de deksel verder naar beneden en roteer nog een beetje. Snijdt dan foto 2 uit en schuif die op zijn plaats.

Geef weer een schaduw zoals je bij foto 1 deed.  Groepeer de twee lagen van foto 2 en noem de groep foto 2. Maak nieuwe linten met je pen en accentueer deze weer met slagschaduw, schuine kant en reliëf en lijn. Geef waar nodig een schaduw zoals je al eerder deed of geef accenten met een zwak, zacht rond zwart penseel. Probeer wat uit totdat je tevreden bent.

Zet de groep van foto 2 uit.

Snijdt foto 3 uit en behandel deze hetzelfde als foto 2 en 1. Maak van de foto en de schaduw een groep en noem de groep foto 3.

Voor de tekst heb ik het font  Curlz   en Ravie gebruikt. Typ je tekst in verschillende lagen. Voor de pootafdruk gebruik je een van de vormen van de set dieren die standaard in Photoshop zitten.

Geef de tekst en de vorm de volgende laagstijlen:

NB: kleur #861f04

NB: ik heb  kleur #d30000 en kleur #a40a56 gebbruikt

Groepeer de tekst en de vorm laag en noem de groep tekst. Zet alle groepen uit behalve de achtergrond en ga naar het video gedeelte van Photoshop. De pret kan beginnen 🙂

Zet de groep hele kado doos aan in het eerste frame. Zet de vertraging van het frame op 0,5 sec.

Dupliceer het frame door op het icoontje te klikken en zet de tekstgroep aan zet alle tekst uit behalve de eerste tekstlaag aan. Geef het frame een vertraging van 3 seconden.

Dupliceer elke keer het voorafgaande frame en stel dan zo in:

Frame 3 en zet de vertraging op 0,2 seconde.

Frame 4 zet de hele kadodoos groep uit en de tekstgroep uit. Zet hele kado doos links aan en geef geen vertraging.

Frame 5 zet je hele kado doos rechts aan en geef je weer geen vertraging.

Frame 6 weer kadodoos links aan zonder vertraging.

Frame 7 kadodoos rechts en tweede tekstlaag aan zonder vertraging

Frame 8 kadodoos links en tweede tekstlaag aan zonder vertraging

Frame 9 kadodoos rechts en tweede tekstlaag aan zonder vertraging

Frame 10 kadodoos links en tweede tekstlaag aan zonder vertraging

Frame 11 kadodoos rechts en tweede tekstlaag aan zonder vertraging

Frame 12 kadodoos links en tweede tekslaag aan zonder vertraging

Frame 13 kadodoos recht en tweede tekstlaag aan zonder vertraging

Frame 14 kadodoos links en tweede tekstlaag aan zonder vertraging

Frame 15 kadodoos open +deksel + foto 1 tweede tekstlaag aan zonder vertraging

Frame 16 in plaats van deksel zet je deksel 2 aan de rest hetzelfde als 15

Frame 17 foto 1, linten plat, tekst uit, vertraging 1 sec

Frame 18 foto 2, linten plat, derde tekstlaag, vertraging 4 sec

Frame 19 zelfde als frame 18 alleen tekstlaag uit, vertraging 0,2

Frame 20 zelfde als 20 + vierde tekstlaag aan, vertraging 2 sec

Frame 21 foto 3, linten plat, vierde tekstlaag, vertraging 2sec

Frame 22, zelfde als frame 21 + vijfde tekstlaag, vertraging 0,5 sec

Frame 23 zelfde als frame 22 + zesde tekstlaag, vertraging o,5

Frame 24 zelfde als frame 22 + vormlaag, vertraging 5 sec

De animatie is af!

Als je tevreden bent met het resultaat sla je je animatie op als gif file:

Veel plezier van je geanimeerde verjaardagskaart!