1. Adelina Bekteshi-Osmani
AAB Departmenti i Shkencave Kompjuterike Analizë e Sistemeve dhe Dizajni Softuerik Dizajni i Ndërfaqes (Interface-it)
Adelina Bekteshi-Osmani

2. User Interface
User Interface (Nderfaqja) eshte pjesa e sistemit me te cilen perdoruesi ndervepron.
Perfshin shfaqjen e ekranit qe siguron levizjen neper sistem (navigation), format qe mbledhin te dhena, raportet qe sistemi prodhon (qofshin ato ne leter, ne veb apo me ndonje media tjeter).

3. Dizajni i Interface-it
Dizajni i Interface-it eshte procesi i definimit se si sistemi do te nderveproje me entitetet e jashtme (p.sh. klientet, furnizuesit, sistemet tjera,…)
Dizajni i Interface-it definon menyren se si sistemi ndervepron me perdoruesit dhe natyren e input-it dhe output-it te cilat sistemi i pranon dhe prodhon.
Se pari kemi mekanizmin e navigimit, menyra se si perdoruesi jep instruksione sistemit (menyte, pullat,…).

4. Dizajni i Interface-it
E dyta eshte mekanizmi input, menyra se si sistemi mbledh informatat (p.sh format per te shtuar nje klient te ri).
E treta eshte mekanizmi output, menyra se si sistemi ofron informata per perdoruesin (raporte, vebfaqe,…).
Dizajni i navigimit, inputit dhe outputit jane te nderlidhura me njera tjetren.
Human Computer Interaction (HCI) fokusohet ne permisimin e nderveprimeve njeri kompjuter, duke bere kompjuteret me te perdorshem.

5. Principet e User Interface Design
Ne shume menyra dizajni i Interface-it eshte forme arti.
Qellimi eshte qe nderfaqja te jete e kendshme per syrin dhe e thjeshte per tu perdorur, si dhe e minimizon perpjekjet e perdoruesit per ti kryer detyrat e tyre.

6. Principet e User Interface Design
Përshkrimi
Plani (Layout)
Nderfaqja duhet te kete zona te ndryshme ne ekran qe perdoren per qellime te ndryshme
P.Sh Zona e siperme per navigim dhe komanda
Zona e mesme per input dhe output
Zona e poshtme per informata rreth statusit
Informimi rreth permbajtjes
Perdoruesi gjithmone duhet te jete ne dijeni se ku jane ne sistem, dhe cfare informata po shfaqen
Estetika
Nderfaqet duhet te jene funksionale dhe terheqese per perdorues, duke perdorur me kujdes hapesirat e bardha, ngjyrat dhe fontet.

7. Principet e User Interface Design
Përshkrimi
Pervoja e perdoruesit
Lehtesia e perdorimit dhe lehtesia e mesimit shpesh shpiejne ne vendime te ngjashme dizajni.
Perdoruesit fillestare dhe ata me te rralle qe perdorin softuerin do te preferojne lehtesi ne te mesuar, ndersa perdoruesit e shpeshte do te dojne lehtesi perdorimi.
Konsistenca
Konsistenca ne dizajnin e nderfaqes u ndihmon perdoruesve te parashikojne cka do te ndosh para se te perfundojne nje veprim. Eshte elementi me i rendesishem ne lehtesine e perdorimit, lehtesine e mesimit dhe estetike.
Minimizimi i perpjekjeve te perdoruesit
Nderfaqja duhet te jete e thjeshte per tu perdorur. Shume dizajnere planifikojne qe te mos kene me shume se tri klikime prej menyse startuese deri ku perdoruesi i kryen detyrat e tij.

8. Layout (Plani)
Principi i pare i dizajnit te nderfaqes, ka te beje me planin e ekranit, formes apo raportit.
Plani i referohet organizimit te fushave te ndryshme ne ekran apo dokument per qellime te ndryshme, si dhe perdorimi i ketyre fusha ne menyre konsistente.
Shumica e dizajneve per kompjutere personal, ndjek standardet e Windows-it apo Mac per organizimin e ekranit.
Pra, ndahet ekrani ne tri zona.

