Dijagrami Toka Interfejsa - Amra Hadžić 34675

VISOKA ŠKOLA AKADEMSKIH STUDIJA “DOSITEJ” BEOGRAD STUDIJSKI PROGRAM: INFORMATIKA NASTAVNI PREDMET: DIZAJNIRANJE KORISNIČKOG INTERFEJSA STATUS NASTAVNOG PREDMETA: OBAVEZNI BROJ ESPB: 6

SEMINARSKI

RAD

TEMA: DIJAGRAMI TOKA INTERFEJSA

Predmetni nastavnik:

Ime i prezime:

Prof. Milica Tepšić

Amra Hadžić Broj indeksa studenta:

Beograd

SADRŽAJ 1.

UVOD ................................................................................................................................................3

2.

PRINCIPI DIZAJNA .............................................................................................................................4 3.1 Kontrast ..........................................................................................................................................4 1.1

Ponavljanje ...............................................................................................................................5

3.

DIJAGRAMI TOKA INTERFEJSA ..........................................................................................................6

4.

HIJERARHIJSKI DIJAGRAM DEKOMPOZICIJE .....................................................................................7

5.

OKRENUTOST KA KORISNIKU ...........................................................................................................8 1.1

6.

7.

8.

Dizajn displeja...........................................................................................................................8

SPECIFIKACIJA ZAHTEVA KORISNIKA ................................................................................................9 1.1

Model poslovnih procesa ...................................................................................................... 10

2.1

Model predložnog rešenja .................................................................................................... 10

KONCEPTUALNI MODEL PODATAKA ............................................................................................. 11 8.1

Entiteti ................................................................................................................................... 12

8.2

Atributi .................................................................................................................................. 12

LITERATURA ................................................................................................................................... 14

2

1. UVOD Korisnički interfejs je deo sistema koji služi za komunikaciju između korisnika i samog sistema. Predstavlja jako bitan deo jer je jedini vidljiv spoljašnjim korisnicima. Komunikacija obuhvata sve, od startovanja ili prijavljivanja na sistem, preko podešavanja opcija, do dobijanja željenih informacija ili postizanja željenog cilja. Korisnički interfejs se sastoji iz delova namenjenih vođenju korisnika kroz sistem ekrana, formi koje sadrže neke informacije za unos i prikupljanje podataka i iz izveštaja koje sistem treba da proizvodi. Sastoji se od tri bitna dela. -

Prvi je mehanizam za navigaciju, sačinjen od raznih menija i dugmića koji omogućavaju korisniku da se kreće po sistemu.

-

Drugi je ulazni mehanizam i on predstavlja način za prihvatanje informacija dobijenih od korisnika. Sastoji se iz raznih formulara.

-

Treći bitan deo je izlazni mehanizam. On obuhvata sve izveštaje koje sistem treba da predstavi korisnicima ili nekom drugom sistemu.

Dobru aplikaciju (u našem slučaju Microsoft poslovno rešenje), pored njene funkcionalnosti karakteriše i dobro osmišljen korisnički interfejs. Zadatak korisničkog interfejsa je da bude intuitivan, da korisniku obezbedi lako korišćenje, jednostavnost pri radu i lako učenje. Čitajući o korisničkom interfejsu naišao sam na vrlo dobru knjigu: “Dizajniranje korisničkog interfejsa” (Ben Scheiderman, Catherine Plasiant) koja mi je dosta pomogla. U nastavku ću navesti par smernica koje vam mogu pomoći oko izrade uspešnog korisničkog interfejsa.

Slika 1.1 Korisnički interfejs

3

2. PRINCIPI DIZAJNA Ljudske sposobnosti su osnova principa dizajna. Postoje različiti generalni principi koji se mogu primeniti na proizvoljan GUI, ali i na specifične sisteme. • Postoji više načina da se definišu principi razvoja efektnog dizajna. Čak se i eksperti ne slažu šta predstavlja pojam dobar dizajn. Kako bismo kreirali kvalitetna dizajnerska rešenja, potrebno je da ispoštujemo osnovna pravila dizajna. Osnovna stavka u kvalitetnom dizajnu je pravilno isticanje, upoređivanje, stvarenje logičnog redosleda I na taj način kreiranje jednog oku uređenog prostora. Kako bismo kreirali logičan poredak, potrebno je slične informacije udružiti u grupe. Udruživanjem elemenata u grupe ostvarujemo preglednost rada. Grupisanje se najdoslednije primenjuje u vebdizajnu prilikom grupisanja sličnih informacija ili informacija koje se nalaze jedna u vezi sa drugom. Kreiranje različitih grupa donosi informcije o hijerarhijskom nivou elemnata. Svi elementi najvišeg reda informacija treba da se vizuelno grupišu. Na ovaj način postižemo preglednost strukture informacija.

