Smer: Savremene računarske tehnologije
Predmet: Osnovi elektrotehnike
SEMINARSKI RAD
UTICAJ FORME LAYONTA NA
KORISNIČKI UX DIZAJN
Student:
Mentor:
Dušan Jovanović SER 79/12
Prof.Dejan Blagojević
Niš, 2018.
Apstrakt
Predmet ovog rada je korisnički interfejs, kao sredstvo interakcije čoveka i računara. Cilj rada jeste da
ukaže na nedostatke postojećih tehnika, tehnologija i alata za razvoj korisničkog interfejsa, sa posebnim
osvrtom na Java platformu, kao i da pruži rešenje u vidu alternativnog postupka koji je lišen uočenih
nedostataka.
Rešenje je zasnovano na upotrebi jednostavnog platformski nezavisnog modela korisničkog interfejsa
definisanog pomoću XML i CSS sintakse i softverskog okvira koji generiše korisnički interfejs na osnovu
tog modela. Dokazano je da je prezentovano rešenje bolje od ranije dostupnih i prikazani su principi na
kojima se zasniva njegova uspešnost.
Ključne reči: Grafički korisnički interfejs, XML, CSS, Java, Swing
Abstract
The subject of this paper is user interface, as a mean of human-computer interaction. The main goal is to
indicate the weaknesses of existing methods, technologies and tools for user interface development, with
special focus on Java platform, and to offer a solution in form of an alternative method, which lacks the
identified weaknesses.
The solution is based on use of a simple platform-independent user interface model defined in XML and
CSS syntax and a software framework which generates user interface from that model. It was proven that
the presented solution is better than previously available ones and the principles which were applied to
achieve its success are shown.
Keywords: Graphical user interface, XML, CSS, Java, Swing
Indeks slika
Komandna linija.............................................................................................................................................4
Turbo okruženje za programski jezik Pascal.................................................................................................4
Macintosh operativni sistem, 1984. godina [3].............................................................................................6
MS Windows 95, 1995. godina [2]................................................................................................................ 6
KDE4 grafičko okruženje za Linux, 2008 godina......................................................................................... 6
Korisnički interfejs web aplikacije Gmail..................................................................................................... 7
Primer jednostavne forme............................................................................................................................ 19
Uporedni primer – Zahtev zadatka...............................................................................................................30
Uporedni primer – Direktno kodiranje........................................................................................................ 34
Hijerarhija komponenata primera u NetBeans-u.........................................................................................35
Forma za lokalizovanje u NetBeans-u.........................................................................................................36
Uporedni primer - korišćenjem NetBeans alata...........................................................................................36
Uporedni primer - korišćenjem okvira.........................................................................................................41
Uporedni primer – Simple View..................................................................................................................44
Napredni primer - Prvo pokretanje..............................................................................................................60
Napredni primer - Unošenje podataka.........................................................................................................62
Odzivna poruka............................................................................................................................................ 63
Napredni primer - Lokalizovana verzija...................................................................................................... 64
Napredni primer – Verzija sa promenjenim bojama....................................................................................66
Napredni primer - Verzija sa web pretragom...............................................................................................68
Napredni primer - Rezultati web pretrage....................................................................................................69
Indeks dijagrama
Dijagram klasa MVC uzora.........................................................................................................................13
Sistemski prikaz generatora korisničkog interfejsa.....................................................................................20
Konceptualni dijagram klasa softverskog rešenja........................................................................................21
Osnovni sekvencni dijagram SwingGuiBuilder projekta............................................................................24
Dijagram klasa podsistema kreiranja komponenata.....................................................................................25
Dijagram klasa podsistema dodavanja komponenata.................................................................................. 26
Sekvencni dijagram algoritma formiranja strukture korisničkog interfejsa.................................................26
Sekvencni dijagram algoritma za lokalizovanje komponenata....................................................................27
Dijagram klasa podsistema za primenu stilova............................................................................................28
Sekvencni dijagram algoritma za primenu stilova.......................................................................................29
Napredni primer - Dijagram klasa domenskog modela...............................................................................52
Indeks tabela
Neki od poznatijih jezika za označavanje namenjeni za izradu korisničkog interfejsa.[10] [11]................11
Poređenje tehnika za izradu korisničkog interfejsa......................................................................................18
Ključne prednosti i odgovarajući nedostaci................................................................................................. 50
Specifikacija - Spisak svih elemenata..........................................................................................................70
Specifikacija - CSS svojstva iz kategorije 'Pozadina'..................................................................................71
Specifikacija - CSS svojstva iz kategorije 'Okvir'.......................................................................................71
Specifikacija - CSS svojstva iz kategorije 'Klasifikacija'............................................................................72
Specifikacija - CSS svojstva iz kategorije 'Dimenzije'................................................................................72
Specifikacija - CSS svojstva iz kategorije 'Font'.........................................................................................73
Specifikacija - CSS svojstva iz kategorije 'Pozicioniranje'..........................................................................74
Specifikacija - CSS svojstva iz kategorije 'Tekst'........................................................................................ 74
Preslikavanje Simple View elemenata u Swing komponente......................................................................75
2
Predmet rada
je korisnički interfejs kao sredstvo interakcije čoveka i računara.
Posebna pažnja je posvećena aspektima korisničkog interfejsa koji su bitni
projektantima i softverskim inženjerima, a koji se odnose na modularnost,
fleksibilnost i nezavisnost korisničkog interfejsa od platforme.
Cilj rada
jeste da ukaže na nedostatke postojećih tehnika, tehnologija i alata za razvoj
korisničkog interfejsa, sa posebnim osvrtom na Java platformu, kao i da pruži rešenje
u vidu alternativnog postupka koji je lišen uočenih nedostataka.
U petom poglavlju je data komparativna analiza tehnika za razvoj korisničkog interfejsa na
konkretnom primeru. Analiza je izvedena tako što je korisnički interfejs sličnog izgleda i
funkcionalnosti izrađen pomoću sve četiri identifikovane tehnike i dobijeni rezultati su međusobno
upoređeni.
U šestom poglavlju dat je sažet pregled celog diplomskog rada, prikazani su zaključci koji su
izvedeni prilikom analize nove tehnike razvoja korisničkog interfejsa i nabrojane neke ideje za
mogući dalji razvoj ovog projekta.
Dodatak A sadrži primer napredne upotrebe opisanog generatora za izradu korisničkog interfejsa za
jedan informacioni sistem.
Dodatak B sadrži kompletnu
Simple View
specifikaciju.
