Erinevus lehekülje "Kasutajaliidesed (ITI0209)" redaktsioonide vahel

Allikas: Kursused
Mine navigeerimisribale Mine otsikasti
 
(ei näidata sama kasutaja 472 vahepealset redaktsiooni)
1. rida: 1. rida:
−
{{UI}}Kursuse kood: <b>ITV0209</b><br>
+
{{UI}}'''Kursuse kood:''' ITI0209<br>
−
Link: https://courses.cs.ttu.ee/pages/ITV0130<br>
+
'''Link:''' https://courses.cs.ttu.ee/pages/Kasutajaliidesed_(ITV0209)<br>
−
Õppejõud: Martin Verrev, [https://www.linkedin.com/in/kristian-lember-254a2a6a/ Kristian Lember]<br>
+
'''Õppejõud:''' Martin Verrev, martin.verrev@taltech.ee, TTÜ ruum ICT-422<br>
−
Kontakt: martin.verrev@ttu.ee, TTÜ ruum ICT-422<br>
+
'''Kurusus Moodle keskkonnas:''' https://moodle.taltech.ee/course/view.php?id=30645,  <strong>registreerumise kood:</strong>ITI020925<br>
−
2018 aasta kursuse lehte näed siit: [[Kasutajaliidesed_(ITV0130))_2019]]<br>
+
'''Kursuse Teams'i kanal:''' ITI0209 (2025) Kasutajaliidesed, <strong>registreerumise kood:</strong>e50tfje<br>
 +
'''Koht:''' Loengud ja praktikumid toimuvad auditooriumis '''ICT-507'''<br>
 +
'''Aeg:''' Semestri jooksul igal teisipäeval: '''loeng kell 12:30-14:00 ja praktikum 14:15-15:45'''<br>
 +
'''Arhiiv:''' 2024 aasta kursuse lehte näed siit: [[Kasutajaliidesed_(ITI0209))_2024]]<br>
  
−
Jooksva info edastamiseks on kursusel [https://kasutajaliidesed2020.slack.com/ Slacki kanal] millega saab liituda kasutades  [https://join.slack.com/t/kasutajaliidesed2020/shared_invite/enQtOTE1NDU4NDE1MzQ3LTg5MGRiNDU5OTA5NGIyODQ3MzUwYmMwZTI0ZTdmOTg5ODMxMmFkOWI2ZTk2ZTAwZjUxOGI4MDc2OWZmNjRlNjU seda linki] <b>(link uuendatud)</b>
 
  
−
== Aeg, koht, tulemus ==
+
== 27. mai kontrolltöö - aeg ja koht ==
−
Loeng toimub igal teisipäeval kell 16:00-17:30 U05-103
 
  
−
Praktikumid toimuvad eri gruppidele neljal erineval ajal. Esimesel nädalal on juhendaja Martin Verrev ja Kristian Lember, edasi on praktikumides abiks abiõppejõud.
+
Kuna ICT majas toimuvad ehitustööd ja ka 5 korrusel on see piisavalt segav, siis broneerisin kontrolltööks eraldi ruumid:
 +
* Teisipäev 27. mai kell 12:30, auditoorium <strong>ICO-221 (IT Kolledz)</strong>
 +
* Teisipäev 27. mai kell 14:15, auditoorium <strong>U04-103 (Peamaja)</strong>
  
−
NB! Praktikumide eesmärgiks on teha ise ülesande kallal tööd, küsida juhendajalt probleemide korral abi ja esitada valmis või osaliselt valmis töid juhendajale. Praktikumides enamasti ei esitata üldist infot/materjale/näiteid kõigile vaatamiseks: selleks on loeng.
 
  
−
- neljapäeval kell 10:00 ruumis ICT-122
+
== Üldine ülevaade ==
−
- neljapäeval kell 12:00 ruumis ICT-122
 
  
−
Kursus lõpeb hindelise arvestusega. Hinne sõltub kursuse jooksul tehtud praktikumide tulemustest (60%) pluss kursuse lõpus toimuva kontrolltöö tulemustest (40%).
+
Kursuse lõpetaja:
 +
* Oskab hinnata liidese visuaaldisaini kvaliteeti ja terviklikkust.​
 +
* Oskab luua ja valideerida kasutajakeskset nii arvutile kui nutiseadmetele loodud kasutajaliidest.​
 +
* Suudab osaleda UX arendusprotsessis nii täitja kui tellijana.
 +
* Oskab andmeid visualiseerida.
  
−
'''Juhime kõigi praktikumijuhendajate poolt tähelepanu, et praktikumitöö arvestamine ja hindamine toimub ainult sinu grupi ajal! Muude gruppide aegadel võetakse töid vastu ainult juhul, kui ei ole kedagi õigest grupist, kes sooviks tööd esitada / konsulteerida, st reeglina mitte arvestuse viimasel nädalal.'''
+
Semestri jooksul toimub õppetöö kaheliikmelistes gruppides, kus luuakse ja valideeritakse kasutajaliides enda poolt väljamõeldud teenusele. Loodud teenuse tagarakendust kursuse jooksul reaalselt valmis programmeerima ei hakka :)
  
−
Loengute järelevaatamiseks kasutage seda linki: https://echo360.org.uk/section/0555d50c-6171-4ce0-a79d-fae7f21715e8/public
 
  
−
== Hindamine ==
 
−
[[Pilt:ITV0130-Excel-error.png|right]]
 