3.1 Kontrast Da bismo istakli informaciju u odnosu na druge, potrebno je pridržavati se kontrasta. Kontrast znači različitost, a može se ostvariti na više načina. Najčešći su kontrasti u boji, obliku i veličini, s tim što se kontrast u boji može postići na više načina, po principu komplementarnosti (suprotne boje Osvaldovog kruga), u odnosu tamno-svetlo i u odnosu toplo-hladno. Kontrast se može postići i u tekstu različitim fontovima, bojom ili veličinom, ili postavljanjem teksta u okvir. Kontrast je stilska figura u kojoj se nešto poredi po suprotnosti. Njegovom primenom, suprotne pojave su jače izražene. Ovo je specijalna vrsta poređenja. Ovde se poređenje ne vrši po sličnosti, već po suprotnosti, čime se veoma izrazito ističu oba člana koja ga sačinjavaju zasnivajući se na onom u slikarstvu poznatom postupku slikanja crno-belo,ili uopšte slikanja komplementarnim bojama. Kao što se kontrasne boje u slikarstvu lepo dopunjuju, a opet svaka ponaosob izrazitije deluje, tako se i u književnosti kontrastom postiže veoma izrazita konkretizacija slike. 4

Poboljšanje poruka o greškama jedan je od najlakših i najdelotvornijih načina za poboljšanje postojećeg interfejsa. Izbegavati opšte poruke (sintaksna greška) ili nerazumljive (error code 12345). Korisniku to ništa ne znači. Opšte i nerazumljive poruke zameniti porukama koje će korisniku biti jasne, budite savetodavni: navedite šta je potrebno da korisnik uradi, koristite dobronameran prizvuk: izbegavajte ukoravanje, zadržite uvek iste gramatičke oblike, terminologiju i skraćenice, uvek isti vizuelni oblik i položaj.

Slika 2.1.1 Kontrast

1.1 Ponavljanje Ponavljanjem istih elemenata dočaravamo pripadnost elemenata grupi, a ujedno i uređujemo prostor čineći ga oku prijatnijim, a mozgu prihvatljivijim. Ponavljanje dizajnerskih elemenata se ogleda u ponavljanju istih fontova i kreiranju stilova u tekstu. Naslovi, podnaslovi, nadnaslovi i tekstovi uvek imaju svoj font kojim se piše sve što pripada istoj kategoriji. Oblici i forme grafičkih elemenata se ponavljaju kako ne bismo stvarali haos i kako bismo dobro oranizovali

prostor.

Na primeru veb sajta primećujemo da su svi oblici boksova istog oblika, svi dugmići identični, svi tekstovi ispisani istim fontom, u zavisnosti od toga da li je reč o linku, imenu dugmeta ili tekstu.

5

3. DIJAGRAMI TOKA INTERFEJSA Jedan informacioni sistem može biti veoma složen i može sadržati veliki broj procesa, tokova podataka, skladišta podataka i spoljnih objekata. Istovremeno jasna i detaljna specifikacija sistema zahteva da se I na predstavljanje sistema pomoću dijagrama toka podataka (DTP) primeni metoda apstrakcije. To se postiže primenom hijerarhijske dekompozicije DTPa. Hijerarhijska dekompozicija DTP-a se izvodi na taj način što se jedan proces višeg nivoa apstrakcije dekomponuje i prikazuje pomoću novog celokupnog DTP-a na nižem nivou apstrakcije.

Slika 4.1 Dijagram toka podataka

6

4. HIJERARHIJSKI DIJAGRAM DEKOMPOZICIJE Da se sada vratimo na konvenciju III. Uobičajeno je da se u dokumentaciji za specifikaciju IS pomoću SSA, celokupan skup, ili neki podskup hijerarhiski dekomponovanih dijagrama, predstavi dijagramom dekompozicije. Opšti primer dijagrama dekompozicije za IS studentske službe prikazan je na slici.

Slika 5.1 Hijerarhijski dijagram dekompozicije

Rečnik podataka, kao što je ranije rečeno, daje opis strukture i sadržaja svih tokova i skladišta

podataka. Bez obzira na vid postojanja toka ili skladišta podataka (papirni dokument, niz karaktera kao ulaz sa terminala, „paket” informacija dobijen telekomunikacionom linijom, kartoteka ili datoteka) kao logička struktura podataka oni predstavljaju neku kompoziciju polja. Da bismo precizno definisali logičku strukturu skladišta i tokova i definisali sintaksu rečnika, neophodno je da uvedemo definicije svih koncepata rečnika.

