Slide 1Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
Osnovne tehnike vizualne komunikacije
Franc Novak
Slide 2Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
vizualni dizajn grafinih uporabnikih vmesnikov
prej: estetski vidiki forme
urejenost prostora
Slide 3Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
vizualni dizajn grafinih uporabnikih vmesnikov
prej: estetski vidiki forme splono,
neodvisno odciljne
urejenost prostora aplikacije
Slide 4Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
vizualni dizajn grafinih uporabnikih vmesnikov
prej: estetski vidiki forme splono,
neodvisno odciljne
urejenost prostora aplikacije
sedaj: zakonitosti vizualnega dizajna
ciljna aplikacija
Slide 5Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
vizualni dizajn grafinih uporabnikih vmesnikov
prej: estetski vidiki forme splono,
neodvisno odciljne
urejenost prostora aplikacije
sedaj: zakonitosti vizualnega dizajna konkretenproblem
ciljna aplikacija
Slide 6Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
uvod
Orodje, ki ga imamo na razpolago, je vizualni jezik.
Sintakso vizualnega jezika tvorijo osnovni elementi: toka, linija, ploskev involumen.
Skupaj z atributi: oblika, velikost, barva in tekstura doloajo strukturovizualnega jezika.
Vizualni jezik ima: formalni slovar, ki vsebuje osnovne elemente dizajna,vizualno sintakso, ki opisuje nain medsebojnega kombiniranja elementovv okviru danega sistema.
Slide 7Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
primer slabega dizajna
Slide 8Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
osnovna izhodia
Kdaj vkljuiti dizajn v razvoju nekega produkta?
Slide 9Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
vizualni dizajn vmesnika
Osnovne tehnike komunikacijskoorientiranega grafinega dizajna
eleganca in enostavnostsorazmerje, kontrast, dimenzijska harmonijaorganizacija in vizualne strukture
Slide 10Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
eleganca in enostavnost
Eleganco v dizajnu razpoznamo v primerih, ko gre za reitev danegaproblema na inovativen, uspeen nain, ki je hkrati popoln in skrajnoekonomien.
Zelo pomembna je enostavnost reitve.
Enostavnost reitve doseemo s ponavljajoim poenostavljanjem.
Slide 11Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
eleganca in enostavnost
Henry C. Beck, 1933
Slide 12Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
eleganca in enostavnost
London Underground's Victoria Line
Slide 13Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
eleganca in enostavnost obiajne napake
Slide 14Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
tehnike za doseganje elegance in enostavnosti
Reduciranje dizajna do njegovega bistva
Napotki: doloi glavne lastnosti, ki naj jih ima dizajn (tipino kraji spisek
pridevnikov); navedi tudi formalne elemente, kot je na primer ime, oznaka, barva, tekstura ali slika.
kritino preglej vsak element dizajna; ali je dizajn moen brez njega? e ne zna odgovoriti, ga izpusti.
poskusno odstrani element iz dizajna in poglej, kaj se zgodi. e se dizajn porui, ga ohrani. e ne, pa razmisli, e ne bi morda element izpustil.
Slide 15Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
tehnike za doseganje elegance in enostavnosti
Dva primera:
Logo Victoria and Albert Museum, London dostop za invalide
Slide 16Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
tehnike za doseganje elegance in enostavnosti
Regularnost dizajna
Napotki: kjerkoli je mono, uporabljaj regularne geometrijske oblike, umirjene
barve, enostavne obrise. e uporablja ve podobnih elementov (form, oblik), jih po monosti
naredi enake z vidika velikosti, barve, teksture, debeline linij, orientacije, poravnanja ali medsebojne razdalje.
omeji variacije v tipografiji na nekaj velikosti ene ali dveh druin pisav. da bi izrabil prednosti regularnosti, izpostavi kritine elemente namenoma
na neregularen nain.
Slide 17Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
tehnike za doseganje elegance in enostavnosti
primer :
regularne oblike
Slide 18Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
tehnike za doseganje elegance in enostavnosti
primer:
poenotenje oblik elementov
Slide 19Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
tehnike za doseganje elegance in enostavnosti
primer :
omejitev nabora pisav
Slide 20Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
tehnike za doseganje elegance in enostavnosti
Vekratna funkcionalnost elementov dizajna
Osnovna ideja: poiskati elemente dizajna, ki lahko igrajo vekratno vlogo
Napotki: preveri funkcijo, ki jo ima vsak posamezni element dizajna. poii situacije, ko imajo razlini elementi enako vlogo. preveri, e je mono nadomestiti kak element z drugim (tudi e naredimo
kako manjo spremembo). zdrui redundantne elemente v enostavno enoto ali pa jih zamenjaj z
neko skupno funkcionalnostjo glede na dano ciljno okolje
Slide 21Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
tehnike za doseganje elegance in enostavnosti
Primer vekratne funkcionalnosti iz vsakdanjega ivljenja
Slide 22Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
tehnike za doseganje elegance in enostavnosti
Primer vekratne funkcionalnosti
Slide 23Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
razmerje, kontrast, skladnost
Razmerje predstavlja relativno velikost danega elementa dizajna glede na ostale elemente celotne kompozicije.
Kontrast predstavlja opazne razlike znotraj dane vizualne dimenzije (kot na primer oblika, velikost, barva, tekstura, pozicija).
Skladnost (dimenzijska harmonija) - tipien primer: zlati rez.
Slide 24Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
razmerje, kontrast, skladnost
Slide 25Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna Jasnost (angl. clarity)
Predstavljeni elementi so organizirani na smiseln, razumljiv in razpoznaven nain.
Faktorji, ki vplivajo na jasnost dizajna so:konsistentnost dizajna,vizualno privlana kompozicija,logina razporeditev,predstavitev primerne koliine informacij,grupiranje in poravnava elementov zaslona.
Slide 26Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Jasnost (angl. clarity)
Slide 27Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Harmonija
Zlati rez
Slide 28Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Zlati rez
Slide 29Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Zlati rez
Slide 30Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
koren od 2
Slide 31Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Simetrija:
Slide 32Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Simetrija:
Doloi linije, ki bodo igrale vlogo osi simetrije. Obiajno se v tem koraku odloamo tudi med vertikalno in horizontalno simetrijo.Za lovekovo zaznavanje je bolj uinkovita vertikalna simetrija.Odloi se o vsebini, ki bo podana na obeh straneh osi simetrije.Prepriaj se, da je os simetrije dejansko na sredini zaslona ali okna, kjer bo podana dana vsebina.
Slide 33Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Simetrija:
Slide 34Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
uravnoteenost
Slide 35Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
uravnoteenost
Slide 36Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
uravnoteenost
Slide 37Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Optina prilagoditev:
Slide 38Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Optina prilagoditev:
Slide 39Interakcija lovek - raunalnik (Osnovne tehnike vizualne komunikacije)
principi dobrega dizajna
Optina prilagodite