9. Plani i vebfaqës me zonat e shumta të navigimit

10. Layout (Plani)
Ne raste tjera, posacerisht ne veb, me shume zona perdoren.
Zonat e ndryshme ne raporte apo forma mbajne informata te ndryshme.
P.sh ne nje forme te porosise, nje pjese mund te perdoret per informatat e klientit, nje pjese per porosine ne pergjithesi (data, te dhenat per pagese) dhe nje pjese detajet e porosise (sasine e nje produkti te porositur, etj).
Zonat dhe informatat duhet te jene intuitive per te minimizuar perpjekjet e perdoruesve per levizjen nga nje zone ne tjetren.

11. Layout (Plani)
P.sh ne lexojme nga larte poshte, nga e majta ne te djathte, prandaj edhe informatat duhet te jene ne kete renditje.
Ndonjehere renditja mund te jete kronologjike, nga me e pergjithshme deri te me specifike, apo nga me e perdorura te me rralle e perdorura.
Si dhe rrjedha e ketyre zonave duhet te jete konsistente, qofte horizontale apo vertikale.

12. Layout (Plani)
Rrjedha horizontale
Rrjedha vertikale

13. Informimi rreth përmbajtjes
Te gjitha pjeset e nderfaqes navigimi, input dhe output, duhet te siguroje sa me shume informata rreth permbajtjes. Te gjitha nderfaqet duhet te kene tituj, p.sh ne kornizen e ekranit.
Kjo vlen edhe per forma dhe raporte. Te gjitha pjeset duhet te jene te definuara mire dhe te qarta, nese ka hapesire me tituj, te reduktoje shkaqet e ngaterrimit te perdoruesit.
Informimi rreth permbajtjes vlen edhe per fushat ne secilen pjese.
Fushat (fields) jane elemente individuale te te dhenave te cilat jane input ose output.

14. Informimi rreth përmbajtjes
Emertimet e fushave duhet te jene te shkurta dhe specifike- qellime shpesh ne konflikt.
Nuk duhet pasur paqartesi rreth formatit te te informatave ne fusha.
26/05/2015
05/26/2015

15. Shembull i formës

16. Estetika
Estetika i referohet dizajnimit te nderfaqeve qe jane te kendshme per syrin.
Ne shumicen e rasteve “less is more” apo nje dizajn minimalist eshte me i miri.
Hapesira eshte me se e rendesishme ne forma dhe raporte. Shpesh ekziston deshira me fut sa me shume informata ne nje forme apo ekran.
Fatkeqesisht, kjo ben qe perdoruesit nuk deshirojne fare ta plotesojne.
Hapesira e bardhe eshte e domosdoshme ne te gjitha format apo raportet.

17. Estetika
Ne pergjithesi, perdoruesit fillestar edhe ata me te rralle, preferojne forma me densitet me te vogel, deri 50%, pra 50% e nderfaqes eshte me informata.
Ndersa perdoruesit me me pervoje preferojne densistet me te larte te ne 90%, pasi qe e dine ku jane informatat e duhura, te gjitha jane ne nje hapesire me te vogel, dhe duhen levizje me te pakta neper nderfaqe.
Forma e meparshme mendohet se eshte dizajnuar per stafin e zyres se personelit qe e perdorin cdo dite, se sa per stafin e administrates ne departmentin akademik.

18. Estetika Dizajni i tekstit:
Madhesia 8pt me se paku, 10pt per me te vjetrit per format e printuara.
12 pt per format ne ekran.
Times New Roman me i lexueshmi per raporte te shtypura
Tahoma apo Arial per ekrane te kompjuterit.
Shkronjat e medha -???
Ngjyrat me kontraste te medha.
Ngjyra e kuqe provokon zemerim, ndersa e kalterta na ben te pergjumur.