7

5. OKRENUTOST KA KORISNIKU Izraz okrenutost ka korisniku navodi na to da korisnik upravlja interfejsom – time što on pokreće dešavanja a ne samo odgovara na njih. Savršenstvo je u jednostavnosti (saveti i primeri ispisani na ekranu – ScreenTips, help). Korisnici će se pre sećati jedinog puta kada su imali poteškoća nego 20 puta kada je sve prošlo dobro.

1.1 Dizajn displeja Uspešan dizajn mora da pruži sve neophodne podatke u pravilnom redosledu:  Grupisanje stavki po značenju  Grupisani elementi mogu biti uokvireni  Odgovarajuće stavke istaknute podvlačenjem, senčenjem, bojama, posebnim fontom  Čistoća forme postiže se poravnanjem levo ili desno  Elegancija i jednostavnost  Veličina, kontrast i proporcije  Organizacija i vizuelna struktura  Stil

Slika 6.1.1 Dizajn displeja 8

Kod korišćenja boja moramo biti vrlo pažljivi, 3 – 4 boje su sasvim dovoljne. Budite oprezni prilikom slaganja boja, obezbedite da raspoznavanje boje odgovara zadatku, skrenuti pažnju na upozorenje, bojom privucite pažnju na inače nezanimljiv prikaz i ne zaboravite boja može da odmara ili umara oči.

6. SPECIFIKACIJA ZAHTEVA KORISNIKA Eksplicitno izraženi zahtevi za funkcijama softvera i njihovom načinu izvršavanja a vezani za konkretnu problematiku posmatranog informacionog sistema.  svrha softvera  definicije pojmova i skraćenice  poslovni ciljevi (Bussiness objectives) - šta se želi postići u poslovanju - ušteda vremena, pokrivanje kojih poslovnih aktivnosti i na koji način  Opis rada sistema (overal description) - hronološki opis kako će raditi ceo sistem sa uključenim novim softversko/hardverskim rešenjima  Detaljni opis rada sa softverskim sistemom - koji se ekran kada otvara i koja opcija koristi za izvršavanje poslova. Šta treba od funkcija da sadrži koji ekran. Opšte osobine (softverskog) sistema - features i detaljnije odredjenje - requirements  poslovna pravila (rules) koja treba automatski da se izvrsavaju - ogranicenja.  potrebni izvestaji (reports) - ekranski i papirni, do nivoa elementarnog podatka  potrebni upiti  Buduce osobine softvera - nece biti ukljucene u ovoj verziji, a mogu da se kasnije dodaju kao unapredjenje, novi modul i sl. (statistika, razmena podataka i sl.)  Zahtevi za osobinama korisničkog interfejsa  Bezbedonosni zahtevi - nacin zastite podataka od neovlascenog prikazivanja, menjanja, kopiranja, pristupanja, backup podataka / replikacija itd.

9

1.1 Model poslovnih procesa Koristimo metodu strukturne sistem analize ciji rezultat je stablo procesa, dijagram toka podataka (kontekst dijagram I dijagrami dekompozicije sve do primitivnih procesa), recnik podataka (opisuje skup elementarnih podataka koji predstavljaju strukturu svakog toka I skladista podataka sa dijagrama toka podataka).

2.1 Model predložnog rešenja Predstavlja se koristeci: Tabelu sa spiskom primitivnih procesa iz stabla procesa, gde se svaki primitivni proces preslikava u skup slucajeva koriscenja softverskog resenja.

Najcesce softverske funkcije u oblasti informacionih sistema:  automatsko izracunavanje podataka  azuriranje (unos, brisanje, izmena) podataka  prikaz podataka (tabelarni, analiticki - pojedinacni)  filtriranje podataka  stampanje izvestaja  eksport podataka (snimanje dela podataka u druge formate - txt, XML, XLS)  statisticka obrada podataka Radna Tip Actor Softverska funkcija * uloga Primitivni softvera (profil izvrsilac korisnika poslovni primitivnog (c/s softverske preduslov LAN, proces poslovnog 1. po 2. po za uspesno funkcije) WEB) procesa prioritetu prioritetu izvrsavanje

Tabela 7.2.1 Softverska funkcija 10

