Eżempji ta' Animazzjoni CSS

css-animazzjonijiet

Sors: PC World

Id-dinja tal-animazzjonijiet hija aktar preżenti kuljum, hemm ħafna programmi li jgħinuna noħolqu edizzjonijiet dettaljati tal-vidjo. Jekk għadek ma tafx is-CSS, wasal iż-żmien li tibda tiffamiljarizza ruħek magħha u tiskopri dak kollu li jista' jsir.

Imma peress li ma rridux nelaboraw, inġibulkom post mimlija animazzjonijiet, ħafna minnhom jaqdu ċertu funzjoni, oħrajn sempliċement ġew iddisinjati biex divertiment u divertiment. F'din il-kariga, aħna nuruk xi wħud mill-aqwa animazzjonijiet CSS u barra minn hekk, nuruk programmi oħra ta’ interess fejn tista’ tkompli l-vjaġġ tiegħek bħala disinjatur jew disinjatur tal-animazzjoni.

CSS

CSS huwa definit bħala a tip ta’ riżorsa li normalment tintuża ħafna fis-settur tad-disinn tal-paġna tal-web. Jiġifieri, hija serje ta 'kodiċijiet li huma ddisinjati biex jissodisfaw ċerti funzjonijiet. Jekk taf it-terminu HTML, żgur li tkun taf it-terminu CSS, għax jimxu id f'id u t-tnejn huma żewġ pilastri fundamentali fil-ħolqien u l-iżvilupp ta' ħafna riżorsi oħra tal-internet.

Biex tifhimha aħjar, diġà hemm mudelli mfassla fejn tista’ tibda teditjahom u b’hekk toħloq il-paġna web tiegħek. Imma jekk dak li trid hu li timmodifika l-indirizzi tal-link jew il-link tal-paġna tiegħek, ikun meħtieġ li tuża xi kodiċijiet li kull programmatur irid ikun jaf.

Karatteristiċi ġenerali

  • Għalkemm mal-ewwel daqqa t'għajn jidher li HTML u CSS huma l-istess, mhumiex. Bl-HTML tista' tindirizza mill-ġdid u tqassam l-informazzjoni li għandek bżonn jew trid mill-paġna web tiegħek. Min-naħa l-oħra, bis-CSS, dak li tippermetti huwa l-ordni ta 'kull waħda mill-paġni li tkun qed tiddisinja. Njew huma l-istess iżda kif imsemmi hawn fuq, it-tnejn huma żewġ pilastri fundamentali fl-iżvilupp tal-paġni tal-web.
  • Il-karatteristika tas-CSS hija li tista 'tintuża f'ħafna browsers, m'għandha l-ebda mudell stabbilit, iżda l-lingwa tagħha hija universali u wkoll adattata għall-apparati kollha disponibbli. Dan jiffaċilita x-xogħol peress li l-ebda tip ta 'estensjoni ma hija meħtieġa, u wisq inqas programmatur.
  • Kif speċifikat ukoll, Hija għodda tajba jekk dak li trid tiddisinja u b'dan il-mod timmodifika jew ibiddel kwalunkwe aspett tal-interface tal-paġna web tiegħek. Dan ġej kemm minn fonts kif ukoll minn tones, jiġifieri, Għandek firxa wiesgħa ta 'possibbiltajiet.
  • Huwa faċli biex timmaniġġa u hemm kodiċijiet stabbiliti minn qabel biex tibda bid-dinja ta 'żvilupp ta' dan it-tip ta 'format, tieħu snin ta' prattika iżda CSS Għandu bażi inizjali fejn tista 'toħloq l-ewwel animazzjonijiet tiegħek u tħossok bħal disinjatur professjonali tal-paġna tal-web. Barra minn hekk, hija sistema li hija miftuħa għal kull min irid jibda jiżviluppa l-ewwel proġetti tiegħu. Fil-qosor, jekk dak li qed tfittex hu li tmur lil hinn minn template jew kreatur awtomatiku ta’ paġna web, b’CSS tista’ tibda l-avventura tiegħek.

eżempji ta' animazzjoni

Dodecahedron

dodecahedron

Sors: Web design

Dodecahedron hija animazzjoni maħluqa mill-animatur Wontem. L-animazzjoni hija bbażata fuq li tkun maħluqa kompletament permezz tas-CSS fejn id-disinn ta’ dodecahedron li jdur jidher fuq sfond skur li jsaħħaħ il-luminożità tiegħu. Dettall ieħor li għandu jittieħed kont huma l-effetti li ġew applikati għaċ-ċifra.