19. Përvoja e përdoruesit
Ketu i referohemi dizajnimit te nderfaqes duke pase parasysh nivelin e njohjes se punes me kompjuter nga perdoruesit.
Sistemi do te perdoret nga njerez me eksperience dhe fillestare, dhe duhet te ndertohet per te dy grupet.
Fillestaret deshirojne lehtesi mesimi, ekspertet lehtesi perdorimi.

20. Përvoja e përdoruesit
Analiza e grupeve te perdoruesve na ndihmon te mbledhim informata per perdoruesit tane qe mandej keto kane implikime ne dizajnin e nderfaqes.
Nese perdoruesit i ndajme ne: Fillestare, Niveli i mesem dhe
Ekspertet
Eshte me rendesi qe te dizajnonjme nje sistem qe permbush karakteristikat e pergjithshme te grupit te perdoruesve.
Fillestaret nuk deshirojne te duken keq sidomos ne vend te punes prandaj do te ngurrojne ta perdorin sistemin ne rast se mund te prishin dicka.

21. Përvoja e përdoruesit
Prandaj sistemi duhet te dizajnohet ne menyre qe eshte veshtire te behen gabime.
Per nivelin e mesem, sigurohemi se sistemi eshte i ngjashem me sistemet e perdorura deri tani.
Ndersa per ekspertet duhet tu sigurojme “keyboard shortcuts” qe ti reduktojne klikimet me mi.
Keto marrin kohe per tu mesuar por perdoruesit me pervoje i preferojne pasi jane me te shpejte.

22. Konsistenca
Konsistenca ne dizajn eshte faktori me i rendesishem ne krijimin e sistemeve qe mesohen lehte.
Perdoruesit veprojne ne nje pjese te sistemit pastaj dijne si te punojne edhe me pjesen tjeter.
Konsistenca ne navigim percjell se si veprimet ne sistem duhet te kryhen.
P.sh e perdorimi i nje ikone apo komande per Insert New tregon se kjo perdoret pergjate tere sistemit.
Konsistenca ne terminologji po ashtu eshte e rendesishme. Nuk ben dikund te kesh “Client” dikund “Customer”.

23. Minimizo Përpjekjet e Përdoruesve
Nderfaqet duhet te dizajnohen te minimizojne perpjekjet e perdoruesve per te kryer detyrat e tyre.
Kjo nenkupton me me se paku kliks apo prekje te tasteve, te kalojme nga nje pjese e sistemit ne tjetrin.
Shumica e dizajnereve percjellin rregullen me tri klikime qe thote se perdoruesit duhet te shkojne ne faqet qe u duhen duke bere jo me shume se tri klikime.

24. Procesi i dizajnimit të ndërfaqes
Wixom, Roth (2012)

25. Procesi i dizajnimit të ndërfaqes
Zhvillimi i skenareve te perdorimit
Dizajni i struktures se nderfaqes
Dizajni i standardeve te nderfaqes
Dizajni i prototipeve te nderfaqes
Vleresimi (Evaluation) i nderfaqes

26. Dizajni i Navigimit
Navigimi ne nderfaqe mundeson perdoruesin te jep komanda te leviz neper sistem dhe te kryej veprime si futja dhe rishikimi i informatave.
Navigimi poashtu prezenton mesazhet per perdoruesit rreth suksesit apo deshtimit te veprimeve te tyre.
Qellimi i navigimit eshte qe ta beje sistemi sa me te thejshte per perdorim.
Komponent i mire i navigimit eshte nje qe perdoruesi nuk e veren, ai thjesht funksionon si perdoruesi e pret te punoj prandaj nuk lodhet se menduari se si shkon perdorimi.
Metaforat