−
Aine hinnatakse 100 punkti skaalal; saadaval olevate punktide hulk on veidi suurem. Punktid kogutakse semestri jooksul ja jaotuvad:
 
  
−
* 15 punkti: [[UI:Kodutöö 1 (2019)|Kodutöö 1: Kasutajavood ja staatiline prototüüp. Kasutajatestimine.]]  17. veebruari nädal.
+
== Loengud ==
−
* 15 punkti: [[UI:Kodutöö 2 (2019)|Kodutöö 2: HTML Prototüüp ja CSS raamistikud.]]  18. märtus nädal
 
−
* 15 punkti: [[UI:Kodutöö 3 (2019)|Kodutöö 3: Funktsionaalne prototüüp ja Vue.js]] 30. aprilli nädal
 
−
* 15 punkti: [[UI:Kodutöö 4 (2019)|Kodutöö 4: Valideeritud rakendus. Andmete visualiseerimine]] 14. mai nädal
 
−
* 40 punkti: kontrolltöö
 
  
−
Iga töö annab 0-15 punkti. <font color="red">Hilinenud tööd annavad poole punktidest.</font> Töid võib (ja on soovitav) esitada enne tähtaega.
+
=== Nädal 1: Sissejuhatus: Hea kasutajaliides ===
  
−
<font color="red">'''NB!'''</font>Kui sinu praktikum on õigeaegselt arvestatud, siis saad <font color="red">ühel korral</font> esitada täiendusi kuni nädalalani enne järgmise praktikumi tähtaega, ilma pooli punkte kaotamata.
+
[[Media:ITI0209_25_01_Good_UI.pdf | Loenguslaidid ]]
−
* Kui sinu praktikum ei ole õigeaegselt arvestatud, siis on sul esitamiseks aega veel kolm nädalat peale tähtaega (välja arvatud neljas ja viies praks), aga selliselt hilinenud praks annab ainult pooled punktid.
 
−
* Üle kolme nädala hilinenud praks annab edukal arvestamisel ainult üheainsa punkti.
 
−
* Oma tööd saad arvestuseks esitada <b>ainult</b> oma rühma praksi ajal. Lihtsalt nõu ja abi saad küsida ka teistel aegadel. Kui sa ei ole üheski rühmas, siis on esimene kaitsmisaeg vaba aga hiljem hakkad oma töid kaitsma selle rühma juures kus kaitsesid esimese töö.  
 
  
−
Kõik tööd tuleb esitada ise TTÜ arvutiklassis: emailiga saadetud töid ei vaadata. Kasutada võib nii klassi arvuteid kui oma arvutit, brauser ja operatsioonisüsteem on vabalt valitavad. Programmeerimstööde presenteerimiseks tuleb kasutada ülikooli serverit dijkstra: kõiki prakse vaatavad õppejõud ainult sealt serverist. Kindlasti loe [[Dijkstra server|dijkstra serveri kasutamise õpetust]].
+
=== Nädal 2: Disainiprotsess: Double Diamond ===
  
−
Kursuse edukaks läbimiseks ja kontrolltööle pääsemiseks peavad kõik kohustuslikud praktilised tööd olema tehtud.
+
* [[Media:ITI0209_25_02_Design_Process.pdf | Loenguslaidid ]]
 +
* Praktikum: Meeskondade moodustamine; [[ITI0209_25_02_Assignment | loovusharjutus ]]
 +
* <strong>Ülesanne 10. veebruariks</strong> Ülesandepüstituse kirjeldamine: https://moodle.taltech.ee/mod/assign/view.php?id=360121
  
−
== Kontroltöö ==
+
=== Nädal 3: Briif ===
  
−
Kursuses on peale praktikumide ka üks kohustuslik kontrolltöö, mis toimub semestri viimasel nädalal ja annab maksimaalselt 40 punkti. Kontrolltööle pääsemiseks pead olema vähemalt 1-le punktile kaitsnud 1-3 praktikumitöö. Edukaks sooritamiseks pead kontrolltöös saama vähemalt 51% kogupunktisummast ja kogu kursuse eest (praktikumid+kontrolltöö) vähemalt 51 punkti. Kontrolltööd saab kirjutada ühel korral.
+
* [[Media:ITI0209_25_03_Brief.pdf | Loenguslaidid]]<br>
 +
* [[Media:ITI0209_25_03_Design_Challenge.pdf ‎ | 3. praktikum - Design Challenge]]
  
−
Kontrolltöö jaoks on sul valida kaks võimalikku päeva.
+
=== Nädal 4: Tulemid: Kasutajavood ja sõrestikmudel ===
  
−
* teisipäeval 14. mail kell 10:00 '''auditooriumis U06a-201'''
+
* [[Media:ITI0209_25_04_Deliverables_Flows_Wireframes.pdf | Loenguslaidid]]<br>
−
* neljapäeval 16. mail kell 12:00 IT kolledzis, auditooriumis EIK-316
+
* [[Media:ITI0209_25_04_Paper_Prototyping.pdf | 4. praktikum - Paberprototüüpimine]]
  
−
Praktikumiaegades on veel võimalik kaitsta koduseid töid, aga peale 17. maid on kursus lõppenud: ülesandeid enam ei vaadata ja rohkem kontrolltöösid ei tehta.
+
=== Nädal 5: Tulemid: Persoonad ===
  
−
'''Kontrolltööle võtke kaasa pildiga dokument'''
+
* [[Media:ITI0209_25_05_Deliverables_Personas.pdf | Loenguslaidid ]]
  
 +
