Učenici trećeg razreda web dizajna, sa svojim nastavnikom Krešimirom Vargom, na satu Web projekata obilježili su Sat kodiranja – Hour of Code koji se ove godine održavao između 3. i 7. prosinca. Sat kodiranja globalni je pokret neprofitne organizacije Code.org kojeg čine milijuni učenika u preko 180 zemalja. Ovaj projekt uključuje održavanje radionica čiji je cilj u jednome školskom satu učenicima približiti računalnu znanost te ju učiniti zabavnom i kreativnom te dostupnom svima – bez obzira na dob ili spol.
Tako su webovci Sat kodiranja započeli kratkim motivacijskim videom Ono što većina škola ne uči koji započinje poznatom izjavom Stevea Jobsa: “Svatko bi trebao naučiti programirati, jer nas to poučava kako da razmišljamo”. Uslijedila je aktivnost CSS animacije: putovanje kroz vrijeme u kojoj su istraživanjem evolucijskog puta civilizacije od kotača do slanja rakete u duboki svemir ponovili premještanje, rotiranje i transformiranje objekata korištenjem prijelaza i animacija. Aktivnost je završena podjelom potvrda učenicima za uspješno odrađene zadatke.
No, to nije prvi put da se učenici susreću s prijelazima i animacijama u CSS-u. Osim što se ti nastavni sadržaji obrađuju u drugom i trećem razredu na nastavi iz Web projekata, učenici ih redovito koriste za poboljšanje korisničkog iskustva prilikom izradbe složenih korisničkih sučelja svojih web stranica i drugih web projekata. Osim toga, koriste ih i za izradu CSS crteža koji u posljednje vrijeme postaju vrlo popularni na internetu pod nazivom CSS art. Kreiranje CSS crteža je zanimljivo i zabavno, pogotovo kad se na njega dodaju i animacije. Osim što pomažu u savladavanju nastavnih sadržaja (poput pozicioniranja, transformacija, pseudoelemenata, animacija i prijelaza), olakšavaju shvaćanje modularnog pristupa prilikom izradbe web rješenja te usavršavaju vještinu bržeg pisanja složenijeg koda u CSS-u.
Da je to doista tako, pogledajte na primjerima CSS crteža koje su izradili učenici trećeg razreda Elena Bakliža, Mario Fučkan i Mislav Drenski na satovima Web projekata. Prilikom pregledavanja crteža postavite veličinu prikaza na 0.5x u donjem dijelu prozora. Animacija se pokreće ponovno od početka ako odaberete Rerun.
See the Pen Elena Bakliža, 3.WD by Tabula nova (@tabulanova) on CodePen.
See the Pen Mario Fučkan, 3.WD by Tabula nova (@tabulanova) on CodePen.
See the Pen Mislav Drenski, 3.WD by Tabula nova (@tabulanova) on CodePen.
