Razvoj GUIa

Razvoj grafikog korisnikog interfejsa

Seminarski rad

Eldar Kobali

Mentor: Doc. mr. Adla Isanovi

Akademija likovnih umjetnostiSarajevo, 2013


3

SadrajPredgovor

Uvod

Poeci

Apple vs. Windows

Budunost

Literatura

3

4

6

10

14

16

Predgovorovjek, kao bie ija je svijest

bazirana na vizualnoj percepciji, bolje razumije i prerauje sliku od pisane rijei. Zbog toga su saobraajni znakovi u fromi obojenih simbola umjesto crno-bijelih rijei. Iz istog razloga se javila potreba i ideja za grafiki korisniki interfejs. Ali to nije jedini razlog. Grafiki korisniki interfejs nam olakava rad za raunarom, a samim tim i ivot. tedi nam vrijeme potrebno za pisanje komandi te nas oslobaa od pamenja istih. GUI je

ovladao svijetom, proirio se u sve aspekte ovjekovog ivota i postao nezamjenjiv prevodilac kompjuterskog jezika. Bez njega malo ko bi bio sposoban da koristi raunare. Mada je sve poelo ne tako davno, vie ne moemo zamisliti ivot bez njega. Svojim seminarskim radom

elim itaocu pribliiti temu grafikog korisnikog interfejsa, dati osnovne informacije o njemu, prikazati proces njegovog nastajanja i razvoja, te ponuditi rjeenja za njegov dalji razvoj u budunosti.

Uvod

Grafiki korisniki interfejsi nam svakodnevno olakavaju ivot. Bilo da radimo na raunaru, tipkamo na mobitelu ili putamo muziku na plejeru, GUI nam pomae da komuniciramo sa svojim ureajem. Iako relativno mlado otkrie, ne moemo zamisliti moderno doba bez GUI-a...

Razvoj grafiko g korisnikog interfejsa

4


5

Grafiki korisnini interfejs je jednavrsta komuniciranja sa raunarom koja podrazumijeva koritenje grafikih elemenata kao to su ikonice, dugmad i prozori. Prije uvoenja GUI-a, korisnici raunara su pomou tastature kucali svaku komandu i dobivali su odgovarajui odgovor u formi teksta. Ova metoda unosa i prikaza podataka se naziva command line interface i nosi sa sobom prednosti kao i nedostatke u

poreenju sa svojim vizualnim pandanom GUI-om. Glavna prednost grafikog korisnikog interfejsa jeste jednostavnost koritenja. Korisnik ne mora imati veliko znanje o programu kako bi ga poeo koristiti. Komande se nalaze u menjima, a grafiki elementi su dizajnirani kako bi bili itljivi i jasni. GUI olakava navigaviju kroz direktorije raunara. Vizualni prikaz digitalnog podatka je za korisnika mnogo prirodniji i ini ga realnijim i pipljivijim.

ta je GUI?

GUI (graphical user interface) je softverski interfejs, dizajniran da standardizira i pojednostavi koritenje raunarskih programa, pri emu se uz pomo mia rukovodi sa tekstom i slikama na displeju koji sadri ikonice, prozore i menije.

Dictionary.com

Mnogi grafiki korisniki interfejsi su graeni kao WIMP interfejsi. WIMP je skraenica za windows, icons, menus, pointers. Ovaj termin se cesto koristi kao sinonim za GUI, mada to nije ispravno. Mobiteli, na primjer, koriste grafiki korisniki interfejs koji moe imati menije i ikonice, ali mu nedostaje pointer

(simbol koji oznaava poloaj mia).

U vremenima prije grafikog interfejsa, pisanje teksta je izgledalo drugaije nego danas. Tekst kojeg je korisnik vidio na ekranu nije bio isti kada bi se isprintao. Pisale su se komande za formatiranje teksta, koje se nisu pojavljivale u printu. Zbog toga je korisnik morao uplanirati te razlike kako bi dobio eljeni rezultat. Danas se koriste interfejsi koji rade po principu WYSIWYG (what you see is what you get) tako da je prikaz dokumenta na ekranu isti rezultatu koji se dobije po tampanju. Slian primjer su i aplikacije za razvoj web stranice, gdje je mogue vidjeti rezultat jo u toku kodiranja stranice.