=== Nädal 6: Sisukaart. Kasutatavuse testimine ===
  
−
=== Kontroltöö sisu ===
+
* [[Media:ITI0209_25_06_Sitemap.pdf | Tulemite jätk - sisukaart ]]
 +
* [[Media:ITI0209_25_06_Usability_Testing.pdf | Loenguslaidid ]]
 +
* <strong>Meeskonnapõhine kodune ülesanne 03. märtsiks: Figma prototüüp</strong> https://moodle.taltech.ee/mod/assign/view.php?id=703475. Juhul kui varem Figmaga kokku puutunud ei ole, siis sissejuhatuseks on hea näiteks see õpetus: https://help.figma.com/hc/en-us/sections/4405269443991-Figma-for-beginners-4-parts
  
−
Kontrolltöö eesmärgiks on kontrollida kursuses läbitud teemadest sisulist arusaamist. Seal on nii vabatekstis kui valikvastustega küsimusi ja lihtsamaid programmeerimisülesandeid. Konkreetsed klasside nimed, teekide nimed, teegifunktsioonide nimed jne ei ole kontrolltöö teema: need antakse ülesandes ette või võite kasutada umbkaudset nime.
+
=== Nädal 7: Sissejuhatus disainisüsteemi ===
  
−
Oskused ülesannete lahendamiseks peaks olema automaatselt kõigil, kes on praktikume süvenemisega teinud.
+
* [[Media:ITI0209_25_07_Design_Systems_Intro.pptx | Loenguslaidid ]]
−
Kontrolltöö punktid lisanduvad praktikumi punktidele.
+
* Praktikum: Individuaalsed konsultatsioonid
  
−
Alla 50% kontrolltöö tulemus tähendab ebaõnnestumist.
+
=== Nädal 8: Disainisüsteem: Tüpograafia ja Värvid ===
  
 +
[[Media:ITI0209_25_08_Design_Systems_02.pdf | Loenguslaidid ]]<br>
 +
Praktikum: Sissejuhatus Bootstrappi
  
−
=== Teemade loend ===
+
=== Nädal 9: Disainisüsteem: Layout. Vormid ===
  
−
Siin on esitatud valik teemasid mis kontrolltöösse tulla võivad. Oluline on sisuline arusaamine, mite
+
* [[Media:ITI0209_25_09_Design_Systems_03.pdf | Loenguslaidid (Layout) ]]
 +
* [[Media:ITI0209_25_09_Forms.pdf | Loenguslaidid (Vormid) ]]
 +
* [[Media:ITI0209_25_09_Prax_Forms.pdf | Praktikum - Vormid ]]
  
−
* Kasutajateekond, flow
+
=== Nädal 10: Otsing. Filtrid ===
−
* Layout
+
 
−
* Grid
+
* [[Media:ITI0209_25_10_Search_Filters_Sort.pdf | Loenguslaidid ]]
−
* Navigatsioon (nupud, menüü jne)
+
* [[Media:ITI0209_CSS_SASS.pdf | Praktikum: CSS eelprotsessorid. SASS ]]
−
* Keskkonna struktuur
+
 
−
* CTA (Call to Action)
+
=== Nädal 11: Sisu ===
−
* Pealkirjade hierarhia
+
 
−
* Kasutajatestimine
+
* [[Media:ITI0209_25_11_Content.pdf | Loenguslaidid ]]
−
* Gestaltprintsiibid, hea lühikokkuvõte on siin: http://www.paberimuuseum.ee/disainiABC/site/lesson3-1.html
+
* Praktikum: [[Media:ITI8740_24_09_Prax_Content.pdf | harjutus ]].  
−
* HTML raamistikud, lihtsamad programmeerimisülesanded teie poolt valitud raamistikel
+
* Lisaks: Turingu Serveri kasutamine
−
* Lehe kohandamine mobiilivaadetele
+
 
−
* CSS eelprotsessorid
+
=== Nädal 12: Juurdepääsetavus ===
−
* BEM
+
 
−
* Veebikomponendid, shadow-DOM
+
* [[Media:ITI0209_25_12_Accessibility.pptx | Loenguslaidid]]<br>
−
* Lihtsam Vue/React
+
* Praktikum: Konsultatsioonid ja abi
−
* KPI-d
+
 
 +
=== Nädal 13: Sissejuhatus andmete visualiseerimisse ===
 +
 
 +
* [[Media:ITI0209_25_13_Visualization_Intro.pdf | Loenguslaidid]]<br>
 +
* Praktikum: Sissejuhatus Echartsi
  
−
== 2020 aasta loenguslaidid ==
+
=== Nädal 14. Visualiseerimise jätk ===
  
