Dec
21
2012

Gelukkig Nieuwjaar animatie

Het komende jaar leent zich uitstekend voor een gelukkig Nieuwjaar animatie. Niet moeilijk dus wat let je, ga aan de slag met Photoshop. In deze les werk je met het animatie gedeelte van Photoshop, het typ gereedschap, het penseel en laagstijlen. Je kunt voor de achtergrond deze foto nemen maar je kunt natuurlijk ook je eigen foto gebruiken. Voor het vuurwerk heb ik deze brushset genomen. Voor de cijfers gebruik je het Arial font en Black Jack voor de tekst. Het patroon dat ik gebruikt heb voor de cijfers zit standaard in Photoshop CS6 als je een eerdere versie heb kun je de set hier[download id=”38″]  downloaden.

Hieronder zie je wat ik ervan gemaakt heb:

2013-kaart-es

 

Maak een nieuw document aan in Photoshop van 1000 x 750 px met een witte achtergrond. Open de foto die je wilt gaan gebruiken en kopieer de foto in het document. Schaal en schuif de foto totdat je zoiets hebt als hieronder te zien is in het voorbeeld.

vuurwerk 1

 

Typ in vier lagen met het lettertype Arial de cijfers van het jaartal. Grootte 300 pt. Kleur maakt niet uit want je gaat dadelijk de cijfers bedekken met laagstijlen en dan zie je er niets meer van.

vuurwerk 2

Zet de vulling van de lagen van de cijfers op 0% en geef de lagen de volgende laagstijlen:

vuurwerk 3

vuurwerk 4

vuurwerk 5

vuurwerk 6

vuurwerk 7

Zodat je dit effect krijgt:

vuurwerk 8

Tik dan boven in je document met het lettertype Black Jack de tekst.

vuurwerk 9

Zet de vulling van de laag op 0% en voeg dan de volgende laagstijlen toe aan de tekstlaag:

vuurwerk 10

vuurwerk 11

vuurwerk 12

Het ziet er dan zo uit:

vuurwerk 13

Maak nu zeven nieuwe lagen aan onder de tekstlagen en zet in iedere laag een afdruk van een van de vuurwerk brushset brushes. Doe dat naar eigen smaak. Noem de lagen vuurwerk 1 tot en met 7.

vuurwerk 14

Zet nu alle lagen uit behalve de laag van de foto en ga naar het animatie gedeelte in Photoshop. In cs6 kun je dat vinden onder menu VENSTER-TIJDLIJN. Zorg dat je de vertraging op 0 seconden hebt staan.

Zet nu de laag van de 3 aan dupliceer het frame en schuif de 3  in het tweede frame terwijl je de SHIFT toets ingedrukt houdt naar boven tot hij helemaal uit beeld is.  Als je de frames nu een voor een bekijkt heb je in frame 1 alleen de foto in beeld. In frame 2 is het cijfer buiten beeld geschoven en zie je ook alleen de foto en in frame 3 zie je de 3 staan. Dupliceer nu frame 3 en zet in dit frame de laag van de 2 aan. Herhaal de zelfde stappen als je bij de 3 deed bij de 2. Ga zo door tot je alle cijfers gehad hebt.  Je hebt nu in totaal 9 frames.

Ga in het derde frame staan en voeg tussen het derde en het tweede frame 5 frames.

vuurwerk 16

Ga in het 10e frame staan en voeg weer 5 frames tussen. Doe dit ook in het 17e frame en in het 24e frame. Je hebt nu in totaal 29 frames.

Dupliceer het laatste frame en zet een van de vuurwerklagen aan. Herhaal dit totdat je 3 vuurwerklagen aan hebt staan. Dupliceer het laatste frame en zet de laag met de tekst aan. Dupliceer het laatste frame en zet nu de 4e vuurwerklaag aan. Herhaal dit totdat je alle vuurwerklagen aan hebt staan. Je hebt dan 37 lagen in totaal. Dupliceer het frame. Zet in het laatste frame alle lagen behalve de foto laag uit. Voeg vijf frames tussen de twee laatste frames. Zet dan de vertraging van frame 37 op 5 seconden. Zet de vertraging in de laatste 5 frames op 0,5 seconden.