WYSIWYG princip je naglaen kod raunara Xerox Alto - dimenzije monitora su iste kao kod A4 papira

Grafike metafore su popularan nain prika-zivanja elemenata u grafikim korisnikim interfejsima - direktoriji izgledaju kao mape, dokumenti kao listovi papira, a mjesto za odlaganje neeljenih datoteka kao kanta za smee. Radna povrina imitira okruenje kakvo se moe nai u uredu. Slika lijevo karikira princip metafore.

6Razvoj grafiko g korisnikog interfejsa

PoeciJo prije nego to je postojala tehnologija potrebna za proizvod-nju GUI-baziranog raunara, viz-ionari su predviali strojeve koji su u njihovo vrijeme bili daleko od realnosti. Meutim, njihove ideje su utabale put za tehnologije koje nas danas okruuju.


7

Prahistorija GUI-aetrdesetih godina prolog stoljea, naunik

i vizionar Vannevar Bush podijelio je sa svijetom svoje ideje o jednoj hipotetikoj maini. Nazvao ju je memex i ona je trebala biti bazirana na neemu sto je vrlo slino dananjem hipertekstu. Bush je zamislio svoj memex kao enciklopediju u koju korisnik moze da pohrani sve svoje knjige, dokumente i druge vrste podataka. Memex je trebao da bude baza podataka u obliku stola, produzetak ljudskog uma sa trajno pohranjenim informacijama. Danas, sedamdeset godina kasnije, ovjeanstvo se koristi jednim izumom koji je vrlo slian Bushovoj ideji o memexu, a nazivamo ga internetom.

Bushove vizije, iako nisu dobile mnogo panje, inspirisale su jedan broj znanstvenika, medu kojima je bio i Douglas Engelbart. ezdesetih godina, Engelbart je prezentirao svoj projekat, stroj koji je pomou dva toka bio u stanju mjeriti sopstveni pokret u dvodimenzijalnom prostoru. Ovaj stroj je nekim ljudima liio na mia, pa je to ime ostalo popularno do danas. Osim toga, Engelbart je zasluan i za razvoj prvog raunarskog sistema koji je bio sposoban da koristi tehnologiju hiperteksta i veceg broja korisnika. Svoje ideje je izdao pedesetih godina u lanku Augmenting human intellect gdje je predstavio osnovne zadatke svog sistema. Htio je da razvije sistem koji bi

pomogao pri irenju ljudskog uma. Nazvao ga je NLS (oN-Line System) i izazvao je fascinaciju medu publikom pred kojom ga je predstavio 1968. godine. NLS je prvi sistem koji je imao prototip grafikog interfejsa i koji se koristio miem, vezama (linkovima) koji su mogli voditi do bilo kojeg koda, dokumenta ili paragrafa, te je cak bio u mogunosti uspostaviti video konferenciju. Zbog svega ovoga, Engelbart je dobio titulu otac mia, kao i otac grafikog korisnikog interfejsa.

Hipotetiki izgled memex-a

Danas poznajemo grafike korisnike interfejse kojima komandujemo pomou dodira ili drugim me-todama, ali pionirski GUI je usko povezan otkriem mia. Engelbart je isprobavao razne ulazne ureaje, da bi se mi pokazao kao najpodobniji. Na slici je prikazan prvi mi koji je imao samo jedno dugme.

Isjeak iz Engelbartove demonstracije oNLine System-a. Sa desne strane se vidi kursor, koji je u to vrijeme pokazivao ravno prema gore, umjesto da ima dijagonalan poloaj kakvog poznajemo danas.

8Razvoj grafiko g korisnikog interfejsa

Veliki doprinos u razvoju interakcije izmeu raunara i ovjeka imao je Ivan Sutherland. Njegov revolucionarni program Sketchpad imao je za cilj da pomogne pri tehnikom crtanju i prototip je svih dananjih programa za crtanje. Koristei svjetlosnu olovku, pomou sketchpad-a bilo je mogue crtati ravne i krive linije, krunice i poligonalna tijela. Cak i danas, sketchpad fascinira svojim mogunostima, a davne 1965. godine bio je zapanjujui za publiku jer je ponudio jedan sasvim nov nain komunikacije sa raunarom. Rad na sketchpadu je isti kao princip rada sa grafikim korisnickim interfejsom jer se koriste vizualne informacije, umjesto rijei koje su do tada bile glavni nain komunikacije.

