Interaktivne ilustracije kodirane u CSS3 Bjorna Fjelstada


Interaktivne ilustracije kodirane u CSS3 Bjorna Fjelstada

Veb dizajner i programer Bjorn Fjelstad (nor. Bjørn Fjellstad) odlučio je da svakog dana tokom 2018. godine kreira po jednu ilustraciju dizajniranu opisnim jezikom CSS i objavi je u sklopu projekta koji je nazvao Dnevni CSS dizajn (eng. Daily CSS design).

Kako se programira ilustracija? I zašto je ovaj norveški dizajner odlučio da svoje veštine oproba i u tome?

Prema njegovim rečima, ideja da svakodnevno dizajnira prilagodljive (eng. responsive) ilustracije koristeći isključivo kodiranje jeste možda neuobičajena, ali on smatra da takav pristup može biti od velike koristi za unapređenje sopstvenog znanja, veština i kreativnosti.

„Programi namenjeni za grafički i veb dizajn svakako su logičan izbor za svakoga ko se time bavi. Ipak, kombinujući procese dizajniranja i programiranja otvaram nove mogućnosti i stvaram prostor za nastanak zanimljivih interaktivnih elemenata na ilustracijama”, objašnjava Bjorn Fjelstad.

Osim toga, on na ovaj način i vežba upotrebu tehnologija koje retko koristi, kao što su ponavljanje gradijenata, 3D efekti ili grafika koju pokreće binarni format instrukcija WebAssembly.

Isprobavajući nove kombinacije boja kroz kodiranje senčenja fragmenata (eng. fragment shader) i učeći o tome kako se kreiraju apstraktni oblici, Fjelstad istražuje polje ilustracije i animacije koristeći jezike HTML i CSS3, ali i vektorski format slika SVG za 2D grafiku i WebGL tehnologiju za 3D efekte.

Rezultat su interesantne animacije i ilustracije sa interaktivnim elementima, koje mogu biti podstrek i drugim veb dizajnerima i programerima da odluče da prošire ili upotpune svoje znanje u oblasti stilizacije objekata i upotrebi različitih tehnologija.

Predstavljamo vam odabrane radove Bjorna Fjelstada, a ukoliko želite da pogledate i ostale i nastavite da pratite projekat Dnevni CSS dizajn, to možete učiniti putem zvaničnog sajta projekta ili putem profila Bjorna Fjelstada na dizajnerskim mrežama Behancei Dribbble.

 

CSS3 ilustracija geometrija apstrakt

CSS3 ilustracija vatra

Naziv rada: Fire

CSS3 ilustracija planine fotografija trouglovi

Naziv rada: Mountain

CSS3 ilustracija boje vulkan

CSS3 ilustracija dormammu linije silueta

Naziv rada: Dormammu

CSS3 ilustracija apstraktno vrh ledeni breg

CSS3 ilustracija grain sfere boje senčenje

Naziv rada: Grain

CSS3 ilustracija riba css dizajn

CSS3 ilustracija apstrakt

CSS3 ilustracija maska lice oci

CSS3 ilustracija apstraktno drvo

CSS3 ilustracija mir pejzaz apstraktno

Naziv rada: Calm

CSS3 ilustracija delici parcici interaktivni dizajn

CSS3 ilustracija nesigurnost apstraktno talasi

Naziv rada: Uncertainty

CSS3 ilustracija zvezda padalica apstraktno linije

Naziv rada: Shooting star

CSS3 ilustracija eclipse sfere apstraktno

Naziv rada: Eclipse

CSS3 ilustracija interaktivno apstraktno

CSS3 ilustracija geometrija interaktivno

Naziv rada: Picnic

CSS3 ilustracija ogledalo looking glass apstraktno

Naziv rada: Looking glass

CSS3 ilustracija geometrijski oblici

CSS3 ilustracija geometrijski oblici apstraktno

Naziv rada: Nonsense

CSS3 ilustracija tvister interaktivni dizajn

Naziv rada: Twister

CSS3 ilustracija nucleobase prepletene linije

Naziv rada: Nucleobase

CSS3 ilustracija geometrija lopte sfrere

Naziv rada: Sphaleron


Mogu vam biti zanimljivi i slični tekstovi:

Nađa Božović

Community Manager at PopArt Studio
Inspired by original narratives and amazed by effective visuals. Enjoys diving deep into the story research. A lifelong learner and an eternal optimist.
Nađa Božović
facebook
twitter
google
pinterest