Upload
lianxing24
View
30
Download
5
Embed Size (px)
DESCRIPTION
Korisnicka sucelja
Citation preview
Seminarski rad iz predmeta Ergonomija racunalne i programske opreme:
Dizajn i upotreba ikona u korisnickom sucelju
Igor Šipka
Ukoliko cesto koristite racunala sigurno ste imali iskustva sa aplikacijama cija su sucelja nalikovala kontrolnoj ploci svemirskog broda sa planeta “Zorg”. Hrpa šarenih ikona u cije znacenje je upucen samo prvotni dizajner aplikacije uvijek me natjera da se zapitam dali sucelja moraju biti takva. Dizajn korisnickih sucelja pa tako i dizajn ikona nije nimalo jednostavan posao. Cesto iz najboljih namjera dizajnera nastaju sucelja koja naginju apstraktnoj umjetnosti. Takva loše izvedena sucelja uzrokuju gubitak krajnjih korisnika, cak i kod kvalitetnih aplikacija. U namjeri da se pozabavim problemom ispravne upotrebe i dizajna ikona odlucio sam se za ovu temu.
Što je ikona ? Rijec ikona dolazi od grcke rijeci eikon u prijevodu slika ili lik, koja potice od glagola eikenai u prijevodu biti kao odn. pricinjavati se.
U racunalnom žargonu ikona je slika koja na ekranu predstavlja specificnu datoteku, direktorij, prozor, opciju, program ili bilo što drugo što možemo predstaviti u grafickom obliku. Ikone su graficka metafora te predstavljaju vizualnu sliku koju korisnik asocira sa odredenim znacenjem.
Pokušajte samo prebrojati ikone koje su vidljive na vašem ekranu (naravno ukoliko koristite sustav koji ima graficko sucelje i ne citate sa papira). Sama zastupljenost ikona u današnjim korisnickim suceljima govori o važnosti rada sa kvalitetnim ikonama. Pod kvalitetnim podrazumijevam one ikone koje korisniku jasno sugeriraju zadano znacenje.
Zašto koristiti ikone ? Upotrebljivost ikona u korisnickom sucelju daleko nadilazi upotrebljivost rijeci.
Evo i nekoliko razloga zašto:
1. Kad se od korisnika zahtjeva brzina rada i efikasnost, dobro dizajnirane ikone mu omogucuju shvacanje njihovog znacenja u jednom pogledu, cime ga rješava potrebe za citanjem i analizom znacenja teksta.
2. Rijeci i prirodni jezik nisu pogodni za opisivanje vizualnih predodžbi ili prostornih odnosa. Mnoge struke kao inženjeri, naucnici, arhitekti, dizajneri bave se i razmišljaju u vizualnim pojmovima.
3. Ikona svojom površinom štedi dragocjen prostor na ekranu. Tekstualni ekvivalenti su znacajno zahtjevniji po pitanju zauzetog prostora.
4. Ikonu za razliku od rijeci vrlo lako izdvajamo iz hrpe ikona npr. prema njenom obliku ili boji.
5. Ikone trenutno prepoznajemo tj. nije potrebno citati da bi shvatili što pojedina ikona predstavlja
6. Ikonu lako pamtimo. 7. Korisnik ne mora znati citati da bi se koristio suceljem. 8. Dosljedno korištenje ikona u sucelju dovodi do standardizacije
sucelja
Povijest upotrebe ikona U pocetku bijaše slika. Dugo prije nego što su se razni oblici glasova pretvorili u rijeci, naši preci komunicirali su izrazima lica i položajem
tijela. Špiljska umjetnost je pretekla pisani jezik stotinama stoljeca, a i sama abeceda je evoluirala iz ranijih piktografskih znakova. Ironicno je da je upravo upotreba racunala u 20 stoljecu dovela do ponovnog otkrica ovog prapovijesnog oblika komunikacije. Upotreba ikona je jednako stara koliko je danas aktualna i važna.
Kratak pregled nekih podrucja upotrebe ikona odn. simbola u širem znacenju rijeci kroz povijest:
1. Špiljske slike i petroglifi (Altamira, Lescaux)
2. Piktografski jezici
3. Narodna dekorativna umjetnost
4. Okultni i religijski simboli
5. Oznake vlasništva i trademarkovi
6. Cestovne oznake
Danas u modernom svijetu ikone i simboli prisutniji su nego ikad prije. Pogledajte samo bilo koju važniju ulicu bilo kojeg modernog grada i ugledati cete stotine simbola od kojih su neki postali tako uobicajeni da ih uopce ne primjecujemo kao simbole. Jedno je sigurno ikone i simboli danas više nego ikad postali su dio naše kulture.
Pogrešne predodžbe o ikonama
Kad se radi o ikonama ne vrijedi izreka da se o ukusima ne raspravlja. Svatko ima svoje mišljenje o upotrebi ikona, no velik broj ljudi ima pogrešne predodžbe o tome što ikona treba biti. Kako bi razbio neke pogrešne predodžbe o ikonama navodim nekoliko najcešcih.
1. Ikone u potpunosti zamjenjuju rijeci
POGREŠNO: Ukoliko koristite ikone u sucelju nije potrebno niti poželjno koristiti rijeci.
ISPRAVNO: Ovakvim pristupom dizajner propušta iskoristiti najbolje od oba svijeta rijeci i ikona. Rijeci pomažu korisniku da u pocetku poveže znacenje pojedine ikone.
2. Ikone nisu nimalo bolje od tekstualnih sucelja
POGREŠNO: Rad sa suceljem temeljenom na ikonama je neefikasan i nespretan, to sve mogu u tri linije koda natipkati.
ISPRAVNO: Iako je ova rasprava znatno složenija, pojednostavimo sve to na jedan argument. Prepustite odluku korisnicima, ponudite im oba nacina rada i prepustite njima da odaberu nacin rad koji im odgovara.
3. Ikone cine proizvod jednostavnijim za korištenje
POGREŠNO: Kako bi pojednostavili proizvod sve što trebam napraviti je zamijeniti komande i menije sa ikonama.
ISPRAVNO: Ikone ne cine proizvod boljim ili jednostavnijim, to se postiže dobrim dizajnom.
4. Ikone moraju biti savršeno ocite
POGREŠNO: Odbaciti treba svaku ikonu koja nije odmah ocita svakome.
ISPRAVNO: Ustvari prvo prepoznavanje ikone zahtjeva od svakog korisnika odredeno vrijeme, no to vrijeme nije presudno ono što je važnije je vrijeme koje je korisniku potrebno za ponovno raspoznavanje ikone.
5. Ikone su slike
POGREŠNO: Najbolje ikone su umanjene realisticne slike ili ilustracije.
ISPRAVNO: Ikone nisu slike jer ih ne koristimo kako bi prepoznali kako nešto izgleda. Zapravo ako ikone moramo gledati izbliza da bi ih prepoznali one gube svrhu.
6. Dizajn ikona je cista umjetnost
POGREŠNO: Dizajn ikona je oblik samoizražavanja. O ukusima se ne raspravlja.
ISPRAVNO: Nitko ne preporuca korištenje ružne ikone ukoliko lijepa funkcionira jednako dobro, medutim ukoliko je funkcija zanemarena a ikone se koriste kao dekor korisnici su frustrirani.
Kako korisnik raspoznaje ikone ?
Iako možda djeluje malo suhoparno tematika medudjelovanja ikone i korisnika nikako ne smije biti zanemarena. Kako bi dizajnirali efektivne ikona potrebno je razumjeti kako ikone djeluju na korisnika odn. kako ikone “rade”.
Kako bi ikona bila efektivna korisnik s njom mora biti u mogucnosti napraviti cetiri postupka:
a) dekodirati ikonu - ovo je u osnovi postupak dekompozicije (ukoliko je ikona složenija) ikone u jednostavnije simbole te dalje u osnovne graficke elemente.
b) prepoznati znacenje – jednom kad je ikona naucena korisnik ju mora prepoznati odn. povezati ikonu i njeno znacenje.
c) pronaci ikonu – mogucnost brzog pronalaženja ikona na pretrpanom sucelju je kljucna ukoliko težimo što produktivnijem radu sa aplikacijom. Brzina kojom je korisnik u stanju pronaci ikonu na ekranu ovisi vecinom o dvije komponente: dali korisnik zna kako izgleda ikona koju traži i dali se tražena ikona vizualno istice od drugih ikona.
d) aktivirati ikonu – jednom kad korisnik pronade ikonu potrebno ju je aktivirati. Taj proces obuhvaca dva koraka: selekciju koju ikonu želimo aktivirati (obicno pomicanjem grafickog pokazivaca iznad ikone ili pokazivanjem na ikonu preko ekrana osjetljivog na dodir) i “okidanje” koje može biti provedeno na niz nacina ovisno o tome koji je gumb na mišu pritisnut, koliko dugo je pritisnut itd...
Ponekad je potrebno napraviti kompromise izmedu ova cetiri postupka no sva cetiri su potrebna u odredenoj mjeri.
Za dizajnera ikona ova cetiri koraka ustvari znace:
a) konstruirajte jednostavnu ikonu koja je vec povezana s konceptom koji predstavljate ili ukoliko ovo nije moguce predstavite koncept kao jednostavnu kombinaciju poznatih elemenata.
b) Odaberite jasnu ikonu koja snažno asocira na sve koncepte koje predstavlja
c) Osigurajte da korisnik može predvidjeti vizualne karakteristike ikone kao što su oblik i boja ikone koju traže
d) Uspostavite i konzistentno upotrebljavajte jednostavan i jedinstven sustav aktiviranja ikona.
Jednadžba razumijevanja znacenja iz ikone je jednostavna:
IKONA + KONTEKST + KORISNIKOV UM = ZNACENJE IKONE
Varijacija bilo koje od ovih varijabli daje drugo znacenje ikoni.
Kontekst predstavlja situaciju u kojoj korisnik gleda ikonu. Sastoji se od drugih stvari unutar sucelja koje korisnik vidi (tekstualnih
poruka, drugih ikona, prozora i sl.). Kontekst je sve ono što nas pokrece da interpretiramo ikonu na odreden nacin. Najcešci i najjace kontekstualno povezivanje je blizina drugih ikona npr.
samostalno postavljena ikona ima kontekst osobe, covjeka ili muškarca
medutim postavljena uz ikonu koja predstavlja žensku osobu naglašen je kontekst spola osobe odn. razlikovanje pojmova žena i muškarac
daljim dodavanjem moguce je dobiti kontekst obitelji i sl.
Korisnikov um dovršava znacenje ikone tako primjerice:
• ogranicenja percepcije filtriraju ulaz • interes i radoznalost kontroliraju pažnju • sjecanja upotpunjuju znacenje • emocije motiviraju itd...
Što jednadžba razumijevanja znacenja porucuje dizajneru ikona:
• ogranicite kontekst – kako je ne moguce ograniciti um korisnika (jer je vec ogranicen) te ukoliko je potrebno koristiti ikonu sa višestrukim znacenjem treba korisnika navoditi kroz kontekst
• testirajte na razlicitim korisnicima – jedini nacin da saznate dali su vaše ikone jasne je da provedete testiranje na više korisnika (ovo je osobito znacajno za ikone koje ovise o profesionalnom ili kulturnom predznanju)
• izbjegnite višeznacne ikone – ukoliko ikona ima višestruka znacenja izbjegavajte upotrebu
• Predvidite razmišljanje korisnika npr.
Koncept mjerenja predstavljamo:
korištenjem ikone ravnala za obicnog korisnika,
dok bi za inženjersku primjenu prikladnija bila pomicna mjerka ili nešto slicno.
Konacno ono što je vrlo bitno za dizajnera jest da se pri radu cešce postavlja kao krajnji korisnik nego kao dizajner.
Pravila dobrog dizajna korisnickog sucelja
Važnost dobrog dizajna sucelja
Korisnost dizajna vaše aplikacije nije samo filozofski aspekt koji trebate razmatrati, to je kljucni element uspjeha vaše aplikacije. Ulaganje u dizajn vaše aplikacije pridonosi ne samo zadržavanju postojecih korisnika vec i proširenju vaše korisnicke baze. Dakle ulaganje u dizajn direktno utjece na financijski prinos od vaše aplikacije.
Dobar primjer uticanja na dizajn je Windows platforma proizvoda, bez obzira na njihove druge karakteristike. Cinjenica je da sa danas za Windows platformu proizvodi više aplikacija nego za bilo koju drugu aplikaciju. Dodatna podrška za lokalizaciju i podršku korisnicima sa poteškocama znaci da današnje apl ikacije dopiru do daleko šire baze korisnika. Nove inicijative na podrucju hardwarea i softwarea cine racunala lakšim za korištenje i boljim za krajnje korisnika. Široka rasprostranjenost opcija kao što su standardni dijalozi za razlicite funkcije dovodi do smanjenog vremena privikavanja korisnika na rad s aplikacijom.
Jednostavnost
Usprkos popularnoj podršci za Windows platformu, postoje i dalje znacajne prepreke u pružanju najboljeg iskustva korisniku pri radu s aplikacijom. Racunala su i dalje previše složena za upotrebu i troškovi pružanja podrške korisnicima su i dalje visoki. Korisnici se cesto žale na obim opcija koje se nalaze u današnjim aplikacijama, osobito na cinjenicu da ne mogu naci opcije koje traže, dok za opcije koje su im dostupne ne znaju primjenu. Mnogi korisnici od racunala ocekuju jednaku jednostavnost upotrebe i predvidivost u radu koju nalaze kod bijele tehnike. Ocekuju da racunala rade na nacin koji im je blizak. Dakle jednostavnost dizajna ukljucuje probleme koje mora prihvatiti svatko tko se odluci dizajnirati aplikacije za širu grupu korisnika (vecu od jednog korisnika).
Ovdje cu pokušati objasniti neke osnovna pravila koja su temelj pravilne uporabe ikona u korisnickom sucelju.
Dizajnirate za ljude
Imajte na umu da je svrha svake aplikacije omoguciti odredenoj grupi ljudi da obavi zadani skup zadataka. Prva stvar koju trebate uciniti prilikom dizajna aplikacije je da ustanovite tko su vaši korisnici i koji skup zadataka im želite omoguciti da obavljaju. Primjerice razlikuju se pristupi potrebni dok dizajnirate aplikaciju koja bi trebala omoguciti inženjerima (softwarea, elektrotehnike ili strojarstva) da rade dijagrame ili aplikaciju koja djecu predškolskog uzrasta poducava matematiku.
Najvažnije je da poznajete vašu ciljnu grupu za koju razvijate dizajn aplikacije, kao i da razumijete njihove potrebe. Postoje dosta kvalitetne literature od strane profesionalnih dizajnera o metodama dizajna koje mogu pomoci u ovom procesu. Vecina ovih metoda uglavnom se svodi na specificne nacine razumijevanja vaših korisnika i zadataka u kojim im želite pomoci.
Proširite ciljnu grupu korisnika
Ukoliko dizajnirate aplikaciju koju ce koristiti inženjeri ili djeca ili sistemski administratori trebali biste se pobrinuti da aplikaciju mogu koristiti sve te tri grupe ukljucujuci prema mogucnostima i korisnike tih grupa s posebnim potrebama (invaliditet i sl.). Takoder se treba pobrinuti da je sucelje razumljivo i korisnicima koji ne vladaju vašim jezikom.
Dostupnost
Dostupnost podrazumijeva omogucavati korisnicima sa posebnim potrebama funkcionalno korištenje vašeg softwarea. Pri tome treba voditi racuna da vaš software može koristiti glasovna sucelja, citace ekrana, alternativne metode unosa i drugu tehnologiju za ispomoc. Vaš software bi trebali moci koristiti daltonisti što dijelom postižete izbjegavajuci upotrebu boje za prikaz kriticno važnih informacija. Isto tako korisnicima sa slušnim poteškocama izbjegavajuci korištenje samo zvucnih upozorenja.
Lokalizacija
Lokalizacija obuhvaca postupke dizajniranja softwarea koji može funkcionirati u razlicitim jezicnim okolinama. U stvarnosti to znaci prevodenje poruka, naziva i drugih elemenata sucelja aplikacije na drugi jezik.
Napravite vezu izmedu aplikacije i stvarnog svijeta
Vaša aplikacija trebala bi uvijek koristiti korisnikov jezik, rijeci, recenice i koncepte koji su poznati korisniku. Isto tako pojmovi koje koristite trebaju biti vezani uz korisnikovo shvacanje zadataka koje mora izvršiti koristeci vašu aplikaciju npr. u medicini papirnata omotnica koja sadrži informacije o pacijentu naziva se karton. Dakle medicinska aplikacija bi mogla koristiti naziv pacijentov karton umjesto korištenja naziva pacijentov zapis u bazi podataka.
Cesto možete iskoristiti korisnikovo poznavanje stvari u stvarnom svijetu upotrebom metafora npr. korištenjem poznatog koncepta koša za smece kako bi predstavili ideju brisanja datoteka. Naravno pri korištenju metafora potrebno je paziti da ne shvatit metaforu previše doslovno ili da previše proširite njezinu upotrebu preko njezine logicne upotrebe. Konkretno u nekim operativnim sustavima povlacenje ikone CD ROM diska u koš za smece izaziva izbacivanje ladice CD ROM-a.
Aplikacija treba biti dosljedna
Vaša aplikacija trebala bi biti dosljedna sa sobom kao i sa drugim aplikacijama kako u sucelju tako i u odnosu prema korisniku. Ovo je jedan od najcešcih i najvažnijih nacela dizajna, ali nažalost i jedan od najcešce zloupotrebljavanih principa. Svrha dosljednog odnosa prema korisniku je da mu se pruži prilika da primjeni svoje postojece razumijevanje rada sa racunalom i drugim aplikacijama. Time se skracuje vrijeme privikavanja na novu aplikaciju i stvara osjecaj ugodnosti
Korisnici trebaju znati što se dešava
Vaša aplikacija mora se pobrinuti da korisnik zna što se zbiva kroz prikladne povratne informacije. Korisnik ne smije nagadati o statusu aplikacije u bilo kojem trenutku. Cim korisnik izvede operaciju aplikacija bi trebala prijaviti da je primila korisnikov unos te da radi s njim. Feedback može biti vizualni, audio ili oba npr. promjene oblika kursorom, animirani indikatori toka, Beepovi ili poruke o greškama. Poruke o greškama trebaju koristiti jednostavan jezik , jasno iznijeti problem i ponuditi moguca rješenja ukoliko je moguce.
Aplikacija treba biti jednostavna
Aplikacija treba korisniku omoguciti da što jednostavnije obavi ono što treba, ništa više niti manje. Zato vaša aplikacija treba prikazivati samo korisne i relevantne informacije. Svaka dodatna informacija troši korisnikovu pozornost sa važnim informacijama. Dakle ne preopterecujte vaše sucelje sa pretjeranom kolicinom
nevažnih elemenata. Konacno bitno je da vaše sucelje bude estetski adekvatno napravljeno. Loše organizirano sucelje sa malim brojem elemenata može biti jednako loše kao i dobro organizirano sucelje sa prevelikom kolicinom informacija.
Korisnik treba imati kontrolu
Racunala postoje kako bi služila ljudima. Korisnik mora uvijek imati osjecaj kontrole nad racunalom. Ovo se osobito odnosi nad aplikacije koje znatno naprežu resurse racunala. Korisnik bi u bilo kojem trenutku trebao biti u mogucnosti prebacivati se izmedu razlicitih aplikacija. Takoder korisnik bi trebao biti u mogucnosti podešavati aplikaciju prema svojim osobnim potrebama, naravno i ovdje je bitno ne pretjerivati sa prevelikom slobodom prilagodbe.
Korisniku treba oprostiti grešku
Svi cinimo pogreške. Gdjegod je moguce korisnik bi trebao biti u mogucnosti jednostavno i lako da poništi svoje greške u radu s aplikacijom npr. korištenjem undo komande. U nekim slucajevima kad bi potencijalna akcija mogla biti opasna i ne postoji nacin za poništavanje ucinka komande, sucelje bi trebalo upozoriti korisnika i upitati ga za potvrdu komande. Ova vrsta potvrde može biti poprilicno iritantna za korisnika, do te mjere da ih korisnik pocne ignorirati, pa ju je poželjno koristiti samo u najekstremnijim slucajevima.
Pravila dobrog dizajna ikona Standardne ikone
Perspektiva i osvjetljenje
Traka sa ikonama i ikone na meniju bi trebale imate perspektivu postavljenu tako da ih promatramo od naprijed tj. kao da su ispred korisnika u visini ociju. Ovakva perspektiva daje traci sa ikonama plošni izgled. Osvjetljenje ukoliko je uopce potrebno trebalo bi dolaziti iz tocke iznad korisnikove glave bacajuci malu sjenku prema dolje.
Oblik
Pobrinite se da ikone na traci sa ikonama lako medusobno razlikuju. Pokušajte promatrati siluetu vaše trake sa alatima i provjerite da su ikone koje koristite na njoj vizualno dovoljno razlicite.
Silueta trake sa
ikonama
Velicina
Ikona na traci sa ikonama trebala bi biti dimenzija 24x24 pixela, dok bi ikone na izborniku trebale biti 16x16 pixela.
Primjer ikona sa trake i ikone
sa menija
Ukoliko se bavite dizajnom aplikacija cesto cete sami dizajnirati ikone za trake. Upotrebljavajuci postojece ikone ne samo da smanjujete kolicinu posla vec uspostavljate konzistentan "jezik ikona" na koji se korisnici vaših aplikacija privikavaju. Ipak i ovdje treba paziti što stavljate na traku sa alatima da ne zbunite korisnika.
Ikone za aplikacije
Perspektiva i osvjetljenje
Ikone u aplikaciji trebale bi imati perspektivu kao da su postavljene na stol ispred korisnika. Svijetlo bi trebalo dolaziti iz gornjeg lijevog ugla, bacajuci sjenu na vrh imaginarnog stola.
Oblik
Ikone u aplikaciji trebale bi biti raznolikog oblika prije nego pravokutne ili kvadraticne kako bi bile vizualno što privlacnije.
Velicina
Ikone u aplikaciji trebale bi biti dimenzija 48x48 pixela, no provjerite i raspoznatljivost u manjim velicinama kako bi osigurali skalabilnost.
Primjer ikone za instalaciju aplikacije
Ikone dokumenata
Perspektiva i osvjetljenje
Ikone dokumenata trebale bi imati perspektivu kao da su postavljene na stol ispred korisnika. Svijetlo bi trebalo dolaziti iz gornjeg lijevog ugla bacajuci sjenu na imaginarni stol.
Oblik
Ikone dokumenata nemaju nikakve specificne zahtjeve spram oblika. Kad dokument odgovara odredenoj aplikaciji, jedna mogucnost je da koristite kombinaciju papira i ikone aplikacije. Bolje rješenje je da direktno ikonom opišete tip dokumenta npr. ikona filmskog projektora za MPEG video format.
Velicina
Ikone dokumenata bi po mogucnosti trebale biti napravljene u barem tri velicine 24x24, 48x48 i 96x96 pixela.
Ikone imaju puno primjena. One mogu pomoci korisniku da analizira veliki broj objekata kako bi brzo pronašao traženi objekt. Osobito nakon što se korisnik priviknuo na odredeni izgled ikone tada ju nalazi lakše nego što bi pronašao njezin tekstualni naziv. Ikone mogu nadopuniti tekst npr. u izbornicima ili pružajuci vizualnu sugestiju za namjenu nekog objekta. Ikone pružaju kompaktno predstavljanje velikog broja funkcija osobito kada ja prostor oskudan. Ovo je osobito vidljivo u primjeni traka sa ikonama (toolbar).
Ikone bi trebale graficki biti visokog kontrasta i razlicite. NAPOMENA: Ponekad je dizajn ikona lakše zapoceti u jednom tonu, te dodavati boju kad ste zadovoljni sa dizajnom. Na ovaj nacin izbjegavate da ikone ovise o boji, što je bitno za korisnike koji imaju ogranicene mogucnosti prikaza boje ili možda slabije percipiraju neke boje.
Tipovi ikona
Ukoliko je moguce pri dizajnu ikona preporuca se korištenje funkcionalno sugestivnih ikona, ukoliko to nije moguce preporuca se korištenje ikona sugestivnih imenom, tek ukoliko ni to nije moguce koristite tekstualne ikone i druge ocajnicke alternative.
Funkcionalno sugestivne ikone
Ikone bi ukoliko je to moguce trebale biti sugestivne prema funkcijama uz koje se vezuju. Najbolja ikona ce sugerirati korisniku njezinu primarnu svrhu bez potrebe za dodatnim opisom. Korisnici raspoznaju znacenje funkcionalno sugestivnih ikona brže od ostalih tipova ikona pošto njih direktno mogu asocirati uz odredeni objekt ili akciju.
Funkcionalno sugestivna ikona za tekst procesor
Funkcionalno sugestivna ikona za
funkciju podvlacenja
Ikone sa sugestivnim imenom
Neke ikone kao što je ikona Nautilusa ne sugeriraju funkciju programa, vec umjesto toga sugeriraju ime programa. Ovo je manje poželjno od funkcionalno sugestivnih ikona, pošto se dodaje dodatni stupanj apstrakcije (umjesto asociranja funkcije upravljanja sa datotekama, predstavlja se naziv aplikacije koja to obavlja sa slikom nautilusove školjke. Dodatna je poteškoca korisnicima koji ne poznaju naziv prikazane školjke ili naziv same aplikacije.
Imenom sugestivna ikona "Nautilus"
Tekstualne ikone
Ikone koje sadrže tekst naziva programa u sebi nazivamo tekstualnim ikonama. One ustvari ne sadrže nikakvu metaforu ili sliku koju bi korisnik mogao povezati sa namjenom te su zapravo teže za citanje od popratnog naziva. Obzirom da ikone privlace pogled korisnika ikona koju je teško prepoznati je potencijalno gora od nedostatka ikone. Dodatna poteškoca kod ikona sa tekstom je da ih je teško lokalizirati za neko drugo tržište obzirom da ovise o jeziku. Ukoliko vec morate koristiti tekst na ikoni pokušajte da ne koristite rijeci koje su teško prevodive na druge jezike.
Tekstualna ikona za Gedit tekstualni editor
Slucajne ikone
Slucajne ikone nemaju nikakvu asocijaciju sa programom (izuzev možda neku cudnu vezu u glavi dizajnera). Ovakve ikone ne treba nikad koristiti, a ukoliko ih koristite najvjerojatnije ce samo zbunjivati i obeshrabriti korisnika. Uloga ikone nije da izgleda lijepo, ovo je ustvari samo vrlo poželjna osobina. Logo tvrtke Sodipodi je vjeverica koju koriste kao njihovu ikonu. Medutim pošto njihov logo nema nikakvu ocitu vezu sa korisnikom vjeverica predstavlja lošu ikonu. Pri oblikovanju ikone pobrinite se da ne koristite informacije koje korisnik ne zna.
Slucajna ikona za SodiPodi
Problemi sa ikonama
Preopterecenje sucelja
Zapamtite da je ekran racunala glavno radno podrucje za korisnika, to nije mjesto natjecanja za korisnikovu pažnju. Kada aplikacije neprikladno koriste standardne elemente Windows sucelja kao što je Start meni, desktop ili trake sa ikonama to postaje neprikladno korisniku i smanjuje korisnikovu produktivnost. Desktop je još jedno podrucje gdje vrijedi manje je više. Uz izuzetak vrlo važnih ikona opce primjene izbjegavajte kreiranje ikona na desktopu. Testovi korisnosti stalno pokazuju da korisnici smatraju desktop svojim podrucjem i negativno reagiraju na neocekivanu pojavu ikona na desktopu. Kad smo to razjasnili preporuka je da korisniku pružite opciju postavljanja ikone vaše aplikacije na desktop (zlatno pravilo racunalnog dizajna je: Prebacite odluku na korisnika.).
Preopterecenje informacijama
Ikone ce cesto biti prikazane u manjem formatu nego što ste predvidjeli. Previše informacija na ikoni cini ju necitkom, osobito kad se prikazuje u manjem formatu. Isto tako previše informacija na ikoni zbunjuje korisnika.
Primjerice u testovima korisnika za Evolution ikonu vecina korisnika je pretpostavila da ona pokrece tekst procesor. Zbunilo ih je pojavljivanje olovke i papira, koje se može smatrati dodatnom. ali i nepotrebnom informacijom obzirom da se implicitno može pretpostaviti da ce vam E-mail aplikacija pružati mogucnost pisanja poruka. Kvalitetnija ikona bi bila jednostavna omotnica. Primarno bi
na umu dizajnera trebala biti jednostavnost i minimalna kolicina elemenata potrebna da se izrazi funkcija programa.
Preopterecenje ikone informacijama - ikona Evolution
Gnumeric ikona je izvrsna ikona izuzev dodatka vizualnog šuma u obliku dodatnog papira sa slovom g u pozadini. Taj dodatak ne pruža nikakvu dodatnu vrijednost ikoni, ali zato dodaje vizualnu distrakciju. U ovom je slucaju ucinak dodavanja ikoni uglavnom negativan, iako neznatno. Oduzimanjem tog dodatnog papira dobijemo jednostavniju ikonu te puno više prostora za uvecati postojeca dva vizualna elementa.
Dobar primjer višestruke informacije - ikona tablicnog kalkulatora
Korištenje dijelova tijela
Ukoliko planirate da se vaša aplikacija koristi drugdje u svijetu, potrebno je izbjegavati simboliku koja je potencijalno uvredljiva drugim kulturama. Najbrojniji uzroci uvredljive simbolike je korištenje razlicitih dijelova tijela. Osim uvredljivih gesta sa prstima ili rukama, dijelovi tijela koji se smatraju pristojnim u jednoj kulturi npr. oci smatrat ce se neukusnim ili nepristojnim drugim kulturama. Najcešce se dijelovi tijela koriste kao ispomoc lošim metaforama tako što pokazuju na odredeni dio ikone ili sugeriraju da korisnik nešto koristi tako da ih je uglavnom jednostavno ukloniti pravim izborom metafore. Korisnici ionako ikonu razumijevaju u odnosu prema njima npr. korisnik koji vidi ikonu neke alatke shvatiti ce to kao da on koristi tu alatku tako da je cesto nepotrebno takav odnos dodatno pojašnjavati. Primjer nepotrebnog korištenja dijelova tijela je ikona za odabir fonta koja se može popraviti jednostavnim uklanjanjem prsta i koncentriranjem metafore na odabir fonta..
Korištenje dijelova tijela - ikona za odabir fonta
Korištenje dijelova tijela - bolja verzija ikone za
odabir fonta
Ikone temeljene na igrama rijeci
Igre rijecima treba izbjegavati po svaku cijenu iz više razloga. Jedan od ocitih razloga je da ih je nemoguce prevoditi npr. ikona koje predstavlja komad drveta (engl. log) koristi se kako bi predstavili dnevnik (takoder engl. logbook) sustava. Naravno ovo ikona ne znaci ništa nekome tko ne govori engleski. Dodatno vecina korisnika ne shvaca igre rijecima sve dok nije prekasno da bi im ikona pomogla, a i kad shvate takva asocijacija im ne pomaže u brzom ponovnom pronalaženju ikone obzirom da se moraju ponovno prisjetiti o kakvoj se igri rijeci radilo. Jedna od popularnijih ikona sredinom 90ih koja prikazuje taj problem je ikona paukove mreže koja je dugo korištena da predstavi pojam Interneta odn. World Wide Weba (engl. web znaci mreža).
Ikona temeljena na igri rijeci - ikona za
System log
Nasilne ikone
Kao što rijeci ubij ili uništi nisu prikladne u suceljima, ikone koje sadrže destruktivnu simboliku treba izbjegavati. "Shut down" ikona za gašenje operativnog sustava koristi prikaz detonatora eksplozivne naprave, vjerojatno u pokušaju da prenese ideju naglog završetka rada. Medutim ova ikona ce vrlo vjerojatno uplašiti mnoge korisnike koji ce ju izbjegavati iz straha od uništenja ili kvara nekog dijela sustava.
Destruktivna ikona - za gašenje operativnog sustava
Ovo su samo neka od pravila dobrog dizajna ikona. S vremenom razviti cete vlastiti stil dizajniranja ikona i vecinu ovih pravila primjenjivati cete bez razmišljanja.
Dizajn trake sa ikonama (toolbar-a)
Traka sa ikonama sadrži skup ikona sa cestim funkcijama kojima želimo olakšati pristup. Vecina traka sa ikonama sadrže iskljucivo
ikone, no složenije aplikacije isto tako na trakama sadrže druge tipove kontrola (liste, dropdown kontrole itd...). Kvalitetan dizajn trake sa ikonama ubrzava korisnikov rad dajuci mu direktan pristup funkcijama koje bi inace bile skrivene unutar menija. Ipak potrebno je napomenuti da se na trake sa alatima stavljaju samo najvažnije funkcije. Isto tako prevelik broj traka sa ikonama smanjuje efikasnost i kolicinu prostora na ekranu.
Primjer tri trake sa ikonama koje koristi e-mail aplikacija, web preglednik i editor teksta.
Izgled i sadržaj
Efikasnost traka sa ikonama se povecava ukoliko održavamo njihovu konzistentnost izmedu razlicitih aplikacija. Traka sa ikonama je prva stvar koju ce korisnik ugledati pri pokretanju aplikacije, tako da ukoliko mu je traka sa ikonama vec poznata to mu odmah pruža dodatan osjecaj sigurnosti u korištenju aplikacije. Pri dizajniranju traka sa ikonama pratite ovdje navedena pravila i slijedite primjere vec postojecih kvalitetno dizajniranih aplikacija. Nacelno bi trebala postojati jedna glavna traka sa ikonama koja pruža pristup opcim funkcijama u aplikaciji. Velik broj ikona na ovoj traci ce biti isti na gotovo svim aplikacijama.
Primjerice glavna traka sa ikonama u uredskoj aplikaciji trebala bi gotovo uvijek sadržavati New, Open i Save as kao prve tri ikone na traci. Slicno tome prve ikone u web pretraživacu trebale bi biti ekvivalenti Back, Forward, Stop i Reload funkcija u tom redoslijedu.
Preporuke:
• postavljajte samo najcešce korištene funkcije aplikacije na traku sa ikonama. Nemojte samo dodavati ikone za svaku funkciju
• Standardno bi se vaša traka sa ikonama trebala nalaziti ispod glavnog menija.
• Dopustite korisniku opciju uklanjanja traka sa ikonama. • Sve funkcije koje su na traci sa ikonama moraju biti dostupne
i preko menija. • Ikone na traci slažite istim redoslijedom kao i njihove
ekvivalente na menijima. Posebice grupirajte skupine ikona koje se medusobno iskljucuju npr. zoom in i zoom out ili cut i paste
• Ne stavljajte ikone sa Help ili Quit funkcijama pošto se one rijetko koriste i prostor je bolje iskoristiti korisnijim funkcijama.
• Pružite dodatne mogucnosti prikaza ikona na traci kao samo ikone, samo tekst ili ikone sa tekstualnim opisom.
• Dopustite korisnicima mogucnost konfiguracije trake sa ikonama u bilo kojem redoslijedu koji korisniku odgovara
• Pohranite konfiguraciju trake sa ikonama zajedno sa drugim postavkama vaše aplikacije tako da je i nakon reinstalacije aplikacije moguce koristiti iste postavke.
Upravljanje trakom sa ikonama
Za svaku traku sa ikonama u vašoj aplikaciji korisnik bi trebao moci odabrati dali ju želi prikazati ili ne, kao i na koji nacin ju želi prikazati (samo ikone, samo tekst ili ikone sa tekstualnim opisom).
Preporuke:
• Omogucite korisniku promjenu standardnih postavki trake sa ikonama odn. mogucnost konfiguriranja trake sa ikonama osobito:
o mogucnost odvojenog uklanjanja prikaza pojedinih traka sa ikonama
o odvojeni odabir nacina prikaza za svaku od traka o mogucnost povratka na standardne postavke za sve
trake • Ukoliko je moguce korisniku pružite mogucnost vizualnog drag
and drop konfiguriranja traka sa ikonama npr. mogucnost da mišem rucno premjesti pojedine ikone na traci ili mogucnost da sa menija povuce pojedine funkcije na traku sa ikonama.
Nazivi ikona
Velik broj ikona koje ce biti na traci sa ikonama zahtijevati ce tekstualni opis ispod ili pored ikone. Ovo bi uglavnom trebala biti jedna rijec koja opisuje funkciju koju vrši spomenuta ikona.
Svaka ikona na traci trebala bi imati oblacic sa dodatnim pojašnjenjem funkcije (tooltip) te ikone bez obzira dali ikona ima tekstualni opis pored nje.
Preporuke:
• Ukoliko je traka sa ikonama postavljena da prikazuje nazive ispod ikone, prikažite nazive za svaku ikonu npr.
Primjer trake sa ikonama uz nazive ispod svih ikona
• Ukoliko je vaša traka sa ikonama konfigurirana da prikazuje nazive pored ikone, nemojte prikazivati nazive za svaku ikonu, vec samo za one najbitnije te dodajte separatore izmedu njih obzirom da uz ovakav nacin prikaza necete imati dovoljno mjesta na traci za sve nazive.
Primjer trake sa ikonama uz nazive pored važnijih ikona
• Pobrinite se da sve ikone imaju opis u oblacicu koji se javlja svaki put kad se pokazivac zaustavi duže iznad pojedine ikone. Za ikone koje imaju ekvivalente u menijima neka opis u oblacicu bude jednak onom na meniju.
• Za nazive i opise ikona na traci uvijek ucinite prvo slovo velikim, ovo pomaže kod razlikovanja ikona.
Standardizacija ikona Obzirom da su danas ikone postale kljucni djelic u ogromnoj industriji pojavila se potreba za uvodenjem standarda i u ovom podrucju. Problem standardizacije ikona je što one za korisnika predstavljaju svojevrstan jezik kojim komuniciraju sa aplikacijama i racunalom, tako da je za razlicita podrucja primjene potrebno koristiti potpuno razlicite rjecnike. Analogija sa jezikom je primjenjiva i sa strane velikih društvenih razlika u razumijevanju pojedinih simbola u
razlicitim kulturama. Dodatno je situacija pogoršana kreiranjem proizvodackih ikona koje su u masovnoj upotrebi usprkos svojoj neupotrebljivosti i odstupanju od opcih nacela dizajna. Takvi proizvodacki "standardi" namecu se u upotrebi uglavnom širokom korisnickom bazom svojih proizvoda. Takav loš primjer predstavljaju ikone u operativnim sustavima Windows.
Moj zakljucak je da smo što se standardizacije ikona tice sve dalje od nekog opceg standarda, medutim u nekim podrucjima primjene standardizacija postaje nužna, pa se postupno i primjenjuje. Dobar primjer ovakve standardizacije je naveden standard ikona za primjenu u bibligrafskim bazama podataka.
ISO/IEC 11581 standard
Standard za funkcije simbola i ikona u korisnickim suceljima.
ISO/IEC 11581 primjenjuje se na uredske aplikacije applies za proizvodnju dokumenata, tisak i prijelom, financije itd. ISO/IEC 11581 odnosi se na proizvode za ljude koji su upuceni na uredski rad no trenutno nisu nužno upoznati sa radom na racunalu. ISO/IEC 11581 trebao bi služiti osobama koje su ukljucene u dizajn, implementaciju i procjenu ikona za graficka korisnicka sucelja na racunalnim aplikacijama.
Ovdje navodim dijelove odn. poglavlja ukljucena u standard ISO/IEC 11581:
1. Ikone - Opcenito 2. Ikone objekata 3. Pokazivaci 4. Kontrolne ikone 5. Ikone alata 6. Akcijske ikone
Ovdje možete skinuti PDF datoteku sa specifikacijom ISO/IEC 11581 standarda
ISO/IEC 13251 standard
Medunarodni standard koji skuplja u jednom dokumentu kolekciju postojecih simbola. Preko 370 simbola je ukljuceno u ISO/IEC 13251 standard, simboli su skupljeni iz izvora kao što su:
• ISO/IEC 9995-7: 1994, Informacijska tehnologija - opisi izgleda tipkovnica za uredske sustave - opisuje simbole koji se koriste za opis funkcija u uredskim sustavima.
• ISO 7000: 1989, Graficki simboli za korištenje na uredskoj opremi - Indeks i sinopsis postojecih simbola
• ITU-T E121: 1996, Piktogrami i simboli za pomoc korisnicima telefonskih usluga
• ISO/IEC 6329: 1989, Duplikatori i kopirni uredaji - korišteni simboli (standard ce uskoro biti povucen)
• ISO 4062: 1977, Oprema za snimanje - korišteni simboli (standard ce uskoro biti povucen)
Konacni prijedlog medunarodnog standarda ili Final Draft International Standard (FDIS) za ISO/IEC 13251 je dovršen od strane ISO/IEC JTC 1/SC 35/WG 3 i uskoro ide na medunarodno izglasavanje.
ISO/IEC 18035 standard
Ovaj medunarodni standard ce definirati konzistentan set ikona za popratne funkcije multimedijalnih aplikacija na racunalnom ekranu. Ove kontrolne ikone tipicno predstavljaju akciju po asocijaciji sa konvencionalnim kontrolama na uredajima za reprodukciju razlicitih sadržaja (npr. video i CD uredaji).
Standard ce pružiti konzistentan skup kontrola za akcije kao: Play, Pause/Resume, Stop, Record, Skip back, Rewind, Fast forward, Skip forward, Preview, Volume control, Pan i Zoom. Ovaj standard bi trebao biti dodatak drugom dijelu ISO 14915 standarda koji opisuje ergonomiju softvera za multimedijlna sucelja.
ISO/IEC 18036 standard
Ovaj medunarodni standard ce definirati konzistentan skup ikona za popratne funkcije Web preglednika na racunalnim ekranima. Ove ikone obicno predstavljaju funkcije i akcije preko asocijacije sa objektima u stvarnosti.
Standard bi trebao pružiti konzistentan skup kontrola za funkcije kao što su: Back, Forward, Stop, Refresh/Reload, Home, Search, Favourites/Bookmarks, Guide, Print, Security, Download i History.
Prvi prijedlog radne skupine ili Committee Draft (CD) nije prihvacen. Drugi prijedlog ce biti uskoro pripremljen i dan na glasanje.
Standardni skup ikona za primjenu u bibliografskim bazama podataka
Ovdje je naveden predloženi skup ikona za upotrebu u bibliografskim bazama podataka. Ove ikone su u javnom vlasništvu tako da su slobodne za korištenje za sve. Ukoliko želite ikone možete downloadati na ovom linku.
Kategorija : Akcije
Ikona Znacenje
Home - Kuci Povratak na glavnu stranicu ili ekran
Menu - Izbornik Prikaz glavnog izbornika
Change Language - Promjena jezika Promjena korištenog jezika (jezik predstavlja zastava unutar balona)
Information - Informacije Prikaz informacija o sustavu
Help - Pomoc Pomoc nad trenutnim zadatkom
Find - Traži Pretraživanje odredenog skupa dokumenata
Browse - Pregled Pregled odredenog indexa
Thesaurus - Rijecnik sinonima Prikaz rjecnika istoznacnih rijeci
Limit - Ogranicenje Ogranicava broj vracenih rezultata pretraživanja
Location - Lokacija Prikazuje informaciju o lokaciji traženog sadržaja (URL ili broj police)
Move to first record - Skoci na prvi zapis Pomice korisnika na prvi zapis u trenutnom skupu zapisa
Move to last record - Skoci na zadnji zapis Pomice korisnika na zadnji zapis u trenutnom skupu zapisa
Forward - Naprijed Pomice korisnika na sljedeci zapis u trenutnom skupu zapisa
Back - Nazad Pomice korisnika na prethodni zapis u trenutnom skupu zapisa
Fast Forward - Preskoci unaprijed Preskace odredeni broj zapisa naprijed u trenutnom skupu zapisa
Fast Reverse - Preskoci unazad Preskace odredeni broj zapisa unazad u trenutnom skupu zapisa
Clear - Obriši Obriši trenutne informacije
Expand Display - Povecaj prikaz Proširuje trenutni prikaz npr. prikaz na cijelom ekranu
Contract Display - Smanji prikaz Smanjuje trenutni prikaz
Brief List - Kratka lista Prikaz kratke liste rezultata pretraživanja
Full record - Cjeli zapis Prikaz cjelokupnog zapisa o odredenom sadržaju
Show - Prikaži Prikazuje npr. rezultate pretrage obzirom da ih neki sustavi ne prikazuju odmah
Print - Ispiši Ispisuje trenutni prikaz na štampacu
Save - Pohrani Pohranjuje podatke na medij
Kategorija : Polja
Ikona Znacenje
Author Autor
Bibliographic Database Bibliografska baza podataka
Citation / Journal Reference Citat / Referenca
ISBN International Standard Book Number
ISSN International Standard Serial Number
Keyword Kljucna rijec ili rijec za pretraživanje
Subject Tema
Title Naslov
Year Godina izdavanja
Kategorija : Operatori
Ikona Znacenje
Greater than Veci od
Less than Manji od
Less than or Equal to Manji ili jednak
Greater than or Equal to Veci ili jednak
Equal to Jednak
NOT equal to Nije jednak
AND Logicki operator I
OR Logicki operator ILI
NOT Logicki operator negacije
Projekt standardizacije sucelja za rad sa bazama podataka je program u sklopu IFLA Section on Information Tech nology.
Dizajn ikona za operativni sustav Windows XP
U ovom dijelu pokušat cu ukratko prikazati proces dizajna i izrade ikona koje su namijenjene Windows XP operativnom sustavu odn. konzistentne su s novim suceljem ovog operativnog sustava.
Osnovne karakteristike Windows XP ikona
1. Bogate boje komplementarne sa izgledom Windows XP sucelja.
2. Kut i perspektiva su dinamicni tako da ikone izgledaju energicnije.
3. Rubovi i kutovi elemenata na ikoni su meki i blago zaobljeni. 4. Izvor svjetla dolazi iz gornjeg lijevog ugla uz dodatak
ambijentalnog svijetla koje osvjetljava druge dijelove ikone. 5. Upotreba gradijenta pruža osjecaj dimenzije i obogacuje
izgled ikone. 6. Bacena sjena daje kontrast i dimenzije ikoni. 7. Rubovi daju dodatnu jasnocu. 8. Svakodnevni predmeti imaju moderniji izgled npr. racunalo
Velicine ikona
Postoje 4 velicine Windows ikona 48x48, 32x32, 24x24 i 16x16 pixela.
Preporuka je da ikona sadrži ove 3 velicine: 48x48, 32x32 i 16x16 pixela.
Ikone na desnoj strani Start menija su velicine 24x24 pa ovu velicinu nije nužno ukljuciti.
Ukoliko dizajnirate ikone za traku sa alatima odn. toolbar, standardne velicine su 24x24 i 16x16 pixela.
Dubina boja ikona
Windows XP podržava 32-bitne ikone koje su 24-bitne slike sa 8-bitnim alpha kanalom. Ovo omogucava prikaz sa mekanim rubovima koji se stapaju u bilo koju pozadinu.
Svaka Windows XP ikona trebala bi sadržavati ove 3 dubine boje kako bi bile podržane razliciti nacini prikaza na ekranu:
• 24-bit sa 8-bit alpha kanalom (32-bit) • 8-bit (256 boja) sa 1-bitnom transparencijom • 4-bit (16 boja) sa 1-bitnom transparencijom
Kut i grupiranje objekata
Ovo je perspektivna projekcija koju koriste Windows XP ikone:
No svih objekti ne izgledaju dobro prikazani pod tim uglom u 16x16 dimenzijama pa se sljedeci objekti obicno prikazuju ravno:
1. Ikone dokumenata. 2. Ikone koje su simboli npr. upozorenja ili informacije. 3. Ikone koje nisu prepoznatljive pod tim uglom npr.
povecalo.
Ukoliko vaša ikona sadrži objekte koji se preklapaju, trebate i njih postaviti pod kutom uz izuzetke vec navedenih objekata koji neprikladno izgledaju prikazani pod uglom. Isto tako razmotrite kako ce vaše ikone izgledati kao skup te prema tome odlucite kako grupirati objekte na njima.
Sjene na ikonama
Windows XP ikone koriste efekt sjena kako bi pružili dodatnu dimenziju. Efekt se dodaje u Photoshopu kao Drop Shadow efekt nakon što ste u Photoshopu selektirali layer slike. Parametri su:
angle: 135 distance: 2
size: 2 boja: black opacity: 75%
Postupak dizajna ikona za Windows XP
Korak 1. Koncept
Pri dizajnu novih ikona preporuca se skiciranje ideja na papir.
Ovdje se vidi primjer inicijalnog dizajna Windows XP ikone za My Pictures folder.
Napomene i savjeti za dizajn ikona:
1. Koristite vec utvrdene koncepte gdje je to moguce kako bi osigurali konzistentno znacenje ikone za korisnika tj. ne otkrivajte toplu vodu.
2. Razmotrite kako ce ikona izgledati u kontekstu vašeg korisnickog sucelja odn. kako ce funkcionirati sa drugim ikonama.
3. Razmotrite kulturne aspekte djelovanja ikone. U razlicitim kulturama javljaju se razna tumacenja simbola. Dobro pravilo je izbjegavati korištenje slova, rijeci, ruku ili lica na ikonama. Ljude pokušajte na ikonama dizajnirati što opcenitije.
4. Kad je ikona nešto složenija npr. kombinirana od više objekata, razmislite kako ce slika izgledati u manjim velicinama. Ukoliko je moguce ne koristite više od tri objekta po ikoni. Za velicinu 16x16 razmotrite mogucnost pojednostavljivanja ikone kako bi bila što prepoznatljiva.
Napomena: Samo ikone koje Microsoft distribuira sa svojim proizvodima smiju koristiti Windows logo sa zastavom. Ne koristite ga u svojim ikonama ili ...
Najcešce ikone :
Najcešce ikone na toolbar-ovima :
Korak 2: Ilustracija
Za ilustraciju Windows XP ikona preporuka je da se koristi vektorski graficki alat npr. Freehand ili Illustrator. Pridržavajte se palete i karakteristika koje su navedene za Windows XP ikone.
1. Illustrirajte sliku koristeci Freehand ili Illustrator. 2. Napravite tri velicine slike, obzirom da ce se sjena dodavati
ikonama kasnije. Velicine bi trebale biti oko 46x46, 30x30 i 14x14 piksela.
3. Prenesite (Copy/paste) vektorske slike u Photoshop.
Korak 3: Kreiranje 24-bitnih slika
Nakon što ste unijeli vektorske slike u Photoshop, sljedeci korak je da dovršite sliku.
1. Nakon što ste ubacili vaše 3 velicine u Photoshop, provjerite citljivost i rezoluciju vaših slika osobito na velicine 16x16. Ponekad je potrebno dorada ikona na nivou pixela. Ukoliko je 16x16 necitka moguce je pojednostavniti osnovni dizajn u Freehandu.
2. Dodajte drop shadow efekt vašim slikama dvostrukim klikom na sloj (layer) slike i odabirom opcije Drop Shadow. Nakon toga podesite kut na 135, udaljenost i velicinu na 2 te opacity na 75%.
3. Kako biste spojili drop shadow efekt i 24-bitne slike, kreirajte
novi prazan sloj te u Layers meniju, odaberite Merge Visible i tako spojite 3 postojeca sloja zajedno.
4. Kreirajte 3 nove Phtotoshop datoteke, jednu za svaku
velicinu: 48x48, 32x32 i 16x16 pikela. Kopirajte i ubacite odgovarajuci dio glavne slike u otvorene. Ukoliko izgubite dio sjene na ikoni vratite se u Freehand i ponovite postupak.
5. Pohranite svaku datoteku kao .psd datoteku. Nikako nemojte stapati sliku sa Pozadina slojem.
Korak 4: Kreiranje 8-bitnih i 4-bitnih slika
Sada kada imate 24-bitne slike spremne da ih pretvorite u 32-bitne ikone, trebate napraviti 8-bitne verzije. 8-bitne ikone bit ce prikazane u svim nacinima prikaza koji su manje dubine od 32-bita.
8-bitne verzije nece imati 8-bit alfa kanal. Rubove ce im trebati ocistiti pošto nema anti-aliasinga tako da ce im rubovi biti nepravilni.
1. U Photoshopu, napravite kopiju vašeg 24-bitnog sloja slike i preimenujte sloj za 8-bitne slike.
2. Napravite novi prazan sloj i popunite ga sa tamnom bojom npr. plavom.
3. Spojite 8-bitni sloj slike sa novim slojem. 4. Pocistite rubove uklanjajuci anti-aliased piksele. Koristite
konzistentno stepenovanje ravnih rubova da se njihova nepravilnost što manje osjeti.
5. Provjerite kao slika izgleda na svjetloj pozadini.
6. Napravite 3 nove Photoshop datoteke za svaku od velicina:
48x48, 32x32 i 16x16 piksela. Kopirajte i ubacite odgovarajuce velicine u datoteke.
7. Sljedece trebate napraviti indeks slika na 256 boja. 8-bitne ikone mogu imati višestruke palete boja.
1. Uzmite vašu 48x48 sliku i popunite pozadinsku boju sa nekom bojom koju ne koristite na slici. Windows XP ikone cesto koriste za to boju magenta (R255 G0 B255).
2. Idite na Image>Mode>Indexed Color i odaberite Flatten Layers.
3. U izborniku Palette, odaberite Custom. U Custom dijalogu, kliknite na OK. Kliknite na OK u Indexed Color dijalogu.
4. Pohranite datoteku sa ekstenzijom .psd 5. Pohranite druge dvije velicine koristeci istu boju
pozadine. 8. Pohranite svaku datoteku sa ekstenzijom .psd
Ukoliko želite da vaše ikone izgledaju dobro i na starijim verzijama Windowsa, napravite verzije ikona sa 16 boja.
1. Indeksirajte vaše 8-bitne slike na Windows paletu od 16 boja. 2. Ocistite vaše slike koristeci samo boje iz palette. 3. Koristite crni rub na donjem i desnom rubu slike. 4. Koristite tamno sivu ili tamnu boju ruba za lijevi i gornji rub
slike. 5. Pohranite tri velicine koristeci istu boju pozadine. Pobrinite se
da pozadinska boja nije na slici jer to ce biti transparentna boja.
Korak 5: Izrada .ico datoteka
Jednom kad ste napravili sve potrebne slike, vrijeme je da ih skupite u .ico datoteku. Da bi kreirali 32-bitne ikone, koristimo program Gif Movie Gear (GMG) koji možete skinuti sa stranica www.gamani.com/forikone.
Ovi koraci vas vode kroz postupak kreiranja tipicne .ico datoteke koja sadrži 3 velicine ikona i 3 dubine boja.
1. Trebali biste imati ukupno 9 datoteka tj. 3 velicine po dubini: 48x48 na 24 bita 32x32 na 24 bita 16x16 at 24 bita 48x48 na 8 bita 32x32 na 8 bita 16x16 na 8 bita 48x48 na 4 bita 32x32 na 4 bita 16x16 na 4 bita
2. Otvorite Gif Movie Gear (GMG) i jednostavno povucite svaku od slika u prozor (ili koristite File>Insert Frames). Svaka slika ce postati jedan frame frame.
3. Kad povucete 24-bitne slike (ili bilo koju .psd datoteku sa više slojeva) u GMG pojaviti ce se sljedeci dijalog:
Provjerite da su postavke: Layers as multiple frames, No blending, i Keep background transparency ukljucene.
4. Pozadinski sloj svake od 24-bitnih slika ce se pojaviti kao frame. Uklonite ove suvišne frameove brišuci ih sa Delete tipkom.
5. Sada biste trebali imati ukupno 9 frameova. Ikone bi trebale biti poredane prema dubini boja i rezoluciji: prve tri su 4-bitne (16 boja), sljedece tri 8-bitne (256 boja), i posljednje tri su
24-bitne sa 8-bitnim alfa kanalom (ukupno 32-bita).
6. Za 8-bitne i 4-bitne verzije, trebate naciniti pozadinu
prozirnom. GMG program koristi limun zelenu boju da bi predstavio nevidljivu boju iako ovu boju možete i sami promijeniti.
7. Da napravite 8-bitnu i 4-bitnu verziju ikona transparentnim: 1. Odaberite frame i kliknite na kapaljku na traci sa
alatima (Pick Transparency Color ikona).
2. Sa kapaljkom, kliknite na pozadinsku boju ikone. Ova
boja ce se promijeniti u limun zelenu (ili vec koju boju ste izabrali da predstavlja pozadinu).
3. Ponovite ovo za sve 4-bitne i 8-bitne frameove.
8. Pohranite ikonu. File>Save Icon As…
Kreiranje trake sa alatima (toolbar)
U Windowsima traka sa alatima sadrži ikone istog stila kao i druge osim što one ne koriste efekt bacanja sjene. Pošto su trake sa alatima relativno male velicine preporuka je da slike budu što jednostavnije. Ukoliko se pojednostavljuje izgled ikone možete dizajnirati bez perspektive.
Windows traka sa alatima prikazuje 2velicine: 24x24 i 16x16 piksela. Pored toga postoje 2 stanja: default i hot (mouseover) stanje. Za hot state, blago povecamo nivo zasicenja boja (saturacije) slika.
Postupak kreiranja ikona za traku sa alatima je vrlo slican vec opisanim postupcima osim što se slike stavljaju u .bmp trake u osnovi ikone koje su poredane u jedan red.
1. Jednom kad ste ilustrirali ikone u Freehandu na svim velicinama prenesite ih u Photoshop. Stavite 24x24 bitne ikone na jedan sloj, a 16x16 bitne na drugi.
2. Nacrtajte jedan red kvadrata za svaku velicinu na odvojenom sloju. Dakle jedna red 16x16 kvadrata i drugi red 24x24 kvadrata.
3. Postavite svaku sliku u kvadrat po redu koji želite i provjerite
da se slike ne preklapaju.
4. Pohranite Photoshop datoteku. 5. Sljedece kreirate hot stanja ikona u Photoshopu.
1. Uzmite 24x24 i 16x16 slojeve i svaki od njih duplicirajte. Preimenujte nove slojeve tako da se vidi da su oni hot slojevi.
2. Za svaku hot verziju odaberite sloj i odaberite Slika>Adjust>Levels… te pomaknite središnju strelicu na 0.75. Kliknite na OK.
6. Jednom kad ste kreirali hot slojeve, trebali biste imati 1 sloj po traci: 1 default 24x24, 1 hot 24x24, 1 default 16x16, i 1 hot 16x16.
7. Sljedece trebate svaku traku pohraniti u odvojenu datoteku. 1. Jedan nacin je korištenjem Crop alata kojim smanjite
sliku na dimenzije trake i zatim pohranite datoteku. 2. Svaku traku pohranite kao 24-bitnu .psd datoteku.
8. Kako bi pohranili traku u 32-bita, dovucite traku u GMG program. Uklonite prazne frameove. Kliknite na File>Export as>Filmstrip. Na Film Export dialogu, odaberite BMP/DIB i 24-bit with Alpha.
Nakon ovoga kratkog uputstva trebali bi imati osnovna znanja potrebna za izradu Windows XP ikona.
Testiranje funkcionalnosti ikona
U testiranje funkcionalnosti ikona razlikujemo dva postupka:
• Test intuitivnosti ikone - je test u kojem se ikona pokazuje maloj skupini korisnika (tipicno pet korisnika) bez naslova. Od korisnika se traži da iznesu svoje mišljenje oko toga što ikona predstavlja. Ovaj test procjenjuje stupanj uspjeha ikone da predstavi odredeni koncept.
• Standardni test korisnosti - je test u kojem se korisnicima predstavlja završeno sucelje i traži se od korisnika da razmišljaju naglas koristeci sucelje kako bi izveli zadane operacije. Ovaj test procjenjuje funkcionalnost ikone u kontekstu cjelovitog sucelja.
Inicijalna istraživanja provode se sa jednostavnim crno-bijelim skicama ikona na papiru. Za svaku ikonu razvija se nekoliko alternativnih koncepata od kojih se odabere onaj koji najviše obecava. Taj koncept se dalje razvija u ikonu u boji kroz iterativno ponavljanje koraka dizajna.
Razvojni stupnjevi prijedloga za ikonu "Tehnologija i Razvoj"
Ove ikone trebale bi predstavljati koncept Tehnologije i Razvoja. Prve dvije ikone sa cipom i CD-ROM medijem su bile preteške za razumijevanje, osobito zato što su predstavljale više gotov proizvod nego ideju razvojnog postupka. Radnik koji kopa je dobra reprezentacija razvoja, no odbacen je zbog negativnih konotacija koje ovaj simbol ima u svojoj precestoj i nepotrebnoj upotrebi na WWW stranicama kao oznaka da su stranice "u razvoju" (što korisnici mrze vidjeti)
Drugi red ikona pokazuje sljedecu iteraciju pokušaja gdje je osoba korištena kako bi predocila ideju ljudi koji rade u razvoju (npr. programera). Prva ikona je bila najpopularnija, iako ona predstavlja hardverski više nego softverski aspekt razvoja. Isto tako mnogima se svida druga ikona koja sa munjom predstavlja koncept zauzdavanja snage.
Tako je za prvu ikonu odabrana kombinacija osobe odn. programera uz korištenje munje. Kroz testiranje korisnosti ikona se pokazala lošim izborom. Neki od problema su bili:
• munje asociraju na nesrecu • struja izgleda bolno • osobu ubija tehnologija • osoba izgleda kao da pleše
• osoba na ikoni ima izbuljene oci
Ocito je da je trebalo ukloniti osobu sa ikone. Tako se na drugoj ikoni zadržala samo munja i zupcanici. Korisnici su se i dalje žalili da munja ima opet destruktivan izgled. Konacno je odluceno da se uklone sve reference na munju i elektricitet i u posljednjoj ikoni koncept razvoja predstavimo sa CD-ROM medijem. Zupcanici su se tijekom testiranja pokazali kao dobar nacin za predstavljanje tehnologije. Cesto zastarjela tehnologija može dobro funkcionirati kao stereotip koji prenosi koncept kroz ikonu.
Razvojni stupnjevi prijedloga za ikonu "Proizvodi i Rješenja"
Ikona racunala koji izlazi iz kutije je odbacen pošto je predstavljao samo hardverski element ne i softverski, kao ni ideju rješavanja problema krajnjih korisnika.
Nekim korisnicima se svidjela ikona sa osobom koja drži racunalo obzirom da prenosi ideju snage i sposobnosti. No ikona je bila pretrpana racunalima u zadnjem planu.
Ikonu sa guruom nitko od korisnika nije prihvatio, iako im se svidio koncept sa žaruljom. Neki korisnici su primijetili da je osoba koja drži racunalo u rukama ustvari muškarac. Ukratko je razmotrena mogucnost da se koriste i žena i muškarac no zbog kompleksnosti je odluceno izbaciti osobu iz ikone.
Kao što se može vidjeti sve verzije ikona u boji su bile u osnovi jednake od uvodenja koncepta racunala sa žaruljom koji je lako prepoznat od korisnika. Jedine promjene u ikonama su rezultirale od promjena u dizajnu web stranica kojima su ikone i namijenjene. Prvo su ikone nešto umanjene, a zatim su uredene da izgledaju više kao elementi sucelja.
Razvojni stupnjevi prijedloga za ikonu "Sunova mreža"
U pocetku smo imali dvije razlicite ideje: server koji razgovara i medunarodna komunikacija. Vecina korisnika je uglavnom ikone koje su trebale predstavljati globus zamijenila sa nogometnom loptom. Nakon nekoliko propalih pokušaja shvatili smo da svijet mora biti okrugao.
Odbacili smo previše antropomorfne servere i u prvom kolor izdanju ikone u obzir uzeli metaforu servera koji poslužuje informaciju na pladnju. Nažalost korisnici su ovu ikonu interpretirali kao šešir isto tako interpretacija rijeci server eng. poslužitelj ne prolazi kao internacionalni koncept.
Nakon toga smo kombinirali ideju svijeta sa idejom balona tj. svijet koji nešto govori, no korisnicka interpretacija je bila probušeni balon. Sljedece dvije ikone su bile pokušaji nešto strožije ideje svijeta, no i one su bile krivo interpretirane od korisnika te su odbacene.
Konacna odabrana ikona je maksimalno pojednostavljena i funkcionalna.
Ikone i dizajn web stranica
Ovdje je dan prikaz postupka dizajna glavne web stranice za Sun World web portal. Unutar postupka razvoja same stranice lako je pratiti razvoj i promjene ikona odn. manjih grafickih elemenata.
Ovakav postupak dizajna karakteristican je za ozbiljne narucitelje tj. velike tvrtke.
U samom postupku provedeno je preko 15 razlicitih promjena dizajna glavne stranice. Vecina tih prijedloga je bila ispitana od strane korisnika.
Kao što se da primijetiti dizajn ikona od pocetne do konacne verzije znatno se mijenja.
Prikaz važnijih modifikacija dizajna glavne stranice portala
Verzija A
Ovo je bio prvi pokušaj izrade stranica koje bi bile u stilu novina. Nažalost korisnici nisu razumjeli da stranica predstavlja Sun-ove korporacijske stranice. Stranice su im slicile na Adobe-ove stranice i asocirale su ih na neovisne novine. Vecina korisnika je komentirala da su stranice vrlo natrpane i komplicirane te da im je otežano snalaženje na njima.
Iako je naziv mjeseca bio jasno istaknut, korisnici ga nisu primijetili tako da je jedna od glavnih prednosti dizajna u stilu novina, a to je ideja novih vremenski ovisnih informacija bila izgubljena. Nakon što je to korisnicima receno, pitali su se kako ce moci pristupiti sadržajima prošlih mjeseci. Kao rezultat toga dodana je mogucnost povratka na prethodne mjesece u daljnjem dizajnu.
Korisnicima se svidio naziv "Entertainment for Propellerheads" (op.prev. "Zabava za štrebere") no odluceno je da ce biti uklonjen. Humor se cijeni u web dizajnu, no ne i na tako istaknutom mjestu. Korisnici su se takoder žalili na bombasticne fraze koje su korištene. Umjesto toga tražili su tehnicke specifikacije proizvoda i detaljne informacije.
Korisnici nisu razumjeli da mogu kliktati na glavni paragraf kako bi pristupili clanku i Adobe-u. Dizajn nije naglašavao mogucnost kliktanja.
Korisnicima se svidjela upotreba graduiranih boja u zaglavljima i konzistentna upotreba boja kroz sucelje. Neki korisnici komentirali su da snažna i pomalo gruba fotografija nije u skladu s korištenim bojama. Cinilo im se kao da postoje dva odvojena dizajna na stranici.
Verzija B
Naziv mjeseca je sad nešto istaknutiji i bio je vidljiv i korisnicima. Isto tako su razumjeli da je "News and Commentary" dio klikabilan. Dodavanje plave oznake {MORE} glavnom paragrafu jasno je oznacilo da postoji još informacija.
Korisnici i dalje cesto nisu razumjeli namjenu stranice, cesto misleci da je to Adobe-ova stranica, a ne Sun-ova- Temeljem ovog opažanja odluceno je da Sun-ov logo bude istaknutiji u sljedecem dizajnu. Problem je u tome što clanak mjeseca cesto preuzima pozornost posjetitelja i dominira stranicom.
Korisnicima se opcenito svidio dizajn i osobito korištenje ljubicaste boje kao okvira stranice. Isto tako hvaljen je profesionalan i snažan izgled stranice. Korisnicima se svidjelo što stranica nije pretrpana mogucnostima i tekstom. Velik broj korisnika bio je izuzetno
zadovoljan cinjenicom da je citava stranica vidljiva na jednom ekranu.
U usporedbi sa prvom verzijom neki problem su bili ispravljeni iako je mogucnost kliktanja na pojedine price i dalje bila umanjena.
Verzija C
Ova stranica je najrafiniraniji dizajn u seriji "SunWorld". Sun-ov logo je uvecan, medutim namjena stranice i dalje nije bila jasna korisnicima. U daljim verzijama predloženo je da se nastavi sa stranicom bez posebnog naziva kojom dominira Sun-ov logo i promjenjivi clanak mjeseca.
Verzija D
Ovaj dizajn je ucinio Sun-ov logotip istaknutijim, cime je razrješio neke od problema korištenja stranice. Nažalost ovaj dizajn je korisnicima previše nalikovao na niz kutija bez osjecaja povezanosti izmedu njih. Sa druge strane dizajn je korisnike preplavio sa ikonama cime se krši osnovno pravilo da korisnik ne želi prevelik broj opcija pred sobom.
Razlicite vrste informacije su prikazana razlicitom grafikom no korištenjem istih ikona, cime se gubi prioritet pojedinih opcija.
Isto tak tijekom 1994 smatralo se dobrim stilom u dizajnu web stranica koristiti što više opcija obzirom da tada nije bilo dostupno puno sadržaja na samom web-u. 1995 to se promijenilo na taj nacin da se preferiralo isticanje važnijih opcija.
Verzija E
Ovo je prvi dizajn koji je predložen nakon što je odlucen izbor clanka mjeseca za izlazak novog dizajna (Java tehnologija). Prethodni dizajn je ukljucivao clanak o PhotoShop-u na Sun-ovim radnim stanicama.
Za novi clanak o Javi potrebna je bila glavna ilustracija u nedostatku koje je izabrana maskota projekta Duke. Obzirom da je Duke dizajniran za prikaz kao mala figura na ikonama, uvecan on nije davao dojam napredne tehnologije.
Ovo je bio prvi dizajn sa razlicitim ikonama za svaku opciju. Isto tako neke ikone su vece i raznobojnije od drugih kako bi se istakla njihova važnost. Neke od ikona ipak nisu funkcionirale kako treba prema korisnicima:
• Sun on the Net ikona: probušeni balon, snjegovic, govoreci svijet, ideja koja izlazi iz globusa
• What's happening ikona: parada, ljudi na Sun-ovoj konferenciji (ova ikona je kasnije izbacena)
• Sales and Service ikona: benzinska pumpa, restoran, javni WC, ducan Sun-ove opreme (što je i blizu pravog znacenja)
• Technology and Developers ikona: munje i gromovi, struja, osoba koju ubija struja, plesna mašina, Sun-ov inženjer sa izbuljenim ocima
Verzija F
Ovaj dizajn je uveo upotrebu šalice za kavu kao ilustracija za clanak o Javi. Ovaj dizajn je izabran kako bi omogucio lakšu izmjenu mjesecnog clanka bez izmjene sucelja ili glavnih elemenata stranice.
Kako bi stranica izgledala jednostavnije, uklonjene su kutije oko clanaka pod kategorijom What's happening. Korištenje liste i plavih kljucnih rijeci je bilo dovoljno da se korisnicima pokaže mogucnost klika na pojedini clanak. Nažalost korisnici nisu shvatili da mogu kliknuti na "What's happening" kako bi dobili dužu listu clanaka.
U ovoj iteraciji dizajna nije bilo vremena za redizajn ikona.
Verzija G
Dodavanje trokuta na traku What's happening znatno je poboljšalo dojam korisnika o mogucnosti kliktanja. U prethodnom dizajnu korisnici nisu kliktali na traku, no sada su to cinili cesto. U ovom dizajnu trokut ne izgleda kao dio trake tako da je on u sljedecem dizajnu promijenjen kako bi izgledao utisnut u traku.
Technology and Developers ikona cinila se i dalje problematicnom jer je munja asocirala na uništavanje. Konacno je odluceno da ce se munja izbaciti, tako da je u sljedecem dizajnu koncept razvoja predstavljen CD-ROM-om. Problem sa Corporate Overview ikonom je u tome da su ljudi mislili da zgrada na ikoni trpi oštecenja od potesa. Odluceno je da ce se ikona pojednostavniti uklanjanjem crvene linije cime ce ostati samo zgrada Sun- ovog sjedišta.
Iako je ovaj put ikona globus ucinjena okruglom doslovno predstavljanje svjetske mreže tom ikonom nije funkcioniralo. Velik broj korisnika nije prepoznavalo koncept te ikone, tako da je odluceno da se ikona što više poopci.
Verzija H
Plamteca šalica kave je bila samo privremena ilustracija, sada je ona zamijenjena sa doradenijom verzijom.
Ovo je vec bilo blizu konacnog dizajna. Traku na What's happening traci je bio malo pretaman da bi izgledao kao udubljenje na traci. Isto tako je prva verzija nove ilustracije šalice izgledala slicno nuklearnoj eksploziji tako da je odluceno doraditi ju u malo prijatniju ilustraciju sa pjenom od kapucina umjesto nuklearnog oblaka iznad šalice.
Isto tako odluceno je da se gradacija boje iza šalice ukloni kako bi se smanjila slika i ucinila bržom za download. Neke dorade su bile potrebne i na bojama kako bi se stranice ucinile citljivijima na monitorima sa vecom zasicenosti prikaza boja.
Verzija I
Konacno finalna verzija stranice.
Naravno, niti ova stranica nije savršena. Ispitivanja u više zemalja pokazala su da ljudi imaju poteškoce sa linkovima na slikama, obzirom da nisu tocno oznacene kao linkovi te pošto ne dobivaju povratnu informaciju o linkovima koje su vec posjetili. Java verzija stranice rješava prvi problem tako da osvjetli dijelove slika na koje je moguce kliktati.
Standardne Windows ikone Kad se radi o operativnim sustavima teško je govoriti o nekom standardnom skupu ikona, obzirom na kolicinu razlicitih funkcija koje operativni sustav izvršava te na kolicinu aplikacija na njemu.
Kad govorimo o Microsoft Windows operativnim sustavima još je teže naci neki zajednicki skup ikona obzirom da Microsoft sa svakim novim operativnim sustavom provodi najcešce i redizajn korisnickog sucelja.
Ovdje cu ukratko predstaviti 100-tinjak cestih ikona koje se koriste u operativnim sustavima Microsoft Windows.
Ikona: Funkcija:
Povecaj prozor preko ekrana
Smanji prozor
Vrati prozor na prethodnu velicinu
Novi dokument
Pošalji e-mailom
Otvori dokument
Pohrani dokument
Pregled prije ispisa
Ispis dokumenta
Slanje dokumenta faksom
Poništi prethodnu radnju
Ponovi poništenu radnju
Izreži dio dokumenta
Kopiraj dio dokumenta
Nalijepi dio dokumenta
Postavke
Traži
Datum
Vrijeme
Ubaci tabelu
Zbroji
Sortiraj opadajuci
Sortiraj rastuci
Povratak na glavnu stranicu
Pretraživanje Interneta ili mreže
Nazad
Naprijed
Zaustavi radnju
Ponovno ucitaj dokument
Pomoc
Provjera pravopisa
Uvlacenje teksta
Izvlacenje teksta
Napravi numeriranu listu
Poravnaj na sredinu
Poravnaj ravnomjerno
Poravnaj lijevo
Podvuceni font
Ukošeni font
Masno otisnuti font
Superscript
Subscript
Crtaj ovalne oblike
Crtaj paralelogram
Crtaj pravokutnik
Crtaj krivulju
Crtaj liniju
Ubaci sliku
Ubaci simbol
Ubaci formulu
Ubaci dijagram
Debljina linije
Boja linije
Boja oko fonta
Boja fonta
Pomoc
Pomoc oko odredene opcije
Ikona: Funkcija:
Dokument
Racunalo
Folder odn. direktorij
Folder odn. direktorij sa zvucnim sadržajem
Folder odn. direktorij sa video zapisima
Instalacija
Instalacija
Deinstalacija programa
Uspostava modemske veze
Smece odn. obrisane datoteke
Pomicanje dolje
Pomicanje gore
Preskakivanje sadržaja
Prekid izvodenja sadržaja
Zaustavljanje izvodenja sadržaja
Izvodenje sadržaja
Snimanje
Lokalna mreža
Zvucni zapis
Video zapis
Pitanje korisniku
Sustav pomoci
Potvrda operacije
Negiranje operacije ili greška u radu
Prihvat ponudenog
Odbijanje ponudenog
Pristup floppy disku
Prijenosno racunalo
Šifriranje ili zaštita sadržaja
Upotreba telefona odn. modema
Popravak sustava ili pristup opcijama za podešavanje
Komunikacija portovima ili rad s portovima
Alarm
Pristup e-mailu
Autentikacija korisnika
Traženje
Sustav pomoci
Miš
Opcije za korisnike s posebnim potrebama
Štampac
Skener
Kamera
Faks
Foto aparat
Zvucnik
Projekcija ili prezentacija
Upozorenje
Korisnici
MS DOS prompt
Tastatura
Aplikacija (obicno bez grafickog sucelja)
Koš za smece (prazan)
Koš za smece (pun)
Koš za smece (prazan)
Koš za smece (pun)
Mreža (ne samo LAN vec i šire)
Pretraživanje dokumenta
Desktop odn. radna površina ekrana
Pristup floppy diskovima
Multimedijalni CD
Racunalo
Racunalo
Sustav pomoci
Komprimirana datoteka
Folder odn. direktorij sa fotografijama
Folder za podešavanje sustava
Gašenje racunala
Spajanje na Internet
Informacija
Paljenje racunala
E-mail poruka
Brisanje
Podešavanje vremena
Kalendar
Software za izradu i repozitoriji ikona
Preporuceni software za izradu ikona
Microangelo - http://www.impactsoft.com/muangelo/muangelo.html Skup alata za kreiranje i editiranje ikona, kursora i animiranih ikona. Jedna od najboljih aplikacija za ovu namjenu.
IconForge - http://www.cursorarts.com/ca_if.html Paket sa svim potrebnim opcijama za editiranje ikona, kursora i animiranih kursora. Program sadrži alate za crtanje i animaciju ikona. Paket ima mogucnost ekstrakcije ikona iz EXE, DLL, ICO, ANI ili CUR formata datoteka.
Icon Searcher - http://www.yxhome.com/softplus/index.htm Program provodi brzo pretraživanje svih lokalnih diskova za ikonama. Program podržava velik broj formata datoteka DLL, EXE, ICO, ICL, OCX, SCR, CPL, BPL. Pronadene ikone smješta na vizualnu listu sa ikonama iz svake datoteke. Podržava Windows 95/98/ME/NT4/2000/XP.
Aha-soft Icon tools - http://www.aha-soft.com/ Proizvodac alata za editiranje, ekstrakciju, konverziju i upravljanje ikona. Proizvodi ArtCursors, CustomIcons, Icon to Any, IconUtils, IconXP, Any to Icon, i ArtIcons. Doadatno sadrži besplatne biblioteke ikona.
XemiComputers Ltd. - http://www.xemico.com/macico/ MacIco je prva besplatna aplikacija specificno dizajnirana za konverziju Macintosh ikona na PC format.
Axialis Software - http://axialis.com/products/index.html AX-Icons aplikacija kreira sve vrste ikona od 16x16 do 72x72, proizvoljnih velicina, crno-bijelih do 16,8 milliona boja.
Icon Sucker - http://www.copseystrain.com/iconsucker/ Aplikacija za ekstrakciju ikona iz 16-bitnih i 32-bitnih aplikacija i biblioteka. Podržani formati su: BPL, CPL, DLL, DRV, EXE, ICL, ICO, OCX, SCR i VBX.
Icon Scanner - http://www.softspice.com/ Aplikacija koja pregledava datoteke, direktorije i diskove na racunalu te ekstrahira skrivene ikone i kursore sadržane u ICO, CUR, EXE, DLL datotekama. Probna verzija je dostupna za download.
IconXP - http://www.iconxp.com/ Editor ikona koji sadrži niz alatki za crtanje koje vam pomažu da editirate ikone standardnih ili proizvoljnih velicina.
Popis repozitorija ikona na Internetu
IconBAZAAR - http://www.iconbazaar.com/ Arhiva ikona namjenjena HTML developerima.
MediaBuilder Icon Library - http://www.mediabuilder.com/ds_icons_blocks_page_aa.html Prilicno dobro organizirana arhiva ikona..
Absolutely Free Icon Library - http://www.free-search.com/afil/ Besplatne ikone, clipartovi, animacije, fontovi itd...
Jeffery Zeldman's Icons - http://zeldman.com/icon.html Kolekcije ikona za web stranice i posebno pripremljeni paketi ikona za Mac, Windows ili Unix.
Anthony's Icon Archive - http://www.cit.gu.edu.au/images/Images.html Klasicna arhiva grafickih elemenata sa strelicama, kuglicama, dugmadi i velikim brojem standardnih ikona.
Buttonland – http://www.buttonland.com/ Besplatna dugmad za izradu web stranica.
Flip Flop Flyin' - http://www.flipflopflyin.com/minipops/index.html Hrpa ikona u GIF formatu.
Disability Graphics - http://www.lareau.org/disgraph.html Kolekcija racunalne grafike namijenjene invalidima.
NewSoftland - http://www.newsoftland.co.nz/newsoftland/webdesign_new_zealan
d/icons.html Tvrtka koja se specijalizira u izradi i dizajnu ikona za sve tipove aplikacija.
AScom Icons Library - http://www.add-soft.com/icons/ Ogromna arhiva ikona za web stranice ili vaš desktop.
Fractus Icons - http://www.fractus.supanet.com/ Kolekcija fraktalno generiranih ikona. 32x32 piksela u GIF formatu.
The Email Icon Pages - http://www.geocities.com/SiliconValley/Network/8924/ Rastuca kolekcija staticnih i animiranih ikona za e-mail.
QBullets - http://www.matterform.com/qbullets/ Elegantne i male ikone namijenjene upotrebi na web stranicama.
Reference 1. William Horton, The icon Book, John Wiley & Sons, Inc. 2. Furnas, G. W., Landauer, T. K., Gomez, L. M., and Dumais, S.
T. (1987). The vocabulary problem in human-system communication. Communications of the ACM 30, 11 (November), 964-971.
3. Mullet, Kevin, and Sano, Darrell (1994). Designing Visual Interfaces: Communication Oriented Techniques. Sun Microsystems Press/Prentice Hall, New Jersey.
4. The American Heritage® Dictionary of the English Language, Fourth Edition
5. On-line rijecnik, http://www.dictionary.com 6. Sve o simbolima, http://www.symbols.net/ 7. Lana Arlov, Gui design for dummies
FER > ZPM > ERGONOMIJA > 2001/2002> Igor Šipka