L-aktar li jikkaratterizza din l-animazzjoni huwa li għandha ċerta tendenza li tkun disinn tridimensjonali, li huwa saħansitra aktar interessanti. Huwa bla dubju animazzjoni eċċellenti jekk dak li tixtieq hija d-dinja 3D u jilagħbu bil-volum ta 'oġġetti.

goblin animat

goblin animat

Sors: Web Design

Din l-animazzjoni hija intitolata goblin animat u ġiet maħluqa mid-disinjatur Avaz Bokiev, bla dubju hija sekwenza żgħira fejn wieħed mill-protagonisti stilla tal-era tal-logħob tal-kompjuter, Mario Bros.

Huwa stil ta 'animazzjoni magħruf bħala stop-motion peress li jilgħab bil-moviment direzzjonali permezz ta’ sekwenzi qosra. Mingħajr dubju, hija animazzjoni stilla li tikseb ir-rikonoxximent kollu jekk inti dilettant ta 'Mario Bros. Hija waħda mill-aqwa animazzjonijiet maħluqa fis-CSS.

Kamera fotografika

Kamera tar-ritratti

Sors: Web Design

Din l-animazzjoni eċċellenti fiha kamera fotografika animata. Hija animazzjoni maħluqa minn Damiem Pereira u jippermetti lill-kamera tissimula l-qbid ta' immaġni sempliċement billi tagħfas il-buttuna. Hija animazzjoni interessanti jekk tħobb id-dinja tal-fotografija u għandek bżonn sezzjoni fuq il-paġna web tiegħek animata bħal din.

Il-ħaġa interessanti dwar din l-animazzjoni hija li tista 'tpoġġi l-immaġni li trid u l-kamera turiha meta tagħfas il-buttuna. Hija bla dubju waħda mill-aktar animazzjonijiet kreattivi ddisinjati f'CSS.

sistema solari kaskata

sistema solari

Sors: Web Design

Din l-animazzjoni dwar is-sistema solari ġiet maħluqa minn Tady Walsh, fejn turi mudell żgħir jew simulazzjoni tas-sistema solari tagħna. Hija animazzjoni eċċellenti peress li tista 'tara kif kull waħda mill-pjaneti timxi b'veloċitajiet differenti. 

Hija waħda mill-aktar animazzjonijiet realistiċi u aqwa. Tista' ssibha interessanti jekk taħdem fid-dinja tal-astronomija jew jekk tkun fan tal-univers u l-pjaneti tiegħu. Hija definittiva, hija animazzjoni li tieħu l-premju bħala waħda mill-aqwa u sorprendenti.

animazzjoni tal-gwerer tal-istilel

animazzjoni tal-gwerer tal-istilel

Sors: Web Design

Jekk jogħġobkom Star Wars ma tistax titlef din l-animazzjoni maħluqa minn Donovan Hutchinson. Hija bla dubju animazzjoni b'effetti speċjali tat-titlu tas-saga famuża ta' Star Wars. Il-ħaġa sorprendenti dwar din l-animazzjoni hija kif lagħbet mal-moviment tal-fonts differenti.

Bla dubju hija waħda mill-animazzjonijiet tal-istilel peress li qieset kull wieħed u waħda mill-elementi fittizji li toffri s-saga: galassji, dwal LED, sfondi skuri u fonts impressjonanti.

Barra minn hekk, l-effetti tal-moviment huma wkoll pjuttost suċċess u jiġbdu ħafna attenzjoni mit-telespettatur.

Applikazzjonijiet biex jinħolqu animazzjonijiet

Adobe Spark

Adobe Spark hija għodda li hija parti mill-Adobe u hija responsabbli biex toħloq animazzjonijiet tal-għaġeb u b'hekk tagħmel vidjows animati u divertenti bla tarf. Dak li jiġbed l-attenzjoni ta 'din l-għodda u bla dubju huwa punt favur tagħha huwa li hija disponibbli għall-apparat mobbli, tablets u kompjuters. Ukoll, jekk qed tfittex li toħloq kontenut ta 'kwalità għall-websajt tiegħek, hija l-għodda perfetta, peress li għandha eluf ta' mudelli dekorattivi biex tibdel l-ispazju tiegħek f'post attraenti biex iżżur.