Xerox Alto & StarPioniri raunarskih tehnologija su uticali

na ininjere u Xerox PARC-u (Pala Alto Reasearch Center) koji su razvili prvi raunar sa grafikim korisnikim interfejsom. Raunar nazvan Alto bio je predstavljen 1973. godine i bio je prvi raunar namijenjen linom koritenju, nalikdananjem PC-u. Alto je imao bitmapski ekran, korisniki interfejs sa prvim grafikim metaforama, a koritenje je bilo bazirano na miu. Do tada, monitori su bili graeni tako da prikazuju slova - svako slovo je imalo fiksan poloaj, a Engelbartov monitor je bio baziran na vektorima (prikazivao je linije i slova), dok je bitmapski monitor imao mogunost da svaku taku prikae kao crnu ili bijelu i tako ponudi kompleksnije slike. Interfejs ovog raunara imao je gotovo sve

elemente koje danas poznajemo; ikonice, menije, prozore itd. ak je bio poznat WYSIWYG princip - tekst je prikazivan crn na bijeloj pozadini a istraivai u Xeroxu su razvili jezik InterPress koji je postavljao slova onako kako bi izgledala na papiru. Xerox Alto je posjedovao prvi desktop (radnu povrsinu) i prozore koji su prelazili jedan preko drugoga i imali mogunost smanjivanja/poveavanja. Prozori su imali okvire i dobro su se idvajali od pozadine. Izmiljen je title bar (naslovna traka) koji se koristio za identifikaciju i pomijeranje prozora. Razlikovao se od dananjih varijanti tako to se nije protezao do kraja prozora nego samo do zavretka naslova. Meni bi se pojavio na mjestu kursora kada bi se pritisnulo odgovarajue dugme na miu. Ovo je bio poetak pop-up menija. Ovaj raunar nije uao u iru primjenu - koristili su ga istrazivaci kompanije Xerox i nekoliko univerziteta. Pojedini uposlenici su apelirali na vostvo Xerox PARC-a da se njihov raunar daje u prodaju, meutim kompanija je odbijala tu ideju.

Ivan Sutherland pri radu na sketchpad-u - kompleksnost funkcija i mogunosti ovog izuma su bile izuzetno napredne za tadanje doba


9

Idui projekat kompanije bio je Xerox Star 8010 Document Processor koji je bio objavljen 1981. godine. Ovaj raunar je bio namijenjen prodaji. Njegov grafiki korisniki interfejs je bio razvijeniji i usklaeniji od njegovog prethodnika ali neke funkcije su ukinute. Prozori, na primjer, nisu vie imali mogunost preklapanja, jer se smatralo da bi to zbunilo korisnika. Umjesto toga, prikazivani su jedan pored drugog. U Xerox Star je uloeno mnogo truda, struktura sistema je bila detaljno i kvalitetno osmiljena, koritene su najnaprednije tehnologije (npr. laserski mi umjesto mehanikog) ali je sve to nosilo sa sobom cijenu koju je malo ko mogao platiti. Osim toga, kompanija nije ni sama bila svjesna potencijala svog GUI-a te je Xerox Star postao komercijalni neuspjeh. Mnogi uposlenici Xerox PARC-a su napustili kompaniju i preli u druge firme, kao to je Apple, kako bi mogli raditi na proizvodu kojeg bi korstila ira populacija, umjesto elitne manjine.

Uspon Apple-aKompaniju Apple Inc. su osnovali Steve Jobs,

Steve Wozniak i Ronald Wayne, od kojih su kasnije ostali u kompaniji samo prva dvojica. Wozniak je bio zasluan za proizvodnju raunara, dok se Jobs bavio prodajom. Njihovi prvi raunari su bili bazirani na command line interfejsu, sve dok nisu posjetili prostorije Xerox PARC-a, gdje su vidjeli budunost u obliku Xerox Alto raunara. 1977. godine su poeli sa radom na sopstvenom raunaru sa grafikim korisnikim interfejsom.