27. Dizajni i Navigimit-Principet themelore
Parandalo Gabimet
Emertimi i komandave dhe veprimeve duhet te jete i sakte, dhe kufizon zgjedhjet, pasi ato mund te ngaterrojne perdoruesin.
Funksionet kritike si fshirja e nje fajlli, duhet te konfirmohet.
Thjeshteso permisimin e gabimeve
“Undo”
Metaforat

28. Llojet e navigimit Komandat
Menyte: Menu Bar (kryesorja), Drop Down Menu, Hyperlink Menu, Pop-Up Menu, Tool Bar, etj.
Mesazhet:
Error Message, Confirmation Message, Delay Message, Help Message
Manipulimi direkt
Shembulli ne Power Point, nderron madhesine e objekteve duke i prekur anash pastaj zgjeruar.

29. Dizajnimi i Input-it Efektiv
Eshte shume e rendesishme qe perdoruesit te kene input kualitativ.
Duhet kushtuar shume vemendje qe format qe perdoren per input dhe dokumentet interaktive ne veb, dizajnohen me kujdes duke pase parasysh lidhjen mes perdoruesit me input kualitativ.

30. Dizajnimi i Input-it Efektiv
Format qe perdoren per input te te dhenave, si dhe format qe plotesohen ne menyre interaktive ne web, duhet te plotesojne objektivat e efikasitetit, saktesise, thjeshtesise se perdorimit, dhe atraktivitetit.
Arritja e ketyre objektivave arrihet duke i ndjekur principet e dizajnit, njohurite se cka na duhet si input ne nje sistem, dhe te kuptuarit se si perdoruesit reagojne ndaj elementeve te ndryshme ne forma.

31. Dizajnimi i Input-it Efektiv
Efikasiteti nenkupton se format e dizajnuara is sherbejne me perpikmeri qellimeve te perdoruesve ne nje sistem informativ, ndersa
Saktesia i referohet aspektit te dizajnit qe siguron kompletim te duhur te te dhenave.
Lehtesia e perdorimit nenkupton qe format dhe veglat tjera te input-it te te dhenave nuk kerkojne kohe shtese nga perdoruesit per te mesuar ti plotesojne.

32. Dizajni i mirë i formave
Analisti i sistemeve duhet te arrije qe te dizajnoje nje forme komplete dhe te dobishme. Format e panevojshme qe harxhojne kohe e para duhet te eliminohen.
Format jane instrumente te rendesishme per te udhehequr aspekte te ndryshme te punes.
Format nxjerrin dhe marrin informata – te dhena qe kerkohen nga anetaret e nje organizate qe pastaj do te futen ne kompjuter.
Prandaj format sherbejne si dokumente –burime te informatave apo per input ne aplikacionet e-comerce qe vet klientet i plotesojne

33. Dizajni i mirë i formave
Kater udhezime per dizajn te mire te formave
1. Bej qe format te plotesohen lehte
2. Sigurohu qe format permbushin qellimet per te cilat jane dizajnuar.
3. Dizajno format qe sigurojne nje kompletim te sakte
4. Bej format atraktive

34. Shembull: Skenari i detyrave
Qellimi i performances S1
Perdoruesi fut kartelen dhe shtyp Pin-in. Kerkon Terheqjen e parave, zgjedh 50 dhe deftese. Merr te hollat, kartelen dhe deftesen.
90% e perdoruesve ekzistues, e kryejne kete detyre per 1 minute.
70% e perdoruesve fillestar e kryejne kete detyre gjithashtu per 1 minute. S2
Perdoruesi fut kartelen dhe shtyp PIN-in. Kerkojne 100 po pastaj e nderrojne mendjen dhe deshirojne ta anulojne transaksionin.
Perdoruesit duhet qe me sukses te dalin nga sistemi dhe te marrin kartelen.