Na osnovu spiska slucajeva koriscenja iz tabele, crta se use case dijagram. Posebno vodimo racuna o medjusobnim odnosima slucajeva koriscenja (najcesce su to Extend, Include, Use, Access). Za jedan odabrani slucaj koriscenja radi se specifikacija prema karticama u properties za slucaj koriscenja sa prethodnog dijagrama: Preduslovi (stanje programa koje mora biti ispunjeno da bi se navedeni slucaj koriscenja mogao pokrenuti), Pseudo kod izvrsavanja toka slucaja koriscenja (interakcije sa korisnikom), Tacke prosirenja (ka drugim slucajevima koriscenja sa kojima je navedeni slucaj koriscenja u odnosu zavisnosti: Extend, Include, Access, USE), Obrada gresaka, Postuslov (rezultat).

7. KONCEPTUALNI MODEL PODATAKA Modeli su sredstvo za pojednostavljivanje složenosti problema kroz posmatranje samo bitnih elemenata za njegovo rešavanje (za ciljeve analize). Čovek uz pomoć apstraktnog mišljenja stvara apstraktni model realnog sveta. Apstraktni model realnog sveta (objekata posmatranja) zasniva se na simbolima. Modeliranjem podataka koji kruže u nekom realnom sistemu dobija se konceptualni model podataka.

Slika 8.1 Modelovanje Modelovanje podataka se radi paralelno sa analizom realnog sistema. Prikupljajući nformacije o realnom sistemu, identifikuju se osnovni objekti, dodeljuju im se imena koristeći termine bliske krajnjim korisnicima. Podaci se analiziraju i modeluju korišćenjem dijagrama objekti11

veze (ER dijagrama). Ako model nije zadovoljavajući, modifikuje se, što ponekad zahteva prikupljanje dodatnih informacija. Ciklus analize i modifikovanja modela se nastavlja sve dok se ne dobije zadovoljavajući model. Modelovane je postupak kojim se realni svet svodi na određeni konačan skup podataka. Podaci su apstrakcija realnosti - sredstva za kodiranje osobina objekata iz realnog sveta. Faze modelovanja su: 

izbor (selekcija) – izdvajanje bitnih objekata,



imenovanje (objekata, njihovih veza, atributa),



klasifikacija nehomogenih objekata u homogene klase (tipove) objekata.

8.1 Entiteti Objekti posmatranja bitni za sistem. Sve što se može jednoznačno odrediti, identifikovati i razlikovati. Svaki entitet ima svoje osobine – atribute. Domen atributa je skup svih mogućih vrednosti koje atribut može dobiti (tip promenljive u programiranju je širi pojam). Primarni ključ - jedan ili više atributa čija vrednost jednoznačno određuje pojavu tipa entiteta. Entitet je objekat posmatranja o kome se prikupljaju, memorišu, obrađuju i prezentuju informacije: o osoba, pojam, stanje, događaj i sl. Entitet po svojoj prirodi može biti različit: o deo okruženja (član kolektiva, uređaj, zgrada, artikal, vozilo ...) o apstraktni pojam (mera, zvanje, boja, ...) o događaj (udes, upis studenata,...) o asocijacija (student-predmet, predmetprofesor, ..., fakultet-profesor)

8.2 Atributi Atribut je zajednička osobina koju poseduju svi entiteti jedne klase. Atributima se opisuju svojstva objekta. Atributi primaju određene vrednosti iz svog domena. Broj atributa određene klase entiteta nije ograničen. Relevantne atribute treba da definiše kompetentna osoba projektant o od toga zavisi kvalitet budućeg informacionog sistema skup dozvoljenih vrednosti koje može da primi jedan atribut.

12

U realnom sistemu objekti nisu međusobno izolovani, već su u međusobnoj interakciji. Odnosi između entiteta prikazuju se najčešće primenom logike skupova i kardinalitetima njihovih međusobnih preslikavanja. Neredundantno čuvanje podataka. Izbegavanje višestrukog ponavljanja podataka. Istovremeni pristup podacima. Mogućnost da veći broj korisnika istovremeno koristi iste podatke. Fizička i logička nezavisnost podataka. Razdvaja se logička definicija baze od njene stvarne fizičke građe (ako se promeni fizička građa BP, to neće zahtevati promene u postojećim aplikacijama). Razdvaja se globalna logička definicija cele BP od lokalne logičke definicije za jednu aplikaciju.

13

8. LITERATURA [1]

Dizajniranje korisničkog interfejsa, B. Shneiderman, C. Plaisant, Beograd, 2005.

[2]

https://www.idoub.com/presentation/366355141/DTP-Dijagrami-Tokova-Podataka

[3]

http://edukacija.rs/it/baze-podataka/dijagram-toka-podataka

[4]

www.google.images.com

14