Apple Lisa je objavljen 1982. godine, a ime je dobio po Jobsovoj kerki jer je ak i ona bila sposobna da s njim rukovodi. Mada su mnoge odlike Apple-ovog GUI-a bile preuzete iz Xerox-ovih raunara, Lisa je uvela i mnoge nove karakteristike u svijet interfejsa. Tim Jobs-a je izmislio kvaice pored odabranih svojstava, izblijeena slova za opcije koje nisu dostupne, kantu za smee, drag and drop opciju te duge elemente. Apple-ov mi je pojednostavljen, tako to je imao samo jo jedno dugme (Xerox-ov je imao dva). Pojavila se potreba za duplim klikom kako bi datoteka bila otvorena, a ne samo oznaena. Dupli klik je postao standard za sve kasnije GUI-e. Uvedeni su drop-down meniji, koji su se nalazili u gornjoj strani ekrana, zajednikom mjestu za sve aplikacije. Na alost Apple-a, Lisa nije postala zanajan uspjeh zbog velike cijene. Kotala je 10.000 dolara, tako da je Apple pourio sa proizvodnjom novog raunara koj bi bio vie dostupan korisnicima. Ve 1984. godine puten je u distribuciju Apple Macintosh, koji je u poreenju sa Lisom imao manji ekran, skromniju memoriju i nije imao mogunost multitasking-a, ali je njegova cijena bila 2.495 dolara. Ovaj raunar je danas kultni objekat po kojem mnogi pamte pojavu grafikog korisnikog interfejsa ipomou kojeg je Apple postao jedna od najpopularnijih kompanija svijeta.

Gore: MackintoshLijevo: Lisa

10


Apple vs. Windows

Nakon to se Apple proslavio svojim grafikim korisnikim interfejsom, ubrzo se pojavila konkurencija sa svojim proizvodima. Windows ih je sviju izbacio iz igre, ali pravila se mijenjaju a borba jo nije gotova...


11

Pobjeda Windows-aKompanija Microsoft, pod vostvom

Bill Gates-a izdala je svoj prvi GUI 1985. godine kao dodatak MSDOS-u. Prvobitno je nazvan Interface Manager, da bi mu kasnije promijenili ime u Windows 1.0. Liio je uveliko na Apple-ov Mackintosh, sa naivnijim dizajnom i nekoliko izmijenjenih karakteristika. Bio je u stanju da vri vie zadataka u isto vrijeme, to mu je davalo prednost u odnosu na Mackintosh. Nije imao jedinstven menu bar kao Apple-ov GUI, nego je svaka aplikacija imala sopstveni. Prozori u Windows 1.0 nisu imali mogunost preklapana, kako interfejs ne bi previe nalikovao Apple-ovom. Ova prva verzija Windows-a nije imala znatan komercijalni uspjeh i niko se nije znatno zanimao za Microsoft-ov GUI. 1987. godine izdaje se Windows 2.0 sa prozorima koji se preklapaju i koji imaju dugmad za funkcije minimize i maximize. Uvodi se dodatno dugme sa lijeve strane naslovne trake koje klikanjem otkriva dodatne opcije. Sputeni programi i fajlovi se pojavljuju na desktopu i mogu se pomijerati. Apple smatra da Windows kopira njihov interfejs, te zapoinje sudsko gonjenje protiv Microsofta. Parnica

traje etiri godine da bi Microsoft izaao kao pobjednik. Sud je smatrao da se ne mogu zakonski zatititi elementi grafikog korisnikog interfejsa, a pored toga je i sm Apple kopirao mnoge odlike Xerox-ovog GUI-a. Pobjeda Microsofta na sudu samo je poetak uspjeha ove kompanije.

