Icons, smiles en headers klaar terwijl u wacht, #74!

quote:

Op zaterdag 26 december 2009 11:18 schreef FL_Freak het volgende:

[..]

SUPER BEDANKT!

EDIT: Ik vraag me wel af welk programma je hebt gebruikt? Ik wil in de toekomst dit ook wel kunnen!

Alles in Adobe Creative Suite 4.0 en dan het Photoshop gedeelte. Daarin zit een animation tool. In feite pas je dan eerst het formaat van elk plaatje aan zodat het er goed uitziet op 60x60. Meestal verliest het plaatje bij verkleinen wat scherpte en moet je deze wat opvijzelen.

Daarna heb ik met een zwarte gradient in stervorm een nieuwe laag gemaakt zodat de overgang niet zo plots en schokkerig is. Daarna moet je frame by frame animeren. Stap 1. Ik neem één plaatje, die laat ik anderhalve seconde staan ofzo. Stap 2. die dupliceer ik en daar gooi ik die zwarte stergradient overheen, die blijft maar 0.2 seconden actief, vervolgens komt het volgende plaatje in herhaal ik stap 1 en 2. In plaats van een zwarte stergradient kun je natuurlijk ook andere creatieve overgangen bedenken. Bijvoorbeeld dat het ene plaatje een transparantie van 50% heeft en je het plaatje daaronder ook ziet. Ikzelf maak graag gebruik van de motion blur.

Tenslotte moet je dan aan de kleuren werken om de grootte van het bestand onder 10 KB te houden (of welke limiet dan ook), dit betekend dat je van rood bijvoorbeeld maar 4 kleuren hebt en dat kan nogal een raar rood vlak of een korrelig resultaat geven. Het is of het aantal kleuren omlaag of het aantal frames inkorten.

Meestal kan een webicoon bestaan uit zo'n 40-80 frames en onder de 100 KB blijven. Ligt eraan hoeveel kleuren er in het origineel worden gebruikt. Heb ik bijvoorbeeld op een stuk witte achtergrond alleen iets met een zwart penseel getekend, dan heb ik in feite maar een paar zwart en grijstinten nodig. Ik stel de restrictie dan tot 8 kleuren en opeens kun je wel 100 frames gebruiken. Het helpt als je plaatje uit veel dezelfde kleuren bestaat en er niet zoveel variatie is. En als je dan toch de kwaliteit hoog wil houden moet je in het aantal frames knippen. Denk er wel om, als je het aantal frames halveert moet je de overgebleven frames twee keer zo lang in beeld laten staan. De boel wordt hierdoor schokkerig en minder vloeiend.

Voor de YouTube filmpjes gebruikt ik Jasc Animation Shop 3 (tevens een goeie is Ulead GIF Animator 5). Met een plug-in voor Firefox kun je de video's downloaden. Als FLV, 3GP, MP4 of alleen audio MP3. Je kiest dan voor de eerste optie. Vervolgens gebruikt ik Pazera's FLVtoAVI converter. Let op! Zet de instelling naar .MPG formaat en dan de kleinste resolutie, de audiotrack heb je uiteraard niet nodig en convert. Dit moet je namelijk doen omdat Jasc Animation Shop alleen .mpeg video kan inlezen. Hij stelt alle frames netjes achter elkaar. Filmpjes zijn vaak met 24 (of 30) frames per seconde. Dus elke minuut zijn al 1440 frames! Gok een beetje op het bereik van wat je nodig hebt. Zit er op 2:14 een stukje van vijf seconden die je wilt hebben, dan heb je niets aan de eerste 1400 frames. Het inladen van de frames duurt namelijk eventjes.

Uiteindelijk bestaat een stukje van 5 seconden dus uit 120 frames. En aangezien het waarschijnlijk niet gaat om twee kleuren, moet je snijden in het aantal frames. Daar is een handige tool voor 'cull animation'. Hiermee kun je om de frame, of om de 2,3, etc frames een frame laten weghalen. Vergeet ook niet te croppen. Selecteer een vierkant in de volle hoogte van het frame. Hierdoor valt wel een stuk zijkant, of twee stukjes zijkant (links en rechts van het vierkant) weg. Hierdoor blijft echter wel het aspect ratio behouden en gaat het plaatje er niet vervormd uitzien als je hem naar 60x60 maakt. Dit moet je namelijk ook doen. Dat is de FOK! avatar grootte. Bovendien verklein je daarmee de filesize. Nu is 'ie 60x60 en heb je wat geknipt in de frames (vergeet ook niet dat bij elk weggenomen frame het andere frame langer moet blijven staan), tijd om op te slaan. Als .gif uiteraard. Je krijgt een optimization wizzard. Hierbij kun je het aantal kleuren/kwaliteit instellen. In het volgende venster krijg je dan te zien hoe het eruit komt te zien en hoeveel KB 'ie in beslag zal nemen. Vaak zul je nog terugmoeten naar je project om nog wat te sleutelen en te knippen in de frames. Maar uiteindelijk kom je er wel uit en is 'ie klaar!

