Animācija priekšgala izstrādātājiem - kurss RUB 31 380. no HTML akadēmijas, apmācība, Datums: 2023. gada 28. novembris.
Literārs Mistrojums / / November 30, 2023
Kurss notiek asinhronā formātā. Jūs varat sākt trenēties jebkurā laikā un pārvietoties pa programmu sev piemērotā ātrumā.
Kursa galvenā vērtība ir lielas atsauksmes no mentora, kurš detalizēti analizēs jūsu kodu, identificēs nepilnības materiāla izpratnē un palīdzēs jums tikt galā ar visu.
Kurss paredzēts pieredzējušiem izstrādātājiem, kuri vēlas uzlabot savas prasmes. Lai to apgūtu, jums ir nepieciešamas JavaScript izkārtojuma un programmēšanas prasmes. Kurss piemērots arī iesācējiem, kuri ir veiksmīgi apguvuši HTML un CSS kursus. Adaptīvs izkārtojums un automatizācija" un "JavaScript. Tīmekļa saskarņu profesionālā attīstība."
Kursā mēs izmantojam visefektīvākos profesionāļu apmācības formātus: tekstus, simulatorus, ekrānuzņēmumus un demonstrācijas. Mēs pārmērīgi neizmantojam video un izmantojam to tikai tur, kur tas ir nepieciešams.
Mūsu mērķis ir ikvienu jaunpienācēju pārvērst par pilntiesīgu un pieprasītu speciālistu, kas ir gatavs darbam web industrijā.
2013. gadā Saša un Leša atklāja HTML akadēmiju. Jau pašā sākumā nolēmām iemācīt strādāt ar dzīvo kodu, risinot problēmas, kas ir tuvas reālām. Mēs sniedzam iespēju iegūt ne tikai zināšanas, bet arī prasmes. Mācību procesā mēs konfrontējam skolēnu ar testiem, kuru princips ir “saskaņot, kā parādīts modelī”. Tas ir princips, pēc kura strādā lielākā daļa maketētāju.
Mēs uzskatām, ka maketēšana ir ļoti noderīga prasme jebkurai IT specialitātei. Tāpēc mēs cenšamies savus simulatorus padarīt pēc iespējas interesantākus, aizraujošākus, interaktīvus, neparastus un zināmā mērā spēlei līdzīgus.
Esam sagatavojuši simulatorus, kas aptver dažādus maketētāja darba aspektus. Tas ir pietiekami, lai rūpīgi iepazītos ar izkārtojumu. Un tiem, kas vēlas izaugt par profesionāli, esam sagatavojuši sešus tiešsaistes kursus. Šīs unikālās izglītības programmas ļauj sagatavot speciālistus ar tīmekļa nozarei nepieciešamajām prasmēm. Un mentori mums palīdz šajā jautājumā. Tagad ar mums strādā vairāk nekā trīs simti mentoru.
Ja tev nepietiek ar simulatoriem un kursiem, tad vari ieskatīties grāmatplauktā, kur pamazām krājam grāmatas par web izstrādi. Vai arī apmeklējiet mūsu forumu un apspriediet jautājumu, kas jūs satrauc.
Pēc kursa pabeigšanas pārlūkprogrammā varēsiet izveidot jebkuras sarežģītības animācijas. Pareizi izmantojot animācijas, jūs varat uzlabot savu izstrādāto vietņu UX kvalitāti un pievilcību. Kursā iekļauti vairāk nekā 40 praktiskie uzdevumi un 10 konsultācijas ar mentoru.
Pirmajā sadaļā apskatīsim animācijas vēsturi. Kā radīt kustības ilūziju, galvenās atšķirības starp klasisko un datoranimāciju. Kādas abstrakcijas ir datoranimācijas konstruēšanai? Kāda ir atšķirība starp lineāro animāciju un kadru pa kadram animāciju? Apskatīsim arī 12 izteiksmīgas animācijas principus. Pēc tam mēs izveidosim vienkāršas animētas pārejas CSS.
- Cauruļvads koda izpildei pārlūkprogrammā.
- CSS pāreja un animācija: atšķirības.
- Laika funkcijas: iebūvēts, kubikmetrs.
Šajā nodaļā mēs turpināsim iepazīstināt ar zemāka līmeņa abstrakciju: kadru pa kadram animāciju. Izpētīsim, kas ir FPS un standarta FPS vērtības: 24, 30, 60. Kas ir peldošais FPS. Apskatīsim kadru pa kadram animācijas piemērus:
- varoņu stāvokļa animācija spēlēs - metode tīmeklī Sprite Sheets - sagatavotas animācijas, 360 modelis (piemēram, automašīna).
- datoranimācija, kustību dizains - metode tīmeklī JS Tween un JS Morph - animācija, izmantojot bibliotēkas, piemēram, CreateJS, AnimateJS, GSAP.
- spēles, kas izseko spēlētāju darbības reāllaikā - sacīkstes, Tetris - modeļu veidošanas metode ar mijiedarbības saskarni - tīmekļa interaktīvos elementos un spēlēs.
Tāpat turpināsim padziļināti pētīt ekspresīvās animācijas principus: skatuves klātbūtne, pievilcība, profesionāls zīmējums - izstrādātāja uzmanība detaļām, gala attēla kvalitāte.
Praktiskajā daļā mācīsimies lietot:
- window.requestAnimationFrame.
- Audekls un tā parametri un metodes.
- Vienkārša elementa animācijas zīmēšanas cikls. Pārvērtības. Attēla zīmēšana. Maskēšana. Abstrakto objektu klase ir Rīga. Klases paplašinājums. Parametriskās trajektorijas specifikācija. Piemēri: elipse, spirāle, parabola, sinusoidāls vilnis, slāpēts sinusoidāls vilnis utt.
- Manipulācijas ar trajektorijām: saskaitīšana, reizināšana, paralēla pārnešana, sinusoidālās fāzes nobīde.
- Update() un render() metodes.
Šajā nodaļā mēs turpināsim strādāt ar kadru pa kadram animāciju. Uzzināsim, kas ir WebGL un OpenGL. Apskatīsim atšķirību starp darbu 2D un webgl kontekstā. Izpētīsim, kas ir rastra efekti:
- krāsu filtri
- OpenGL
- maskas – Luminācija, Alfa
- krāsu pārklājumi - sajaukšana
- trokšņi
- kompensācijas
- aizmiglot
Mēs arī pētīsim rastra efektu animāciju: pastāvīgu kustību un mainīgos parametrus.
Praksē apskatīsim:
- Kas ir virsotņu un fragmentu ēnotāji.
- Kā izmantot WebGL 3d 2D efektiem.
- Kas ir ģeometrija.
- Cauruļvads WebGL.
- JS un WebGL mijiedarbība.
- Datu veidi WebGL.
- GLSL rakstīšana – pamati.
Šajā nodaļā mēs vēlreiz runāsim par koordinātu sistēmām, punktiem un vektoriem. Pētīsim 3D transformāciju matricas, kvarterionus un Eilera leņķus, matricu reizināšanu.
Apsvērsim 2 iespējas, kā izveidot modeļus ar lietotāja vadības interfeisu:
- Tieša parametru iestatīšana: ātrums vai paātrinājums (kustība vai rotācija).
- Mērķa iestatīšana - vērtība, kurai jums pakāpeniski jātuvojas: elements tiek piesaistīts kursoram.
- Izpētīsim dzinēja darba ciklu, invalidate(), update() un render() metodes un iespējas strādāt ar peldošo FPS. Uzzināsim, kā veikt aprēķinus atjauninājumā ().
Praktiskajā daļā sāksim strādāt ar Three.js bibliotēku. Studējam:
- Objektu aprakstīšanas veidi: novietojums, ģeometrija un materiāli.
- Ģeometrija: parametriski iebūvēts, patvaļīgi ielādējams. Ģeometrijas buferis.
- Kādi materiāli ir, materiālu veidi, renderēšanas režīmi, pasūtījuma materiāli.
- Karogi atjaunināšanai.
- Renderēšanas cilpa.
- Pozīciju animācijas. Morph animācijas metode.
- Skatuves + kamera. Objektu pievienošana ainai. Grupēšana.
- Gaisma. Gaismas avotu veidi. Matcap materiāls.
Šajā daļā mēs apskatīsim, kas ir kamera WebGL un jo īpaši programmā Three. JS:
- Kameras vadība.
- Kameras pamata kustības.
- Kameru iekārtas.
- Dažādi iekārtu modeļi dažādiem vadības veidiem.
Praktiskajā daļā:
- Apskatīsim, kāda veida kameras ir trīs. JS, kameras parametri, mainiet izmērus, pārejot uz mobilo versiju.
- Izpētīsim kameras animācijas pieejas. Apskatīsim reakciju uz lietotāja darbībām – raita perspektīvas maiņa. Vadība ar iekārtu: kameras iekārtas renderēšanas cikls. Lidojuma animācijas izveide.
- Kameru iekārtas.
- Apsvērsim iespēju pārslēgties starp kamerām – rediģēšanu. Uzstādīšanas noteikumi.
Kursa beigu daļā apskatīsim tās API, kuras vēl nav gatavas lietošanai ražošanā, bet ir vērts sākt mācīties jau tagad, lai nākotnē uzlabotu sava darba efektivitāti.
- Apskatīsim, kā Web Animation API atšķiras no parastās CSS animācijas un kādas papildu iespējas tā nodrošina.
- Apgūsim Houdini API pamatus.
- Parunāsim par bibliotēkām, kas palīdzēs vienkāršot darbu ar animācijām, laika skalām, SVG, kanvas, WebGL.
- Apskatīsim programmas darbam ar animāciju un grafiku tīmeklim: Google Web Designer, Adobe Animate, Adobe After Effects, 3D grafikas programmas: Cinema 4d, Blender.
- Ņemsim īsu pārskatu par pieejām dinamiski ģenerētas animācijas un grafikas izveidei. Apskatīsim, kādus rīkus var izmantot, lai izveidotu starpplatformu programmatūru ar 3D.
- Parunāsim par to, kā jūs varat turpināt attīstīties animācijas veidošanā.
Šajā kursā jūs apgūsit pamatprincipus, kas tiek izmantoti priekšgala lietojumprogrammu izstrādē.
Šajā kursā jūs apgūsit Redux rīkkopu. Jūs uzzināsit vairāk par statusa organizēšanu lietojumprogrammā React. Galu galā jūs uzzināsit, kā pārvaldīt sarežģītas stāvokļa un dizaina reakcijas lietojumprogrammas.
Apgūstiet pieprasītu profesiju no nulles.