1990. godine Microsoft razvija novi operativni sistem pod imenom Windows 3.0, koji treba da postane njihov prvi vei uspjeh. Funkcionalnost GUI-a se nije znatno promijenila ali su uvedeni mnogi novi programi i mogunosti operativnog sistema. File Manager je olakao rad sa datotekama, koje su se pomou drag-and-drop principa mogli prebacivati u eljene lokacije. Control panel je uveden kao i mogunost da se promijeni pozadina radne povrine. Duplim klikom na desktop otvorio bi se Taskman, program za jednostavnu manipulaciju mnotva aktivnih aplikacija. Dizajn novog Windowsa je unapreen, sa trodimenzionalnim izgledom. Osim toga, popularnosti Windowsa potpomau moni programi kao to je Exel, koji 1991. godine postaje prvi program sa toolbar-om - alatnom trakom.

Pojavom Windows 95, nadmo Microsofta postaje definitivna. Predstavlja se Windows

Explorer koji pomou hijerarhijskog stabla olakava pretraivanje

gore: Windows 1.0desno: Windows 95

12


direktorija. Uvodi se koncept preice, ikonice koja predstavlja vezu do bilo koje datoteke ili direktorija. Najvea inovacija jeste Task Bar - traka fiksirana na donjem dijelu ekrana na kojoj se prikazuju svi otvoreni programi. Dosadanja varijanta prikazivanja je bila pomou ikonica na radnoj povrini, gdje je lako izgubiti program ukoliko je vei broj aktivan. Na Task Baru nalazi se dugme Start koje klikanjem otkriva mnotvo opcija, programa i datoteka, uredno organizirani i jednostavni za pronalazak.

Apple preivljavaDok se Apple fokusirao na uljepavanje

svojih grafikih korisnikih interfejsa, Microsoft je radio na unapreenju funkcionalnosti svog Windows-a i uveo je mnotvo korisnih svojstava. Mada veliki broj mogunosti povremeno doprinosi pretrpanosti te zbunjivanju korisnika, Windows je dokazao inovativnost i time zadobio podrku najveeg broja potroaa. Apple, sa druge strane, je pokazao suprotno ponaanje i tokom jedne decenije promijenio sasvim malo na svojim interfejsima. Tvrdoglavo se dri mia sa jednim dugmetom a dugme delete se idalje ne moe nai na Apple-ovim tastaturama. Mogunost multitasking-a je uvedena tek 1991. godine, a zajedniki, fiksirani menu bar je i dalje prisutan, dok su svi ostali proizvoai prihvatili zasebne menije. Apple-ovo rjeenje je bilo logino u vrijeme Lise i Mackintosha, kada je je ionako bilo mogue koristiti samo jedan program i kada su ekrani bili mali, ali danas je prevazieno i nosi sa sobom nedostatke. Dock, u poreenju sa

Task Barom, nudi skromne mogunosti, kao i Finder u poreenju sa Windows Explorerom. Apple-ove odluke se ogledaju u elji da se napravi to jednostavniji GUI sa to veom estetskom vrijednou, iako je pri tome funkcionalnost zanemarena. Usprkos svemu tome, Apple i dalje preivljava i od svih grafikih korisnikih interfejsa koji su se pojavili osamdesetih godina, jedini je koji je imalo uspio konkurisati Windows-u.

U novije vrijeme, Apple ponovo zarauje popularnost svojim ureajima kao to su iPod, iPhone i iPad, te interfejsima koje razvija za touchscreen tehnologiju, dok Windows naputa svoj inovativni karakter i kree stazama proizvodnje za prosjenog potroaa, sa sakrivenim mogunostima i uminkanim dizajnom.

Mac OS X - dizajn je superioran u poreenju sa Windows 98, koji e biti izdat tek godinu dana kasnije. Prijateljski izgled GUI-a i dizajn kuita iMac-a pomau velikom uspjehu ovog proizvoda


13

Sporedni igraiTokom osamdesetih godina pojavio

se velik broj raznih operativnih sistema sa grafikim korisnikim interfejsima koje je populacija tek upoznala. Mnotvo njih se nije uspjelo etablirati, ali su neki doprinijeli pojedinim svojstvima unapreenju i razvoju tehnologije GUI-a.

VisiOn je bila jedina kompanija pored Apple-a koja je proizvodila grafike korisnike interfejse za line raunare. Visoka cijena, neprimamljiv dizajn i sk-romne mogunosti osigurale su brzu propast ovog GUI-a.