quote:

Op zaterdag 26 december 2009 14:43 schreef shiznuts het volgende:

[..]

Alles in Adobe Creative Suite 4.0 en dan het Photoshop gedeelte. Daarin zit een animation tool. In feite pas je dan eerst het formaat van elk plaatje aan zodat het er goed uitziet op 60x60. Meestal verliest het plaatje bij verkleinen wat scherpte en moet je deze wat opvijzelen.

Daarna heb ik met een zwarte gradient in stervorm een nieuwe laag gemaakt zodat de overgang niet zo plots en schokkerig is. Daarna moet je frame by frame animeren. Stap 1. Ik neem één plaatje, die laat ik anderhalve seconde staan ofzo. Stap 2. die dupliceer ik en daar gooi ik die zwarte stergradient overheen, die blijft maar 0.2 seconden actief, vervolgens komt het volgende plaatje in herhaal ik stap 1 en 2. In plaats van een zwarte stergradient kun je natuurlijk ook andere creatieve overgangen bedenken. Bijvoorbeeld dat het ene plaatje een transparantie van 50% heeft en je het plaatje daaronder ook ziet. Ikzelf maak graag gebruik van de motion blur.

Tenslotte moet je dan aan de kleuren werken om de grootte van het bestand onder 10 KB te houden (of welke limiet dan ook), dit betekend dat je van rood bijvoorbeeld maar 4 kleuren hebt en dat kan nogal een raar rood vlak of een korrelig resultaat geven. Het is of het aantal kleuren omlaag of het aantal frames inkorten.

Meestal kan een webicoon bestaan uit zo'n 40-80 frames en onder de 100 KB blijven. Ligt eraan hoeveel kleuren er in het origineel worden gebruikt. Heb ik bijvoorbeeld op een stuk witte achtergrond alleen iets met een zwart penseel getekend, dan heb ik in feite maar een paar zwart en grijstinten nodig. Ik stel de restrictie dan tot 8 kleuren en opeens kun je wel 100 frames gebruiken. Het helpt als je plaatje uit veel dezelfde kleuren bestaat en er niet zoveel variatie is. En als je dan toch de kwaliteit hoog wil houden moet je in het aantal frames knippen. Denk er wel om, als je het aantal frames halveert moet je de overgebleven frames twee keer zo lang in beeld laten staan. De boel wordt hierdoor schokkerig en minder vloeiend.

Voor de YouTube filmpjes gebruikt ik Jasc Animation Shop 3 (tevens een goeie is Ulead GIF Animator 5). Met een plug-in voor Firefox kun je de video's downloaden. Als FLV, 3GP, MP4 of alleen audio MP3. Je kiest dan voor de eerste optie. Vervolgens gebruikt ik Pazera's FLVtoAVI converter. Let op! Zet de instelling naar .MPG formaat en dan de kleinste resolutie, de audiotrack heb je uiteraard niet nodig en convert. Dit moet je namelijk doen omdat Jasc Animation Shop alleen .mpeg video kan inlezen. Hij stelt alle frames netjes achter elkaar. Filmpjes zijn vaak met 24 (of 30) frames per seconde. Dus elke minuut zijn al 1440 frames! Gok een beetje op het bereik van wat je nodig hebt. Zit er op 2:14 een stukje van vijf seconden die je wilt hebben, dan heb je niets aan de eerste 1400 frames. Het inladen van de frames duurt namelijk eventjes.

Uiteindelijk bestaat een stukje van 5 seconden dus uit 120 frames. En aangezien het waarschijnlijk niet gaat om twee kleuren, moet je snijden in het aantal frames. Daar is een handige tool voor 'cull animation'. Hiermee kun je om de frame, of om de 2,3, etc frames een frame laten weghalen. Vergeet ook niet te croppen. Selecteer een vierkant in de volle hoogte van het frame. Hierdoor valt wel een stuk zijkant, of twee stukjes zijkant (links en rechts van het vierkant) weg. Hierdoor blijft echter wel het aspect ratio behouden en gaat het plaatje er niet vervormd uitzien als je hem naar 60x60 maakt. Dit moet je namelijk ook doen. Dat is de FOK! avatar grootte. Bovendien verklein je daarmee de filesize. Nu is 'ie 60x60 en heb je wat geknipt in de frames (vergeet ook niet dat bij elk weggenomen frame het andere frame langer moet blijven staan), tijd om op te slaan. Als .gif uiteraard. Je krijgt een optimization wizzard. Hierbij kun je het aantal kleuren/kwaliteit instellen. In het volgende venster krijg je dan te zien hoe het eruit komt te zien en hoeveel KB 'ie in beslag zal nemen. Vaak zul je nog terugmoeten naar je project om nog wat te sleutelen en te knippen in de frames. Maar uiteindelijk kom je er wel uit en is 'ie klaar!