35. Dizajni i mirë i formave
Per te reduktuar gabimet, shpejtuar kompletimin dhe mundesuar futjen e te dhenave, eshte esenciale qe format te mund te plotesohen sa me lehte.
Rrjedha e informatave me forme eshte shume e rendesishme. Informatat organizohen nga e majta ne te djathte apo nga larte poshte. Nje rrjedhje tjeter jo logjike ngadaleson procesin dhe merr me shume kohe.
Informatat duhet te grupohen ne menyre logjike.

36. Shembuj

38. Perdorimi i ngjyres ne dizajnimin e input-it eshte nje menyre e mire per te mundesuar plotesim me te lehte te detyrave qe kerkojne input.
Perdorimi i pershtatshem i ngjyres lejon qe te vejme kontrastin mes prapaskenes dhe paraskenes.
Perdoren ngjyrat kontraste, ne menyre qe perdoruesit te kuptojne shpejt cka u prezentohet.

39. 5 kombinimet me te mire per shkronjat ne nje prapaskene jane:
E zeza ne te verdhe
E gjelberta ne te bardhe
E kalterta ne te bardhe
E bardha ne te kaltert
E verdha ne te zeze

40. Konsiderimet e dizajnit për smartphones dhe tableta -shembuj
Gjestet
Disa gjeste jane themelore, te gjithe njerezit fillojne me prek –”poking” para se te fillojne te flasin. Eshte intuitive, poashtu me shfletu nga e djathta ne te majte.
Ndersa “pinching” me zoom in and out, nuk jane intuitive por kur mesohet mbahet mend.
Dizajnerat perfitojne nga ajo se kur njerezit shohin dicka qe ka kuptim e mesojne dhe adaptohen lehte.

41. Shembull i qëllimeve të përdorshmërisë
Sistemi: Vebsite per regjistrime ne konferenca
Qellimi i perdorshmerise
Efektiv
Me pak se 5% e regjistrimeve do te permbajne gabime te cilat duhet te rregullohen nga stafi i konferences
Efikas
Perdoruesi do te kompletoje regjistrimin me sukses per me pak se 5 minuta
I kendshem
Ne anketen “follow up” se paku 80% te perdoruesve do te tregojne se sistemi online eshte shume komod dhe me i mire se sistemi tradicional
Lehte per tu mesuar
95% e perdoruesve do te kompletojne regjistrimin me sukses ne tentimin e pare

42. Output
Output jane informatat qe paraqiten per perdoruesit nepermes sistemeve informative, permes intraneteve, ekstraneteve apo Web-it.
Disa te dhena kerkojne procesime te ndryshme para se te konsiderohen si Output i pershtatshem, disa te dhena ruhen dhe atehere kur nxirren, mund te konsiderohen si output, pra me shume pak procesim.
Output mund te merr shume forma: Ekran kompjuteri, smartphone, tableta si dhe kopje tradicionale te raporteve te shtypura.

43. Output
Perdoruesit mbeshteten ne Output ti kryejne detyrat e tyre, dhe shpesh i tere sistemi gjykohet vetem ne baze te meritave te output-it.
Per te krijuar output-in me te pershtatshem, analisti i sistemeve duhet te punoje bashke me perdoruesit permes nje procesi interaktiv deri sa te arrihen rezultate qe konsiderohen te kenaqshme.

44. Objektivat e dizajnimit të Output-it
Dizajnimi i output-it eshte esencial ne perdorimin dhe pranimin e nje sistemi informativ. Per kete arsye jane disa objektiva qe analisti i sistemeve mundohet ti realizoje kur dizajnon output-in:
1. Dizajnimi i output-it per ti sherbyer qellimit te caktuar
Te gjithe outputet kane nje qellim. Kjo kuptohet gjate percaktimit te kerkesave, pastaj outputi dizajnohet ne baze te kerkesave.

46. Objektivat e dizajnimit të Output-it
2. Dizajnimi i Output-it ti pershtatet perdoruesit
Sistemet informative mund te jene shume te medha dhe te kene numer te madh te perdoruesve. Prandaj eshte veshtire qe outputi te personalizohet. Ne baze te intervistave, obzervimeve, prototipeve eshte e mundur te dizajnohet nje output qe adreson cka shume (por ndoshta jo te gjithe) perdoruesit deshirojne dhe preferojne.

