
Burimi: Programi online
Ka shumë programe ku mund të modifikoni, krijoni montazhe apo edhe të krijoni animacione, çdo herë ka shumë softuer që shtojnë këtë lloj projektesh ndërvepruese. Në këtë postim jo vetëm që do t'ju prezantojmë me botën e animacioneve, por do t'ju prezantojmë edhe me një mik të ri.
Siç e dini, bota e informatikës është plot me komanda dhe mjete të dobishme për zhvillimin e ueb faqeve apo mediave online, të cilat aktualisht bashkëjetojnë. Qëndroni me ne dhe zbuloni në këtë tutorial të ri një mënyrë tjetër për të rritur nivelin tuaj me informatikë dhe interaktivitet.
Çfarë janë animacionet?
Burimi: Të gjithë lojtarët
Ne dëshirojmë që ju të hyni plotësisht në tutorial, por për këtë, është e nevojshme të hyni në botën e animacioneve ose atë që ka të bëjë me dizajnin grafik, botën e dizajn interaktiv.
Edhe animacionet janë pjesë e botës audiovizive, në fakt ato nuk do të ishin asgjë nëse ose sepse në to futen një audio dhe një imazh lëvizës. Për këtë arsye, kur flasim për "animacion", i referohemi asaj që në popull njihet si "karikaturat".
Siç u përmbledh më lart, animacioni lind nga aftësia për t'i dhënë lëvizje diçkaje, në këtë rast karikaturave. Por si arrihen të gjitha këto lëvizje, pa dyshim që lindin nga ajo që ne i quajmë, sekuenca vizatimesh ose fotografish që duke u porositur radhazi, njëri pas tjetrit, arrijnë të gjenerojnë një lëvizje të besueshme para syve tanë, të cilët japin hua dhe hyjnë në lojën e iluzionit pamor.
Më parë, animacionet e para ishin projektuar në fletë letre, në secilën prej tyre, personazhi i animuar vizatohej duke bërë hapa, dhe sapo arrinte fundi i fletës, kalohej një nga një shpejt për të arritur efektin e lëvizjes në vizatim.
Llojet e animacionit
Ekzistojnë lloje të ndryshme të animacionit:
Film vizatimor ose animacion tradicional
Ky stil konsiston në dhënien e lëvizjes së protagonistit kornizë për kornizë. Në fillim, kur nuk kishte mjete audio-vizuale të mjaftueshme, ato kryheshin përmes vizatimit dhe pikturimit të çdo kuadri (përfshirë sfondin, skenën ose sfondin e animacionit), për t'u filmuar më vonë në atë që ne e njohim si shirit filmi.
Ndalin lëvizjen
Stop Motion është një teknikë animacioni që nuk ka asnjë lidhje me filmat vizatimorë. Për më tepër, objektivi kryesor i tij është të simulojë lëvizjet e objekteve që në realitet janë totalisht statike dhe ndahet në dy faza: animimi i argjilës ose lëvizjes së baltës dhe animimi i objekteve të ngurtë.
Pixelation
Pixelation është një teknikë që vjen nga Stop Motion dhe konsiston në punën me objekte që nuk janë as kukulla dhe as modele, por objekte ose njerëz të zakonshëm. Objektet fotografohen disa herë dhe zhvendosen pak me çdo kornizë.
Rotoskopia
Ai përbëhet nga vizatimi i drejtpërdrejtë i një vizatimi tjetër, siç është gjurmimi i një vizatimi në një vizatim tjetër ose i një personi real. Konsiderohet si një pararendës i mokapit, domethënë i kapjes së lëvizjes që përdoret për të rikrijuar personazhet dixhitale në botën e kinemasë.
Animacion nga Cutouts ose Cut out Animation
Është një teknikë që konsiston në prerjen e figurave, këto figura mund të paraqiten në letër ose në fotografi. Trupi i personazheve është ndërtuar në bazë të prerjeve dhe lëvizja dhe animacioni lindin nga një zëvendësim i prerjeve të përmendura.
animacion 3d
Animacioni 3D buron nga një program redaktues, i cili lejon kryerjen e simulimeve dhe animacioneve. Brenda këtyre dy varianteve, ndriçimi i mirë, lëvizjet e kamerës dhe efektet speciale vijnë në kontakt.
Aktualisht ekzistojnë edhe teknika të tjera si: piktura në xham, animacioni me rërë, ekrani i gujas dhe piktura në celuloid.
Çfarë është CSS?
Burimi: Rosario Session Studio Web Design
Tani që dini pak më shumë për botën e animacioneve, është koha që ne t'ju prezantojmë me botën e akronimeve CSS.
qëndron CSS, referojuni "fletave të stilit kaskadë". Formohet nga nje gjuhe qe perdoret ne sektorin e dizajnit dhe ne prezantimin e ueb faqeve, akoma me mire, jane nje seri veglash dhe komandash qe kane persiper paraqitjen e nje uebfaqeje ashtu sic e shohim per here te pare tashmë është krijuar. Punon së bashku me mjetin HTML (organizuar nga përmbajtja bazë e faqeve).
Emri i saj përcaktohet nga numri i gjetheve që përmban dhe njëra prej tyre trashëgon veti ose karakteristika nga të tjerët. Kjo do të thotë, ju mund të punoni me një shabllon të thjeshtë blogu, por kur dëshironi të personalizoni pamjen e një faqeje, do t'ju duhet të zbatoni CSS që së bashku me një CMS të mirë do t'ju ndihmojë të përmirësoni shtrirjen e përmbajtjes suaj.
Për çfarë është CSS?
Me CSS, ju mund të organizoni faqen tuaj, domethënë mund t'i tregoni faqes tuaj të internetit se si dëshironi të gjeni të gjithë informacionin në mënyrë që shikuesi të jetë i lehtë për t'u trajtuar dhe i dobishëm në të njëjtën kohë. Këtu futni të gjitha komandat e disa elementeve që janë pjesë e stilit ose dizajnit të faqes së internetit, për shembull, të fontet, ngjyrat, madhësitë etj.
Normalisht, në mënyrë që të kuptoni më mirë se për çfarë bëhet fjalë për këtë mjet, specialistët e marketingut dixhital janë të parët që e kuptojnë këtë pasi janë ata që i trajtojnë ato.
Animoni në CSS
Epo, tani që dini pak për botën e animacioneve dhe CSS. Është koha për të filluar tutorialin.
Animacionet CSS ju lejojnë të animoni kalimin midis një stili CSS në një tjetër. Këto animacione përbëhen nga dy komponentë: a stil i cili përshkruan animacionin CSS dhe një grup të korniza që tregojnë gjendjen fillestare dhe përfundimtare të tij, si dhe pikat e ndërmjetme të mundshme në të.
Secili prej këtyre animacioneve ka një sërë avantazhesh:
- Përdorimi i tij është shumë i lehtë për animacione të thjeshta, mund ta bëni edhe pa pasur njohuri të Javascript.
- Animacioni shfaqet saktë, edhe në kompjuterë me fuqi të ulët.
- Duke qenë i kontrolluar nga një shfletues, ai lejon optimizimin e performancës dhe efikasitetit të tij, duke ulur kështu frekuencën dhe ekzekutimin e skedave në mënyrë të tillë që ato të mos jenë të dukshme.
Cilësimet e animacionit
Për të filluar një animacion, para së gjithash do të duhet ta konfigurojmë atë. Për ta bërë këtë, ne do të shkojmë në pronë gjallëri dhe nën-vetitë e tij. Ky mjet do të na lejojë të konfigurojmë si ritmin ashtu edhe kohëzgjatjen e animacionit dhe as sekuencën e tij.
Nën-vetitë janë:
animacion - vonesë
Koha e vonesës ndërmjet momentit të ngarkimit të elementit dhe fillimit të sekuencës së animacionit.
animacion - drejtim
Tregon nëse animacioni duhet të kthehet në kornizën fillestare në fund të sekuencës ose nëse duhet të fillojë nga fillimi kur të arrijë në fund.
animacion - kohëzgjatje
Tregon sasinë e kohës që i duhet animacionit për të përfunduar ciklin e tij (kohëzgjatja)
animacion - përsëritje - numërim
Sa herë që përsëritet. Mund të tregojmë infinit për të përsëritur animacionin pafundësisht.
animacion - emër
Përdoret për të specifikuar emrin që përshkruan secilin prej kornizave të animacionit.
animacion - luaj - gjendje
Ju lejon të jeni në gjendje të ndaloni dhe të rifilloni sekuencën e animacionit.
funksioni animacion - koha-
Tregon ritmin e animacionit, domethënë se si shfaqen kornizat e animacionit, për këtë vendosen kthesat e nxitimit.
modaliteti animacion - mbushje
Përcakton se çfarë vlerash do të kenë vetitë pas përfundimit të animacionit.
Vendosni sekuencën me korniza
Pasi të kemi konfiguruar kohën, nomenklaturën etj. Është koha për t'i ofruar një pamje apo ndjesi animacionit tonë.
Për ta bërë këtë, ne do të krijojmë dy korniza të reja dhe do të përdorim rregullin @ keyframes. Me këtë, çdo kornizë përshkruan se si gjendet secili element gjatë sekuencës së animacionit.
Për të treguar koha dhe ritmi, korniza përdor përqindje dhe nga dhe nëFalë kësaj, ne mund të tregojmë se kur bëhet fillimi me 0% dhe përfundimi me 100%.
Animacion me kornizë dhe tekst
Për të shtuar më shumë korniza dhe për t'i animuar ato me tekst, duhet të aplikoni një madhësi më të madhe të fontit të kokës në mënyrë që titulli të rritet ndërsa lëviz për një kohë të caktuar dhe më pas të zvogëlohet në madhësinë e tij origjinale. Për këtë ne do të krijojmë kodin e mëposhtëm:
75% font - madhësia: 300%; diferencë - majtas: 25%; gjerësia: 150%;
Me këtë kod, i sugjerojmë shfletuesit që në 75% të sekuencës, titulli të ketë një diferencë të majtë 25% dhe një madhësi 200% me gjerësi 150%.
Përsëritja e animacionit
Për të përsëritur një animacion, është e nevojshme të përdorni veçorinë e mëposhtme animacion - përsëritje - numërim dhe duhet të tregojmë sa herë duam të përsëritet. Mund të përdorim edhe infinit në mënyrë që të përsëritet gjithmonë.
Përfundim
Siç e keni parë, në CSS mund të krijoni projekte të animuara dhe mund t'i futni ato duke ndjekur hapat që ju kemi dhënë. Nëse vazhdoni të pyesni dhe informoni veten, do të zbuloni se ka shumë opsione të disponueshme për ne.
Keni guxuar tashmë?