Dat je dat allemaal voor me gedaan hebt

Ik sta versteld wat jullie allemaal ontwerpen, in een woord geniaal!
Zelf moet ik ook eens even rondkijken naar een avatar. Maar kan maar niks vinden

[ Bericht 22% gewijzigd door CMS op 27-12-2009 18:18:39 ]

quote:

Op zondag 27 december 2009 01:44 schreef FL_Freak het volgende:

[..]

Dat je dat allemaal voor me gedaan hebt

Veel vallen en opstaan is het vooral. In mijn geval 7 jaar daarvan. Wat pointers zijn natuurlijk altijd handig.

quote:

Op zondag 27 december 2009 16:55 schreef CMS het volgende:
Ik sta versteld wat jullie allemaal ontwerpen, in een woord geniaal!
Zelf moet ik ook eens even rondkijken naar een avatar. Maar kan maar niks vinden

Als je er uit bent geef je maar een brul.

zou iemand deze drie in fok formaat kunnen toveren? bij voorbaat dank

quote:

Op maandag 28 december 2009 15:04 schreef Slayage het volgende:
zou iemand deze drie in fok formaat kunnen toveren? bij voorbaat dank

[ afbeelding ]

[ afbeelding ]

[ afbeelding ]

Wil je de drie plaatjes meteen in één plaatje? (Slideshow)
Of alleen elk plaatje apart naar 60x60 verkleinen en klaar?

quote:

Op maandag 28 december 2009 15:10 schreef shiznuts het volgende:

[..]

Wil je de drie plaatjes meteen in één plaatje? (Slideshow)
Of alleen elk plaatje apart naar 60x60 verkleinen en klaar?

dat laatste

coole ava trouwens

Murci... bij deze dan:
, en

hoeft niet meer trouwens, iemand anders heeft het al gedaan zonder dat ik erom vroeg

quote:

Op maandag 28 december 2009 15:36 schreef shiznuts het volgende:
Murci... bij deze dan:
[ afbeelding ] , [ afbeelding ] en [ afbeelding ]

thanks!

Is het mogelijk om van mijn avatar een uploadicon te maken, dus onder 10 kb?

quote:

Op maandag 28 december 2009 15:38 schreef MissBliss het volgende:
Is het mogelijk om van mijn avatar een uploadicon te maken, dus onder 10 kb?
[ afbeelding ]

Heb je dat lange verhaal van me hierboven gelezen?

Nou, om dat samen te vatten. Kleuren bepalen in voor het grootste gedeelte de filesize (KB) van een animatie/plaatje. Hoe meer kleuren je wil, des te minder frames (unieke beelden) kun je hebben, wanneer je gelimiteerd bent. Bij jouw kleurrijke avatar wordt dat al gauw een probleem. Met 10 KB kun je van geluk spreken als je 10 frames kunt gebruiken. In die tijd kun je van één naar een andere kleur soepel laten overlopen, maar dan houdt het op. Of je moet zeggen, doe dan maar de kwaliteit omlaag. Maar dan krijg je dus dit:

quote:

Op maandag 28 december 2009 15:38 schreef MissBliss het volgende:
Is het mogelijk om van mijn avatar een uploadicon te maken, dus onder 10 kb?
[ afbeelding ]

Het wordt er niet mooier van



[edit]wat shiznuts zegt dus [/edit]

Als je de frames inkort ipv de kleuren.

Ook dit zou eventueel nog kunnen...

Maar meer dan dat zit er niet in.

Hier een aanvraagje

Ik zou graag een plaatje willen waarop een vlieg van links naar rechts rustig vliegt. waarna hij als hij in 't midden van de avatar is door een vliegenmepper tegen het icoontje wordt geslagen van achter dus. waarna de vlieg afdruipt naar benenden (cartoon style)

Succes & Bedankt

Ik had het verhaal niet gelezen nee
Iig bedankt voor de moeite, ik ga ze opslaan

Hier een UI-aanvraag op FOK!formaat!
Deze gaarne.

Misschien kunnen de pro-soepers hier even een kijkje nemen?

PHOTOSHOPPER GEZOCHT! :D

Wie o wie wil dit plaatje voor mij resizen naar 60*60

quote:

Op zaterdag 2 januari 2010 21:49 schreef winka het volgende:
Wie o wie wil dit plaatje voor mij resizen naar 60*60
[ afbeelding ]