Desk ta 'l-animazzjoni

Hija waħda mill-applikazzjonijiet star jekk inti illustratur u għad ma tafx kif tagħti ħajja lit-tpinġijiet tiegħek, grazzi għal din l-għodda, tkun tista 'tagħti twist lill-proġetti artistiċi tiegħek u wkoll, tkun kapaċi tagħmel kull wieħed u waħda mit-tpinġijiet tiegħek hemmhekk. Ukoll, għandu pakkett sħiħ ta 'pniezel, lapsijiet ta' ponot differenti, firxa pjuttost wiesgħa ta 'kuluri u għandek ukoll l-għażla li tagħmel l-ewwel abbozzi preliminari tiegħek, huwa mingħajr dubju dak li għandek bżonn biex tibda bid-dinja tal-animazzjoni permezz ix-xogħlijiet tiegħek stess. Ipprova u toqgħodx max-xewqa.

Synfig studio

Synfig huwa wieħed mill-aqwa programmi biex toħloq animazzjonijiet 2D. Hija waħda mill-għodod ewlenin jekk tixtieq id-dinja tal-animazzjoni fl-aktar stil Disney pur. B'Synfig, għandek ukoll firxa wiesgħa ta' pniezel, filtri u anke effetti li tista' tapplika għat-tpinġijiet tiegħek.

Barra minn hekk, jekk inti fan tat-2D ma tistax titlef l-opportunità li tipprova dan it-tip ta’ programmi, peress li joffru l-possibbiltà li tagħti moviment u ħajja lill-illustrazzjonijiet tiegħek. Jekk ħdimt ma 'vettori qabel, allura dan il-programm mhux se jkun differenti jew ikkumplikat għalik.

Premiere Pro

Premiere Pro hija għodda oħra ewlenija fil-pakkett Adobe. Huwa wieħed mill-programmi l-aktar użati mill-edituri tal-vidjo professjonali u minn ħafna studios ta ' l-animazzjoni. Bil-Premiere tista’ toħloq l-ewwel animazzjonijiet tiegħek u titlaq fost il-ħafna effetti li fiha.

Barra minn hekk, jekk inti tibda fis-settur awdjoviżiv, għandha xi tutorials żgħar biex tintroduċik fl-interface tagħha u tħallik tinġarr mill-immaġinazzjoni tiegħek u mill-iktar naħa kreattiva tiegħek.

Huwa disponibbli kemm għall-Android kif ukoll għall-iOS. L-uniku żvantaġġ huwa li mhix applikazzjoni b'xejn, teħtieġ spiża żgħira.

Konklużjoni

Il-ħolqien ta' animazzjonijiet fis-CSS huwa sempliċi ħafna, kull ma trid tagħmel hu li titgħallem u tkun ispirat minn dawk li ilhom snin f'dan is-settur. Kif rajt, hemm ħafna animazzjonijiet li jeżistu, barra minn hekk hemm disinjaturi oħra li jużaw riżorsi ferm aktar funzjonali, bħad-disinn taż-żibel famuż tal-Windows f’forma ta’ ajruplan fejn jiċċaqlaq mad-desktop kollu u jelimina dak ma tridx.

Fil-qosor, hemm ħafna ideat u ġenji li ġew iddisinjati, iżda issa jmissek li tibda tipprogramma u tiżviluppa l-ewwel animazzjonijiet tiegħek bis-CSS.


Il-kontenut tal-artikolu jaderixxi mal-prinċipji tagħna ta ' etika editorjali. Biex tirrapporta żball ikklikkja hawn.

Kun l-ewwel li tikkummenta

Ħalli l-kumment tiegħek

Your email address mhux se jkun ippubblikat.

*

*

  1. Responsabbli għad-dejta: Miguel Ángel Gatón
  2. Għan tad-dejta: Kontroll SPAM, ġestjoni tal-kummenti.
  3. Leġittimazzjoni: Il-kunsens tiegħek
  4. Komunikazzjoni tad-dejta: Id-dejta ma tiġix ikkomunikata lil partijiet terzi ħlief b'obbligu legali.
  5. Ħażna tad-dejta: Bażi tad-dejta ospitata minn Occentus Networks (UE)
  6. Drittijiet: Fi kwalunkwe ħin tista 'tillimita, tirkupra u tħassar l-informazzjoni tiegħek.