−
* Loeng 1: [https://docs.google.com/presentation/d/1n9d4uGMVtVvlxoaorpJxdaFPKpcqNaB-BDCZXoUyqVs/edit#slide=id.g76a0b8990d_0_6 Ülevaade disainiprotsessist]
+
* [[Media:ITI0209_25_14_Principles_of_Visualization.pdf | Loenguslaidid]]<br>
−
* Loeng 2: [https://docs.google.com/presentation/d/1tmtFrQVCvyffwnKDu9Ala504hbdaiap9zGDD1KBAw8M/edit?fbclid=IwAR0DCzhSj5ENs7cqxeuba1seSNFAWMS8MjwyG2JA5UbFMInxQ8OZBr9bEL4#slide=id.p Projekt, näited, tööriistad]
+
* Praktikum (Teamsis). Visualiseerimisest ja andmete leidmisest räägib prof. Tanel Tammet
  
−
== Eelmise aasta loenguslaidid ==
+
=== Nädal 15. Dashboard ===
  
−
Loengute videosalvestised on kättesaadavad [https://echo360.org.uk/section/3c82e893-acf4-4e75-ac23-6bc45861d5fb/public sellelt lingilt].
+
[[Media:ITI0209_25_15_Dashboard.pdf | Loenguslaidid]]<br>
 +
Praktikum: Jätkame andmete leidmisega. Konsultatsioonid ja abi.
  
−
* Loeng 1: [https://docs.google.com/presentation/d/1n9d4uGMVtVvlxoaorpJxdaFPKpcqNaB-BDCZXoUyqVs/edit Sissejuhatus disaini]
+
=== Nädal 16. Kursuse kokkuvõte ===
−
* Loeng 2: [https://docs.google.com/presentation/d/1dIfQab7ns7mhZFyDzsgdx6ff8jbjQ-n1tC8XTXt4CLQ/edit Kasutajakogemuse disain: UX]
 
−
* Loeng 3: [https://docs.google.com/presentation/d/1qVjyJo-r206XstoH4U6kAStwpMEf9K_7ZR4_esp7y4Y/edit Kasutajakogemuse disain: Wireframe]
 
−
* Loeng 4: [https://docs.google.com/presentation/d/1t2tICnUFY2isBphGHjj_3pitG8fHOWmPUCb0GrBSGu8/edit Kasutajakogemuse disain: Wireframe. Prototüüp. Testimine.]
 
−
* Loeng 5: [https://www.dropbox.com/s/1ezpk23ypjsnize/ttu_visualdesign.pdf?dl=0 Visuaalne disain graafilise kasutajaliidese kontekstis]
 
−
* Loeng 6: [https://www.beautiful.ai/deck/-LXO_WhqKYVnDhCfnn7M/ITV0130-CSS-raamistlikud Kasutajaliideste arendaja roll. CSS raamistikud]
 
−
* Loeng 7: [https://www.beautiful.ai/deck/-L_TKpi0_FhW60VKz-1Y/ITV0130-CSS-SASS-LESS Hallatav CSS. Eelprotsessorid]
 
−
* Loeng 8: [https://www.beautiful.ai/deck/-LaHEUnlSRf679jiuxwm/ITV0130-BEM Hallatav CSS. BEM]
 
−
* Loeng 9: [https://www.beautiful.ai/deck/-LaqnjrE3g0a_NhCU7Y1/ITV0130-Web-Components Hallatav HTML. Sissejuhatus veebikomponentidesse]
 
−
* Loeng 10: Veebikomponentide jätk
 
−
* Loeng 11: [https://www.beautiful.ai/deck/-Lc-f1fSqwKBlQ-7fpVD/ITV0130-Component-Frameworks-VueJS Komponendiraamistikud. Vue.js]
 
−
* Loeng 12: Vue.js jätk
 
−
* Loeng 13: Vue.js + NPM. SPA.
 
−
* Loeng 14: [https://www.beautiful.ai/deck/-LdOegkRcVwgqH_1nyUQ/ITV0130-Telling-Stories-with-Data Andmete visualiseerimine. Dashboard.]
 
−
* Loeng 15: [https://www.beautiful.ai/deck/-LeE9qoHCMB682wZ83SQ/ITV0130-SVG-Animations SVG. Animatsioonid]
 
−
* Loeng 16: Kontrolltöö
 
  
 +
[[Media:ITI0209_25_16_Summary.pdf | Loenguslaidid]]<br>
 +
Praktikum: Alustame 3. praktikumitööde kaitsmisega
  
  
 
<!--
 
<!--
−
Kursuse kordajatele: varasemate aastate kontrolltöö hinde võib paluda otse üle kanda.
+
 
 +
* [[Media:ITI0209_25_CSS_SASS.pdf | Praktikum: CSS eelprotsessorid. SASS ]]
 +
 
 +
 
 +
=== Nädal 9: Disainisüsteemi jätk. Värvid, Layout ===
 +
 
 +
* [[Media:ITI0209_24_09_Design_Systems_02.pdf | Loenguslaidid ]]
 +
* [[Media:ITI0209_CSS_SASS.pdf | Praktikum: CSS eelprotsessorid ]]
 +
 
 +
=== Nädal 10: Vormid ===
 +
 
 +
* [[Media:ITI0209_24_10_Forms.pdf | Loenguslaidid ]]
 +
* [[Media:ITI0209_24_10_Prax_Forms.pdf | Juhend praktikumiks ]]
 +
 
 +
=== Nädal 11: Otsing. Filtrid ===
 +
 
 +
* [[Media:ITI0209_24_11_Search_Filters_Sort.pdf | Loenguslaidid ]]
 +
* [[Media:ITI0209_24_11_Prax_Tailwind.pdf | Praktikum: Sissejuhatus Tailwind CSS-i ]]
 +
 
 +
=== Nädal 12:Sisu ===
 +
 
 +
* [[Media:ITI0209_24_12_Content.pdf | Loenguslaidid ]]
 +
* [[Media:ITI0209_24_12_Prax_Content.pdf | Harjutus praktikumiks ]]
 +
 
 +
=== Nädal 13:Juurdepääsetavus ===
 +
 
 +
* [[Media:ITI0209_24_13_Accessibility.pdf | Loenguslaidid]]<br>
 +
* Praktikum: Konsultatsioonid ja abi
 +
 
 +
=== Nädal 14. Sissejuhatus andmete visualiseerimisse ===
 +
 
 +
[[Media:ITI0209_24_14_Visualization_Intro.pdf | Loenguslaidid]]<br>
 +
Praktikum: Sissejuhatus Echartsi
 +
 
 +
=== Nädal 15. Visualiseerimise jätk ===
 +
 
 +
[[Media:ITI0209_24_15_Principles_of_Visualization.pdf | Loenguslaidid]]<br>
 +
Praktikum: Dünaamiline Echarts
 +
 
 +
=== Nädal 16. Dashboard ===
 +
 
 +
[[Media:ITI0209_24_16_01_Dashboard.html.pdf | Loenguslaidid]]<br>
 +
Praktikum: Individuaalsed konsultatsioonid.
 +
 
 +
 
 +
Nädal 15. Visualiseerimise jätk
 +
Nädal 16. 3. töö kaitsmine
 +
 
 
-->
 
-->
  
−
== Viidete kogu ==
+
== Iseseisvad tööd ==
  
−
===Koodinäiteid===
+
Sarnaselt varasemate aastatega esitatalkse kursuse käigus kolm kohustuslikku iseseisvat tööd. Iseseisvad tööd esitatakse Gitlab'is.
−
[https://github.com/martinve/itv0130 Kursuse koodinäiteid Githubis]
 
  
−
===Lugemist===
+
1. [[ITI0209 kevad 2025 1. kodutöö kirjeldus | Staatiline prototüüp]], tähtaeg: Neljapäeval 20. märts kell 17:00<br>
 +
2. [[ITI0209 kevad 2025 2. kodutöö kirjeldus | HTML Prototüüp]], tähtaeg: Teisipäev 29. aprill kell 23:59<br>
 +
3. [[ITI0209 kevad 2025 3. kodutöö kirjeldus | Andmete visualiseerimine]], Esmaspäev 19. mai kell 20:00, esitatud tööde põhjal moodustatakse kaitsmisgraafik mida jagatakse Teamsis. Nendel kes sellel semestril kaitsevad bakalaureusetööd, on tähtajaks neljapäev 22. mai kell 20:00<br>
  
−
* Spolsky: [http://www.joelonsoftware.com/uibook/fog0000000249.html User Interface Design For Programmers] - kontrollitundest, kasutajamudelist ja päris inimestest
+
=== 3. iseseisva töö kaitsmine ===
−
* A List Apart: [http://alistapart.com/article/indefenseofeyecandy In Defence of Eye Candy] - miks ilus liides on "parem".
 
−
* Brandon Walkin: [http://www.brandonwalkin.com/blog/2009/08/10/managing-ui-complexity/ Managing UI complexity] - sellest kuidas asju kasutaja eest ära peita
 
−
* Ask Tog: [http://asktog.com/atc/principles-of-interaction-design/ First Principles of User Interaction Design] - tee liides valmis ja loe see uuesti läbi
 
−
* Nielsen: [http://www.nngroup.com/articles/ten-usability-heuristics/ 10 heuristilist kriteeriumit] - liidese testimiseks
 
−
* [http://ui-patterns.com/patterns UI-Patterns.com] - input, navigation, data
 
−
* [http://friedcellcollective.net/outbreak/2007/12/13/messing-up-the-interface/ kuidas vormid koledaks lähevad] ja [http://www.lukew.com/ff/entry.asp?1502 vormide disainist]
 
−
* [https://viki.pingviin.org/Stiilijuhend_tarkvara_t%C3%B5lkimiseks Stiilijuhend tarkvara tõlkimiseks]
 
−
* [https://www.ttu.ee/tugistruktuur/veebitugi-4/sisuloome-tugi/sisuteksti-koostamine-2/ Sisuteksti koostamine]
 
  
−
===Tehniline===
+
Vormi https://forms.gle/UFoCXhWLB67vLemH9 kaudu tekib virtuaalne järjekord iseseiva töö kaitsmiseks üle Teamsi. Palun täita see võimalikult kohe, aga 2 tundi enne selle päeva kaitsmiste algust. Selle tulemusel tekib kaitsmisgraafik mida õppejõud täidab jooksvalt ja mille linki jagatakse Teamsi kanalis.
 +
 
 +
Võimalikud kaitsmisjad  on:
 +
* Neljapäeval 22. mail kell 14:00 - 15:30
 +
* Neljapäeval 22. mail kell 16:00 - 17:30
 +
* Reedel 23. mail kell 15:00 - 16:30
 +
* Esmaspäeval 26. mail kell 12:00 - 13:30
 +
* Esmaspäeval 26. mail kell 14:00 - 15:30
 +
 
 +
Et leida aeg mis kõige sobivam, siis märkige siia, millised ajad teile ja teie tiimikaaslastele selles vahemikus ei sobi - kaitsmisel peaks olema kohal kogu meeskond.
 +
 
 +
Vastuste põhjal tekib kaitsmiste ajakava. Igal väljapakutud ajal teeb õppejõud Teamsi-koosoleku, kus registreerunud saavad oma töid esitada. Iga kaitsmine võtab aega ligikaudu 10 minutit. Ülejäänud on teretulnud pealtvaatajatena.
 +
 
 +
== Kursuse lõpetamine, kontrolltöö ==
 +
 
 +
Kursuse viimaseks ülesandeks on kontrolltöö. Kontrolltöö toimub loengutes, praktikumides ja iseseisvate tööde käigus läbitud teemade kohta. Küsimused puudutavad ainult neid teemasid mida loengutes ja praktikumides oleme käsitlenud ja mille kohta on ka loenguslaidid.
 +
 
 +
Orienteeruv kontrolltöö kirjutamise aeg on 1 .. 1.5 tundi.
 +
 
 +
Kontrolltöö toimub kohapeal paberil ja igasuguste abimaterjalide ja kõrvalise abi kasutamine on keelatud.
 +
 
 +
==== Võimalikud põhiteemad kordamiseks ====
 +
 
 +
* Kasutajaliides ja kasutatavus. Põhimõisted. Kasutajaliidese põhielendid.
 +
* Kasutajaliidese arendusprotsess, rollid arendusprotsessis, üleantavad tulemid
 +
* Persoonad ja kasutajavood
 +
* Kasutajatestimine
 +
* Disainisüsteem ja selle elemendid (värvid, tüpograafia, paigutus jne)
 +
* Vormid
 +
* Otsing ja filtreerimine
 +
* Sisu
 +
* Visualiseerimine, õige visualiseerimismeedodi valik
  
−
''Kontrolltöö mõttes tasub mõelda praktikumi- ja kodutööde mahus.''
+
Kontrolltöö tegemiseks on järgmised ajad.
 +
* Teisipäev 27. mai kell 12:30, auditoorium <strong>ICO-221 (IT Kolledz)</strong>
 +
* Teisipäev 27. mai kell 14:15, auditoorium <strong>U04-103 (Peamaja)</strong>
  
−
* CSS (vt http://www.w3schools.com/css/default.asp). Peab aru saama põhimõtetest ja näidetest. Konkreetsete omaduste ja atribuudite nimesid ise välja ei pea mõtlema.
+
=== Turingu serveri kasutamine ===
−
* Javascript (vt http://www.w3schools.com/js/default.asp). Peab aru saama väikestest näidetest a la js inclusion, vormist teksti kättesaamine ja muutmine, domi kättesaamine ja muutmine. Ei pea oskama erinevaid teeke.
 
−
* Json/ajax (vt http://www.w3schools.com/ajax/default.asp). Peab oskama kirjutada väikese JSONi kasutava ajaxi näite. Väike progeülesanne.
 
−
* HTML DOM põhipunktid
 
  
−
== Niisama huvitavat lugemist ==
+
[[Turingu serverisse rakenduse paigaldamine]]
  
−
''Kontrolltöö eel siit õppida pole tarvis; siin on lihtsalt lahedused''
+
== Hinde moodustumine ==
  
−
* [[Noppeid (ITV0130)|Noppeid]] - ekraanipiltide kogu
+
Lõpphinne moodustub järgmistest pukntidest:
−
* [https://www.codeschool.com/courses/shaping-up-with-angular-js Shaping up with angular] - imeline angulari veebikoolitus (aga spämmib teid pärast rohkelt äraütlemisvõimalusega)
 
−
* [http://www.theverge.com/2013/1/24/3904134/google-redesign-how-larry-page-engineered-beautiful-revolution Redesigning Google: How Larry Page Engineered Beautiful Revolution] - kuidas Google ennast hiljuti ümber ehitas
 
−
* [http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown Amazoni alam-menüü nipp]
 
−
* [http://paulrouget.com/e/devtoolsnext/ Firefox developer tools] - lahedusi Mozillalt
 
−
* [http://www.trinidad.ee/public/materjalid/Kasutajakeskse_veebi_lehekylgede_disain.pdf RISO: Kasutajakeskse veebi lehekülgede disain (.pdf)]
 
−
* [http://msdn.microsoft.com/en-us/library/windows/desktop/aa511258.aspx Windows User Experience Interaction guidelines] - Win7
 
−
* [http://msdn.microsoft.com/en-us/library/windows/apps/hh465424.aspx UX Guidelines for Windows Store apps] - Win 8
 
−
* [http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/MobileHIG/Introduction/Introduction.html iOS Human Interface Guidelines]
 
−
* [https://developer.android.com/design/index.html Android UI Design]
 
−
* [https://developer.gnome.org/hig-book/stable/ GNOME Human Interface Guidelines]
 
−
* [https://medium.com/product-design/5ccef7b3e1fc Kuidas iOS lapikumaks muutub aja jooksul]
 
−
* [http://www.behance.net/rogeroddone Google Visual Asset Guidelines] - Google'i ikonograafia loomisest
 
−
* [http://www.theverge.com/2013/8/29/4640308/dark-patterns-inside-the-interfaces-designed-to-trick-you Dark Patterns] - salakavalatest kasutajaliidese mustritest.
 
−
* [https://medium.com/@zmh/bye-google-maps-ea3ea10f84dc CityMapper vs Google Maps] - UX võrdlus
 
−
* [http://www.allenpike.com/2014/schrodingers-shift-key/ iOS 8 ja shift]
 
−
* [https://xss-game.appspot.com/ Cross-Site Scripting] - tore mäng turvaprobleemidest kasutajaliidese ehitamisel
 
−
* [http://eev.ee/blog/2012/04/09/php-a-fractal-of-bad-design/ Vihakõne PHP suunal] - väga must huumor
 
−
* [http://blog.martindoms.com/2011/01/24/poor-ui-design-can-kill/ Kuidas lennuk valesti disainiti ja inimesed katki läksid sellest]
 
−
* [http://www.fastcodesign.com/3053406/how-apple-is-giving-design-a-bad-name How Apple Is Giving Design A Bad Name] - kuidas Apple oma liideste disainiga veidi rappa on jõudnud
 
−
* [https://www.npmjs.com/package/jade Jade - miinimumsüntaksiga HTML]
 
−
* [http://sass-lang.com/guide Sass - miinimumsüntaksiga CSS]
 
−
* [https://www.fastcodesign.com/90157153/don-norman-what-went-wrong-in-hawaii-human-error-nope-bad-design Havai tuumahoiatus ja disain]
 
−
* [https://medium.com/@urschanselmann/reactive-programming-an-introduction-for-game-developers-f7da00edb424 Reactive Programming for Game Developers]
 
−
* [https://gist.github.com/staltz/868e7e9bc2a7b8c1f754 The introduction to Reactive Programming you've been missing]
 
−
* [https://hasso.tepper.pri.ee/2013/09/motteid-tarkvara-tolkimisest-vol-1/ Hasso Tepper: Tarkvara tõlkimisest vol1]
 
−
* [https://sander85.com/download/vaba_tarkvara_tolkimine_eestis.pdf Tarkvara tõlkimine Eestis]
 
−
* [https://viki.pingviin.org/Stiilijuhend_tarkvara_t%C3%B5lkimiseks Stiilijuhend]
 
−
* [https://javlaskitsystem.se/2012/02/whats-the-waiter-doing-with-the-computer-screen/ Kui liidese disain läbi kukub, on kasutaja tihti leidlik.]
 
  
 +
a. kaitstud kõik kohustuslikud iseseisvad tööd (maksimaalselt 20 + 20 + 20 punkti)<br>
 +
b. hinnatud kaks kaastudengi tööd (maksimaalselt 5 + 5 punkti)<br>
 +
d. aktiivne osalemine loengutes ja praktikumides, lisaülesanded (maksimaalselt 10 punkti)<br>
 +
c. tehtud kontrolltöö (maksimaalselt 20 punkti). Edukaks sooritamiseks pead kontrolltöös saama vähemalt 51% punktidest ja kogu kursuse eest (praktiktikumid+kontrolltöö) vähemalt 51 punkti.<br>
  
−
[[Kategooria:Kasutajaliidesed]]
+
*91 < punkti      -- hinne 5 (suurepärane)
 +
*81 < punkti < 90 -- hinne 4 (väga hea)
 +
*71 < punkti < 80 -- hinne 3 (hea)
 +
*61 < punkti < 70 -- hinne 2 (rahuldav)
 +
*51 < punkti < 60 -- hinne 1 (kasin)
 +
*alla 51 punkti -- kursust ei läbitud

Viimane redaktsioon: 26. mai 2025, kell 13:53

Kursuse kood: ITI0209
Link: https://courses.cs.ttu.ee/pages/Kasutajaliidesed_(ITV0209)
Õppejõud: Martin Verrev, martin.verrev@taltech.ee, TTÜ ruum ICT-422
Kurusus Moodle keskkonnas: https://moodle.taltech.ee/course/view.php?id=30645, registreerumise kood:ITI020925
Kursuse Teams'i kanal: ITI0209 (2025) Kasutajaliidesed, registreerumise kood:e50tfje
Koht: Loengud ja praktikumid toimuvad auditooriumis ICT-507
Aeg: Semestri jooksul igal teisipäeval: loeng kell 12:30-14:00 ja praktikum 14:15-15:45
Arhiiv: 2024 aasta kursuse lehte näed siit: Kasutajaliidesed_(ITI0209))_2024


27. mai kontrolltöö - aeg ja koht

Kuna ICT majas toimuvad ehitustööd ja ka 5 korrusel on see piisavalt segav, siis broneerisin kontrolltööks eraldi ruumid:

  • Teisipäev 27. mai kell 12:30, auditoorium ICO-221 (IT Kolledz)
  • Teisipäev 27. mai kell 14:15, auditoorium U04-103 (Peamaja)


Üldine ülevaade

Kursuse lõpetaja:

  • Oskab hinnata liidese visuaaldisaini kvaliteeti ja terviklikkust.​
  • Oskab luua ja valideerida kasutajakeskset nii arvutile kui nutiseadmetele loodud kasutajaliidest.​
  • Suudab osaleda UX arendusprotsessis nii täitja kui tellijana.
  • Oskab andmeid visualiseerida.

Semestri jooksul toimub õppetöö kaheliikmelistes gruppides, kus luuakse ja valideeritakse kasutajaliides enda poolt väljamõeldud teenusele. Loodud teenuse tagarakendust kursuse jooksul reaalselt valmis programmeerima ei hakka :)


Loengud

Nädal 1: Sissejuhatus: Hea kasutajaliides

Loenguslaidid

Nädal 2: Disainiprotsess: Double Diamond

Nädal 3: Briif

Nädal 4: Tulemid: Kasutajavood ja sõrestikmudel

Nädal 5: Tulemid: Persoonad

Nädal 6: Sisukaart. Kasutatavuse testimine

Nädal 7: Sissejuhatus disainisüsteemi

Nädal 8: Disainisüsteem: Tüpograafia ja Värvid

Loenguslaidid
Praktikum: Sissejuhatus Bootstrappi

Nädal 9: Disainisüsteem: Layout. Vormid

Nädal 10: Otsing. Filtrid

Nädal 11: Sisu

Nädal 12: Juurdepääsetavus

Nädal 13: Sissejuhatus andmete visualiseerimisse

Nädal 14. Visualiseerimise jätk

  • Loenguslaidid
  • Praktikum (Teamsis). Visualiseerimisest ja andmete leidmisest räägib prof. Tanel Tammet

Nädal 15. Dashboard

Loenguslaidid
Praktikum: Jätkame andmete leidmisega. Konsultatsioonid ja abi.

Nädal 16. Kursuse kokkuvõte

Loenguslaidid
Praktikum: Alustame 3. praktikumitööde kaitsmisega


Iseseisvad tööd

Sarnaselt varasemate aastatega esitatalkse kursuse käigus kolm kohustuslikku iseseisvat tööd. Iseseisvad tööd esitatakse Gitlab'is.

1. Staatiline prototüüp, tähtaeg: Neljapäeval 20. märts kell 17:00
2. HTML Prototüüp, tähtaeg: Teisipäev 29. aprill kell 23:59
3. Andmete visualiseerimine, Esmaspäev 19. mai kell 20:00, esitatud tööde põhjal moodustatakse kaitsmisgraafik mida jagatakse Teamsis. Nendel kes sellel semestril kaitsevad bakalaureusetööd, on tähtajaks neljapäev 22. mai kell 20:00

3. iseseisva töö kaitsmine

Vormi https://forms.gle/UFoCXhWLB67vLemH9 kaudu tekib virtuaalne järjekord iseseiva töö kaitsmiseks üle Teamsi. Palun täita see võimalikult kohe, aga 2 tundi enne selle päeva kaitsmiste algust. Selle tulemusel tekib kaitsmisgraafik mida õppejõud täidab jooksvalt ja mille linki jagatakse Teamsi kanalis.

Võimalikud kaitsmisjad on:

  • Neljapäeval 22. mail kell 14:00 - 15:30
  • Neljapäeval 22. mail kell 16:00 - 17:30
  • Reedel 23. mail kell 15:00 - 16:30
  • Esmaspäeval 26. mail kell 12:00 - 13:30
  • Esmaspäeval 26. mail kell 14:00 - 15:30

Et leida aeg mis kõige sobivam, siis märkige siia, millised ajad teile ja teie tiimikaaslastele selles vahemikus ei sobi - kaitsmisel peaks olema kohal kogu meeskond.

Vastuste põhjal tekib kaitsmiste ajakava. Igal väljapakutud ajal teeb õppejõud Teamsi-koosoleku, kus registreerunud saavad oma töid esitada. Iga kaitsmine võtab aega ligikaudu 10 minutit. Ülejäänud on teretulnud pealtvaatajatena.

Kursuse lõpetamine, kontrolltöö

Kursuse viimaseks ülesandeks on kontrolltöö. Kontrolltöö toimub loengutes, praktikumides ja iseseisvate tööde käigus läbitud teemade kohta. Küsimused puudutavad ainult neid teemasid mida loengutes ja praktikumides oleme käsitlenud ja mille kohta on ka loenguslaidid.

Orienteeruv kontrolltöö kirjutamise aeg on 1 .. 1.5 tundi.

Kontrolltöö toimub kohapeal paberil ja igasuguste abimaterjalide ja kõrvalise abi kasutamine on keelatud.

Võimalikud põhiteemad kordamiseks

  • Kasutajaliides ja kasutatavus. Põhimõisted. Kasutajaliidese põhielendid.
  • Kasutajaliidese arendusprotsess, rollid arendusprotsessis, üleantavad tulemid
  • Persoonad ja kasutajavood
  • Kasutajatestimine
  • Disainisüsteem ja selle elemendid (värvid, tüpograafia, paigutus jne)
  • Vormid
  • Otsing ja filtreerimine
  • Sisu
  • Visualiseerimine, õige visualiseerimismeedodi valik

Kontrolltöö tegemiseks on järgmised ajad.

  • Teisipäev 27. mai kell 12:30, auditoorium ICO-221 (IT Kolledz)
  • Teisipäev 27. mai kell 14:15, auditoorium U04-103 (Peamaja)

Turingu serveri kasutamine

Turingu serverisse rakenduse paigaldamine

Hinde moodustumine

Lõpphinne moodustub järgmistest pukntidest:

a. kaitstud kõik kohustuslikud iseseisvad tööd (maksimaalselt 20 + 20 + 20 punkti)
b. hinnatud kaks kaastudengi tööd (maksimaalselt 5 + 5 punkti)
d. aktiivne osalemine loengutes ja praktikumides, lisaülesanded (maksimaalselt 10 punkti)
c. tehtud kontrolltöö (maksimaalselt 20 punkti). Edukaks sooritamiseks pead kontrolltöös saama vähemalt 51% punktidest ja kogu kursuse eest (praktiktikumid+kontrolltöö) vähemalt 51 punkti.

  • 91 < punkti -- hinne 5 (suurepärane)
  • 81 < punkti < 90 -- hinne 4 (väga hea)
  • 71 < punkti < 80 -- hinne 3 (hea)
  • 61 < punkti < 70 -- hinne 2 (rahuldav)
  • 51 < punkti < 60 -- hinne 1 (kasin)
  • alla 51 punkti -- kursust ei läbitud
Pärit leheküljelt "http://courses.cs.taltech.ee/w/index.php?title=Kasutajaliidesed_(ITI0209)&oldid=11869"