47. Objektivat e dizajnimit të Output-it
3. Sasia e pershtatshme e Output-it
Pjese e detyres se dizajnimit te output-it eshte edhe vendimi per sasine me te pershtatshme te output-it. Perdoruesi duhet ti kete ato informata te nevojshme per te kryer detyrat e tyre. Mund te jete e pershtatshme qe disa informata te paraqiten fillimisht me mundesine qe ato te zgjerohen permes p.sh nje hiperlinku.

48. Shembull i output-it

49. Shembull i output-it

50. Objektivat e dizajnimit të Output-it
4. Te sigurohet output-i me kohe
Nje nga ankesat me te shpeshta te perdoruesve eshte se nuk pranojne informata me kohe ne menyre qe te marrin vendimet e nevojshme. Shume raporte kerkohen ne baza ditore, disa cdo muaj, te tjeret ne baze vjetore.
5. Zgjedhja e duhur e metodes se Output-it
Gati gjithe output-i paraqitet ne ekrane, dhe perdoruesit e kane mundesine te shtypin me printerin e tyre. Analisti duhet vendos per metoden me te pershtatshme te output-it.

51. Krahasimi i metodave të Output-it
Perparesite
Mangesite
Printeri
Cmimet e perballueshme ….
Mund te jete i ngadalshem
“Environmentally unfriendly”
Ekrani
Interaktiv, Pazhurme
I mire per qasje te shpeshte, transmetim ne kohe reale
Mund te kerkoje lidhjet me kablla dhe hapesire
Kerkohet qe sistemi te merr “snapshots” te ekranit dhe ruajtja e tyre per perdorim te mevonshem
Audio Output
I mire per perdorues individual
I mire kur na duhen duart e lira
Te duhen ndegjueset per te mos penguar
Pajisjet Mobile
Interaktiv, I transferueshem (portable)
Mund te “zoom”
Ekrani mund te jete shume i vogel
Output-i Elektronik
Redukton letren, mund te freskohet lehte
Nuk mund te formatizohet lehte( )
Webfaqet kane nevoje per mirembajtje

52. Dizajnimi i Output-it
Nese perdoret output-i grafik duhet ti kushtohet vemendje e vecante qe paraqitja grafike te jete sa me e sakte dhe e kuptueshme, pasi qe gabimet verehen me lehte se sa p.sh te tabelat.

54. Dizajnimi i Output-it
Fushat tjera per dizajnimin e Output-it eshte Dizajnimi i Website-eve.
Ceshtje mjaft e komplikuar pasi teknologjia qe posedon perdoruesi nuk mund te kontrollohet, pastaj kemi qasjen ne website nga tabletat e smartphones.
Udhezimet per website dizajn mesohen ne kurse tjera, por rekomandohet te perdoren vegla dizajnimi, studiohen website te tjera, studiohen websitet e dizajnereve profesioniste, shiqo edhe shembujt e dobet te dizajnimit si dhe audio dhe video plug- ins i perdorim me rralle.

56. Literatura
Denis A. ,Wixom B., Roth R. Systems Analysis and Design (2012) John Wiley & Sons Inc. (Fifth Edition) Kapitulli 9
Kenneth E. Kendall, Julie E. Kendall. Systems Analysis and Design (2014) Pearson (Ninth Edition)
Sharp H.,Rogers Y.,Preece J . Interaction Design: beyond human-computer interaction (2007) John Wiley & Sons Inc. (Second Edition)
Laudon K., Laudon J. Management Information Systems. Prentice Hall(2006)
Bocij.P, Chaffey.D, Greasley.A, Hickie.S. Business Information Systems –Technology , Development and Management for the e-business (2003)