Sla je bestand op als gif file via menu BESTAND-OPSLAAN VOOR WEB

2013-kaart-es

Aanverwante berichten

Jumbojet

42 Reacties +REACTIE GEVEN

  • Hallo, ik heb deze animatie nog eens gemaakt voor 2019, erg leuk om het nog eens te doen.
    Hierbij ook dus de Allerbeste Wensen voor het komende jaar!
    Hartelijke groet, Jos.

  • Hallo Jet, ik wil deze maken voor 2014. Denk je dat het animatiegedeelte het op Facebook doet, volgens mij niet he?
    groeten van Betty

  • Hey hey ,

    Inderdaad was een beetje ongeduldig maar na alles stappen te hebben gedaan is het resultaat hoe het moet zijn.
    In dank je voor alles mooie tutorials en voor de zeer goede uitleg die we krijgen.
    Ook de steun als we eens vastzitten. Daarom mijn beste wensen reeds voor 2013 en dat deze voor jou inspiratievol mag zijn.
    Groetjes Ann

  • Hey hey,

    Heb een vraagje. Bij het animatie gebeuren.
    Alle oogjes uit behalve de foto dan dupliceer ik frame en zet het oogje van 3 aan.
    Dupliceer nog een keer en ga in frame 2 het cijfer drie buiten de canvas plaatsen.
    En als ik dan laat afspelen de 3 frame knippert het inplaats van dat het cijfer naar beneden valt wat doe ik toch verkeerd .

    Groetjes Ann

    • Dat is niet verkeerd.Later voeg je nog frames tussen waardoor je het cijfer ziet vallen.Dus eerst even de rest van de stappen doen en dan zie je pas hoe de animatie eruit ziet.
      grtz,
      JJ

  • Hey hey ,

    Wat doe ik toch verkeerd.
    Ik heb alle oogjes uit behalve de foto. Dan dupliceer ik de 3 en zet oogje aan. Dupliceer weer het frame en ga in het tweede frame de 3 verplaatsen tot buiten de canvas.
    En als ik dan laat afspelen knippert de drie inplaats van naar onder vallen wat is er mis.

    Groetjes.

  • Hij is weer toppie gelukt jet. Ik wens je alvast een goed uiteinde toe en dat we in 2013 maar weer veel mooie dingen mogen maken En bedankt voor al het moois wat je tot nu toe op de site hebt gepubliceerd.

    groetjes John

  • Voor alle photoschoppers hier,een super gelukkig nieuwe jaar,en dat we nog veel mooie dingen mogen maken,een dikke pluim voor ons Jetje dat ons op die manier zoveel bijleert
    Groetjes
    Moke

  • Hallo, Graag had ik geweten hoe je dit juist moet opslaan. Ik werk met photoshop cs6. Het is de bedoeling de animatie door te sturen via email.

    • Hoi Hilde,
      Opslaan als GIF file via menu BESTAND-OPSLAAN VOOR WEB
      grtz,
      JJ

  • Hallo,

    Ik zit terug vast,ik doe alles wat je zo mooi beschrijft,bij het dupliceren van de frames,in het tweede frame(ik wil de 3naar boven schuiven,mat schift ingedrukt),dan komt ervoor kan verplaatsgereedschap niet gebruiken want er zijn geen lagen geselecteerd,terwijl de laag van de 3is geselecteerd,waar moet ik juist de “omhoog schuiven ,op mijn document of in de frame,ik heb al alles gebrobeerd en niets lukt,mijn ciifers komen niet van boven naar benedengevallen,en moeten de frames altijd op 0 blijven staanik werk in photoschop 5
    ik slaap er niet van doordat het niet wil lukken
    groetjes
    moke

    • Klik in het 2e frame. Ga dan naar de laag van de 3 en zorg dat je in de laag staat. Activeer je verplaatsen gereedschap en je kunt schuiven

      • het is mij gelukt,en hartelijk bedankt voor de superbegeleiding dat we -van jou mogen ontvangen,wens je hierbij een een gezond en super gelukkig 2013
        bedankt

  • beste waensen voor 2013.
    ok heb in feite een algemene vraag:Mag men twee versies ven photoshop op de computer zetten,of gaan die dan vechten met elkaar,of niet goed werken?

  • Hey hey,

    inverband lettertype is opgelost heb het gevonden.
    En nu weer verder groetjes

    Ann

  • Hey hey,

    Alvast aan iedereen die deze gewedige site ook heeft ondekt een zalige kerst.
    En aan de maker ervan gewoon verder doen gewoon geweldig.!!!!
    Maar heb toch even een vraagje mijn tekst black jack geeft geen kleine letter i
    ziet er heel anders uit en kan ook niets veranderen blijft op regular.
    Allé groetjes

    Ann

    • Hi Ann, voor jou ook zo!
      Wat het font betreft. Kijk eens in je teken venster. Daar staan de instellingen in en kun je wijzigingen aanbrengen. Black Jack heeft zowel grote als kleine letters. Kijk anders even bij de basis les over het typ gereedschap en het teken venster.
      Grtz, JJ

  • Ik heb hier al heel wat bijgeleerd, en leer nog steeds bij, prettige feestdagen Jetje en vooral een goede gezondheid. Bedankt voor al het werk wat je voor ons doet. Groetjes, Tonio

  • ik heb het al meerdere keren gezegd, je maakt zeer mooie dingen, die begrijpelijk zijn uitgelegd voor iedereen
    ik ben op zoek naar foto omzetten naar tekening (zwart/wit of gekleurde) of schilderij (olie of waterverf), ik heb Uw voorbeelden al na gemaakt, en het resultaat viel best mee
    maar nu zag ik toevallig Topaz simplify, heb je dat al eens gebruikt, heb je daar ervaringen mee, voor ik het koop zou ik graag bevestiging krijgen van iemand als U die zeer veel afweet van photoshop
    alvast bedankt

    • Hoi Gilberto,
      Bedankt voor het copliment 🙂
      Ik heb geen ervaring met Topaz SImplify dus daar kan ik je weinig over vertellen. Ik hou er meer van om zelf in details te werken met mijn pen tablet. Dat kost wel tijd maar dan kan ik het precies zo maken als ik het wil hebben.
      Grtz,
      JJ

  • voor iedereen…

    HEEL FIJNE FEESTDAGEN EN VOORAL IN GOEDE GEZONDHEID!

    gewenst door Jos.

  • Hartelijk bedankt

  • Hallo,

    Hier ben ik nogmaals,voor die animatie ik begrijp wel hoe je die frames moet dupliceren,maar je spreekt van die 3 naar boven schuiven,ik heb dat gedaan maar als ik die animatie laat afspelen komen mijn cijfers niet van boven,ze bewegen alleen maar bedoel je de frame naar boven schuiven,of de cijfer op mijn document of de laag,maar heb het allemaal al gebrobeerd,het lukt niet, sorry hoor
    groetjes en hélé fijne feestdagen

    • Hoi,
      Je gaat in het frame staan. Dan ga je in de laag van de 3 staan en schuif je met je verplaatsen gereedschap de 3 recht naar boven net zolang tot hij uit beeld is. Je ziet dan de 3 niet meer in beeld maar hij is er nog wel buiten je canvas. In het 2e frame is de 3 dus uit beeld en in het 3e frane weer in beeld.
      Grtz,
      JJ

  • Hallo,Ik zit ook vast bij die patroon,zie hier dat ik moet “patroon herstellen” doen,heb ik gedaan maar die fijne korrel zit er niet tussen,trouwens ik heb er maar twee die er totaal niets van hebben van fijne korrel,wat raad jij mij aan??
    ben trouwens al gaan zoekenom te downloaden,zonder resultaat
    Groetjes

    • Standaard set van cs6 heeft het patroon grijskorrel in de standaardset staan. In eerdere versies staat dat er helaas nog niet bij. Ik zal het patronenset in de les bijvoegen dan kun je het downloaden en installeren.
      Grtz,
      JJ

  • Hoi JJ,

    Wat Anja schrijft is waar, dat komt waarschijnlijk omdat het voor jou zo gesneden koek is JJ.
    Tot mijn verbazing zie ik dat de standaard patronen er bij mij niet inzitten
    Wat kan ik het beste doen?
    Enne FIJNE FEESTDAGEN!!

    • Herstellen naar de standaard patronen en dan moeten er standaard patronen in staan.

  • zooooo… leuk… en gelukt, de uitleg van de animatie was wel een nadenkertje maar daar leer je juist van… lezen… lezen en regelmatig opslaan en herhalen… bedankt Jetje!

  • hoi jj,
    bedankt voor je reactie, ik laat je even het punt zien waar ik ook niet wijs uit word,
    tjonge, het zit me niet direct mee vandaag pfffff zeg.

    [IMG]http://i48.tinypic.com/2hhdo51.jpg[/IMG]

    ik weet n.m niet hoe ik aan dat 3e frame kom van de letter 3
    mss heb ik deze les klaar nog net voor de feestdagen ha..
    gr.Jos alvast weer bedankt.

    • Je hebt in het eerste frame alle lagen uit staan behalve de foto laag. Je dupliceert het frame en zet in het tweede frame de laag van de 3 aan. Je dupliceert het frame van de 3 en gaat in het tweede frame staan. Daar sleep je de 3 naar boven totdat hij buiten beeld is. Dupliceren doe je door op het dupliceren icoontje te klikken dat lijkt op het nieuwe laag icoontje.
      grtz,
      JJ

    • hoi hoi jj,

      zover was ik al, in het 2e frame de letter 3 uit beeld…
      vervolgens lees ik..in frame 3 zie je de letter 3 weer..
      maar ik heb dan nog steeds alleen die 2 eerste frames..
      in frame 3 moet ik de letter zien staan..zo lees ik dat dus…
      moet frame 2 dan ook gedupliceerd? anders weet ik niet aan dat 3e frame te komen..
      om die letter 3 te zien,
      de laatste keer dat ik je lastig val, beloofd!!!
      gr.Jos.

      • Jos je dupliceert het eerste frame waar alles uit staat behalve de foto. Dan zet je in het tweede frame de laag van de 3 aan. Je dupliceert het tweede frame waar de 3 aan staat. Je gaat naar het 2e frame en sleept de 3 omhoog.

  • hoi jj,

    ik zit vast bij het punt…een nieuwe horizontale tijdlijn aanmaken,
    en deze precies onder de cijfers schuiven…
    heb ik nog nooit gedaan dus, en heb daar geen notie van,
    ik maak deze overigens ontzettende mooie les in photoshop 5
    als je heel veel tijd over hebt en wilt..
    laat mij dan s.v.p een fotootje zien waar ik die tijdlijn kan vinden en op de plaats schuiven..
    ik zou deze les heel graag afmaken.
    b.v mijn dank.

    • Hoi Jos,
      Dat zinnetje over die horizontale tijdlijn berust op een foutje en is er uitgehaald nu.
      Als je de les in CS5 maakt neem je voor de animatie gewoon het vertrouwde dubbele pijltje boven in de opties balk en kies je voor beweging.
      Grtz,
      JJ

  • Ben ik weer Letter type Ariel 300 punt Bij mij erg groot.
    Bedankt Nelly

    • Hoi Nelly,
      Heb je een document van 1000 x 750? Bij mij is in ieder geval de grootte 300pt. Als het bij jou anders uitvalt kun je kijken wat voor jou document een mooie grootte is.
      grtz,
      JJ

  • Mooie les maar ik begrijp niet goed waarom ik met een witte achtergrond moet beginnen.
    Gr Nelly

    • Je kunt beginnen met wat je wilt hoor maar ik begin altijd met een witte achtergrond.
      grtz,
      JJ

Reageer

Archief

Categorie