Tandy DeskMate je GUI koji je bio namijenjen uprav-ljanjem tastaturom. Teko ga je bilo koristiti i doivio je starost od svega nekoliko godina

GUI kompanije Acorn objavljen je 1987. godine. Scroll bar-ovi su proporcionalni a na dnu se nalazi Dock, prvi svoje vrste

NeXTSTEP je GUI razvijen za NeXT, raunar na kojem je radio Steve Jobs u periodu kada je prestao raditi za Apple. Trodimenzionalni dizaj svih komponenti je bio nepoznat do tada. Sa desne strane nalazio se Dock koji se mogao pre-baciti na bilo koju drugu stranu a meniji su imali mogunost izvlaenja i postavljanja na bilo koje eljeno mjesto.

14


Budunost

The best way to predict the fu-ture is to invent it.

- Alan Kay, 1971

(pionir u razvoju grafikog korisnikog interfejsa)


15

Pitanje tehnologijeKako je razvoj prvih GUI-a bio usko

povezan otkriem mia, tako e i njegov dalji razvoj zavisiti od hardware-a na kojem e se koristiti. Trenutni trendovi pokazuju irenje touchscreen-tehnologije. Smartphone-i kao to je Apple-ov iPhone preuzeli su veliki broj zadataka raunara na sebe. Njihove ikonice su velike naspram ekrana, a zbog manjka prostora, dizajn je lien svih nepotrebnih elemenata. Dok je kursor jedna zasebna taka kojom pokazujemo, touchscreen moemo dodirnuti sa dva ili vie prstiju. Na

taj nain se pruaju dodatne mogunosti za manipulisanje prikazanim elementima. Touchscreen tehnologija nije ograniena samo na mobitele i tablet PC-ove. Laptopi se uveliko proizvode sa mogunosti odvajanja od tastature i pretvaranja u tablet, a njihov GUI e morati zadovoljavati potrebe upotrebe kursora, kao i komandovanja dodirom. Novi Windows 8 e biti takoer orijentisan ka koritenju touchscreen-a i ova tehnologija e biti prisutna u gotovo svim ureajima koji e koristiti novi Windows. Estetika GUI-a ide

u pravcu staklastog i prozranog. Takoer se nude mogunosti sopstvenog dizajniranja i razvijanja izgleda. Touchscreen je, meutim, neprikladan za rad na raunaru za stolom. Ruke se ne mogu stalno drati ispruene naprijed, niti je ugodno drati ureaj u krilu i gledati prema dolje due vrijeme. Zbog toga se najavljuju novi ulazni ureaji koji imaju u planu zamijeniti tastaturu i mia i koji bi koristili deset kursora, po jedan za svaki prst. Kako god budunost GUI-a izgledala, bit e lake i prirodnije ui u interakciju sa raunarom ili drugim ureajem, jer upravo to jeste svrha GUI-a.

Ako je vjerovati filmovima, hologrami ikonica e u budunosti letjeti oko nas, koristiemo naoale koje e nam projektirati sadraj interneta na oi a digitalnim sadrajem emo manipulisati mahanjem ruku. Koliko god fiktivno ovo zvualo, moda nismo daleko od toga. I dananje tehnologije su bile fikcija u vrijeme Vannevar Bush-a.

16


Literatura

A Short History of the GUI and the Microsoft vs Apple Debate, http://www.theoligarch.com/microsoft_vs_apple_history.htmA History of the GUI, Jeremy Reimer, http://arstechnica.com/features/2005/05/gui/The Real History of the GUI, Michael Tuck, http://www.sitepoint.com/real-history-gui/Graphical User Interface Gallery, http://toastytech.com/guis/Welcome to the Post-WIMP Era, http://afaikblog.wordpress.com/2012/01/12/welcome-to-the-post-wimp-era/Father of the Mouse, http://www.dougengelbart.org/firsts/mouse.htmlAbout Augment/NLS, http://www.dougengelbart.org/about/augment.htmlDigiBarn Computer Museum, http://www.digibarn.com/

Documents

Razvoj GUIa