Erinevus lehekülje "Kasutajaliidesed (ITV0130)) 2019" redaktsioonide vahel

Allikas: Kursused
Mine navigeerimisribale Mine otsikasti
P (Verrev teisaldas lehekülje Kasutajaliidesed (ITV0130)) 2018 pealkirja Kasutajaliidesed (ITV0130)) 2019 alla)
 
(ei näidata 2 kasutaja 55 vahepealset redaktsiooni)
1. rida: 1. rida:
 
{{UI}}Kursuse kood: <b>ITV0130</b><br>
 
{{UI}}Kursuse kood: <b>ITV0130</b><br>
 
Link: https://courses.cs.ttu.ee/pages/ITV0130<br>
 
Link: https://courses.cs.ttu.ee/pages/ITV0130<br>
−
Õppejõud: Jaagup Irve<br>
+
Õppejõud: Martin Verrev, [https://www.linkedin.com/in/kristian-lember-254a2a6a/ Kristian Lember]<br>
−
Kontakt: jaagup.irve@ttu.ee, TTÜ ruum ICT-425<br>
+
Kontakt: martin.verrev@ttu.ee, TTÜ ruum ICT-422<br>
−
Kursus varem: [http://lambda.ee/w/index.php?title=Kasutajaliidesed&oldid=14266 2017]<br>
+
2018 aasta kursuse lehte näed siit: [[ITV0130_2018]]<br>
  
−
== Korraldusest ==
+
Jooksva info edastamiseks on kursusel [https://kasutajaliidesed2019.slack.com/ Slacki kanal] millega saab liituda kasutades  [https://join.slack.com/t/kasutajaliidesed2019/shared_invite/enQtNTM1MTgzMzY4NzUzLTEzNDcyYTBkNWY4OGNiZTNlMWI3Yzg2OTQyYjFlNDM3MWRhYjRlMGNjZTg2YzFhNjI3YzVjZjUyOTQ0MzBjMjg seda linki]
  
−
Loengutes selgitame kasutajaliideste arendamise põhimõtteid. Harjutustundide eesmärk on omada õigustust tehniliste lahenduste ekraanile programmeerimiseks. Praktikumis lahendame iga nädal mõnd konkreetset liidese ehitamisel ettetulevat probleemi (kui pole kodutöödega tegelemisenädal, sest siis tegeleme ainult nendega)
+
== Aeg, koht, tulemus ==
 +
Loeng toimub igal teisipäeval kell 10:00-11:30 ruumis U06a-201.  
  
−
* [https://docs.google.com/spreadsheets/d/e/2PACX-1vSfQACpS6wv8_XSwfhikO_B9indE-s65WLjb0pFf2di6hXaNBdqV_xitzLcFLEkXDAJtZG5MuSp_amn/pubhtml?gid=2031353194&single=true Grupikuuluvused pärast kõikvõimalikke kolimisi]
+
Praktikumid toimuvad eri gruppidele neljal erineval ajal. Esimesel nädalal on juhendajad Martin Verrev ja Kristian Lember, järgmistel tuleb praktikumijuhendajaid juurde.
−
* [https://docs.google.com/forms/d/e/1FAIpQLSebLHZmB4UU3yHOhtOLQsVVHBILM1mwm-Tyt2bEl-Iu2CE-fA/viewform?usp=sf_link Praktikumigruppide soovid]
+
 
 +
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.
 +
 
 +
teisipäeval kell 12:00 ruumis ICT-401 rühmad: IAIB42, IAIB43
 +
teisipäeval kell 14:00 ruumis ICT-401 rühmad: IAIB41, IAIB43
 +
teisipäeval kell 16:00 ruumis ICT-401 rühmad: IAPB63, IAPB64
 +
neljapäeval kell 10:00 ruumis ICT-403 rühmad: IAPB61, IAPB62
 +
 
 +
Kursus lõpeb hindelise arvestusega. Hinne sõltub kursuse jooksul tehtud praktikumide tulemustest (60%) pluss kursuse lõpus toimuva kontrolltöö tulemustest (40%).
 +
 
 +
'''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.'''
  
 
== Hindamine ==
 
== Hindamine ==
 
[[Pilt:ITV0130-Excel-error.png|right]]
 
[[Pilt:ITV0130-Excel-error.png|right]]
−
Aine hinnatakse 100 punkti skaalal; saadaval olevate punktide hulk on veidi suurem. Punktid jaotuvad:
+
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.]]  25. veebruari nädal.
 +
* 15 punkti: [[UI:Kodutöö 2 (2019)|Kodutöö 2: HTML Prototüüp ja CSS raamistikud.]]  2. aprilli 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.
 +
 
 +
=== Lisapunktid ===
 +
* 9-10 mail toimub [[http://garage48.org/events/garage48-visualising-data Garage48 Visualising Data]] häkaton, millel osalemine annab 5 lisapunkti. Koodi registreerimiseks TTÜ tudengina saab õppejõult kursuse Slacki kanalis.
 +
 
 +
 
 +
<font color="red">'''NB!'''</font>
 +
* Kui sinu praktikum on õigeaegselt arvestatud, siis saad esitada täiendusi kuni nädalalani enne järgmise praktikumi tähtaega, ilma pooli punkte kaotamata.
 +
* 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]].
  
−
* 0-10 punkti: kaastöö praktikumides (iga nädal 1 punkt; töö paarilisega või üksi)
+
Kursuse edukaks läbimiseks ja kontrolltööle pääsemiseks peavad kõik kohustuslikud praktilised tööd olema tehtud.
−
* 10-20 punkti: Kodutöö 1
 
−
* 10-20 punkti: Kodutöö 2
 
−
* 10-20 punkti: Kodutöö 3 (kodutöö võib esitada üksi või koos paarilisega; edukal kaitsmisel saab vähemasti pooled punktid)
 
−
* 0-40 punkti: kontrolltöö (javascripti ülesannete absurdselt halb sooritus võib seada hindele laeks 3)
 
  
−
Kodutööde hindamisel kasutatakse konkreetsemat punktitabelit, kus alamkategooriate hindamine vahemikus 0-3 tagab tihti hinde samasuse ka kordushindamisel.
 
  
−
Plagiaat; teiste tudengite tööde esitamine muudetud moel ja muu jura edastatakse dekaanile menetlemiseks.
+
== Kontroltöö ==
 +
 
 +
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.
 +
 
 +
Kontrolltöö jaoks on sul valida kaks võimalikku päeva.
 +
 
 +
* teisipäeval 14. mail kell 10:00 '''auditooriumis U06a-201'''
 +
* neljapäeval 16. mail kell 12:00 IT kolledzis, auditooriumis EIK-316
 +
 
 +
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.
 +
 
 +
'''Kontrolltööle võtke kaasa pildiga dokument'''
 +
 
 +
 
 +
=== Kontroltöö sisu ===
 +
 
 +
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.
 +
 
 +
Oskused ülesannete lahendamiseks peaks olema automaatselt kõigil, kes on praktikume süvenemisega teinud.
 +
Kontrolltöö punktid lisanduvad praktikumi punktidele.
 +
 
 +
Alla 50% kontrolltöö tulemus tähendab ebaõnnestumist.
  
−
Kursuse kordajatele: varasemate aastate kontrolltöö hinde võib paluda otse üle kanda.
 
  
−
== Praktikumid ==
+
=== Teemade loend ===
  
−
{{Itv0130-praktikumid}}
+
Siin on esitatud valik teemasid mis kontrolltöösse tulla võivad. Oluline on sisuline arusaamine, mite
  
−
== Kodutöö ==
+
* Kasutajateekond, flow
−
* [[UI:Kodutöö 1 (2018)|Kodutöö 1: Elukohast teatamise vorm]] - 28 veebruar tagasiside, 7. märts esitamine.
+
* Layout
−
* [[UI:Kodutöö 2 (2018)|Kodutöö 2: Bürokraatia (mäng)]] - 4. aprill testimine-eelkaitsmine, 11. aprill esitamine.
+
* Grid
−
* [[UI:Kodutöö 3 (2018)|Kodutöö 3: Hindamisprotseduur]] - 2. mai testimine-eelkaitsmine, 9. mai esitamine
+
* Navigatsioon (nupud, menüü jne)
 +
* Keskkonna struktuur
 +
* CTA (Call to Action)
 +
* Pealkirjade hierarhia
 +
* Kasutajatestimine
 +
* Gestaltprintsiibid, hea lühikokkuvõte on siin: http://www.paberimuuseum.ee/disainiABC/site/lesson3-1.html
 +
* HTML raamistikud, lihtsamad programmeerimisülesanded teie poolt valitud raamistikel
 +
* Lehe kohandamine mobiilivaadetele
 +
* CSS eelprotsessorid
 +
* BEM
 +
* Veebikomponendid, shadow-DOM
 +
* Lihtsam Vue/React
 +
* KPI-d
  
 
== Loengud ==
 
== Loengud ==
  
−
[https://echo360.org.uk/section/693833b3-8a53-4c25-9b2c-009a7c9a0105/public Loengute videod] (halvasti sorditud)
+
Loengute videosalvestised on kättesaadavad [https://echo360.org.uk/section/3c82e893-acf4-4e75-ac23-6bc45861d5fb/public sellelt lingilt].
  
−
# Korraldusest; Fitt'i seadus, purjus inimese liides, kasutajamudel, liideste hindamine ([[Media:UI2018_L1.pdf|PDF]])
+
* Loeng 1: [https://docs.google.com/presentation/d/1n9d4uGMVtVvlxoaorpJxdaFPKpcqNaB-BDCZXoUyqVs/edit Sissejuhatus disaini]
−
# Kasutajaliidesed programmeerijale; Sobimus; Kodutööst; Visuaaldisainist ([[Media:UI2018_L2.pdf|PDF]])
+
* Loeng 2: [https://docs.google.com/presentation/d/1dIfQab7ns7mhZFyDzsgdx6ff8jbjQ-n1tC8XTXt4CLQ/edit Kasutajakogemuse disain: UX]
−
#* [https://www.joelonsoftware.com/2001/10/24/user-interface-design-for-programmers/ Kasutajaliidesed programmeerijale]
+
* Loeng 3: [https://docs.google.com/presentation/d/1qVjyJo-r206XstoH4U6kAStwpMEf9K_7ZR4_esp7y4Y/edit Kasutajakogemuse disain: Wireframe]  
−
#* [https://et.wikipedia.org/wiki/Sobimus Sobimus (''affordance'')]
+
* Loeng 4: [https://docs.google.com/presentation/d/1t2tICnUFY2isBphGHjj_3pitG8fHOWmPUCb0GrBSGu8/edit Kasutajakogemuse disain: Wireframe. Prototüüp. Testimine.]
−
#* [https://www.blenderguru.com/tutorials/understanding-colors Understanding Colors]
+
* Loeng 5: [https://www.dropbox.com/s/1ezpk23ypjsnize/ttu_visualdesign.pdf?dl=0 Visuaalne disain graafilise kasutajaliidese kontekstis]
−
# [https://youtu.be/orjea53ikds Vue.js] (loengu asemel on video, sest haigus)
+
* Loeng 6: [https://www.beautiful.ai/deck/-LXO_WhqKYVnDhCfnn7M/ITV0130-CSS-raamistlikud Kasutajaliideste arendaja roll. CSS raamistikud]
−
# Müra kahandamine; vormidest. (Eelmisest õhus: kompositsioonist)
+
* Loeng 7: [https://www.beautiful.ai/deck/-L_TKpi0_FhW60VKz-1Y/ITV0130-CSS-SASS-LESS Hallatav CSS. Eelprotsessorid]
−
#* [http://www.brandonwalkin.com/blog/2009/08/10/managing-ui-complexity/ Liidese näilisest keerukusest]
+
* Loeng 8: [https://www.beautiful.ai/deck/-LaHEUnlSRf679jiuxwm/ITV0130-BEM Hallatav CSS. BEM]
−
#* [http://friedcellcollective.net/outbreak/2007/12/13/messing-up-the-interface/ Kuidas konfliktsed huvid vormid koledaks teevad]
+
* Loeng 9: [https://www.beautiful.ai/deck/-LaqnjrE3g0a_NhCU7Y1/ITV0130-Web-Components Hallatav HTML. Sissejuhatus veebikomponentidesse]
−
#* [https://www.lukew.com/ff/entry.asp?1502 Vormide paigutusest]
+
* Loeng 10: Veebikomponentide jätk
−
# Tekstide kirjutamine, lugemine, struktureerimine.
+
* Loeng 11: [https://www.beautiful.ai/deck/-Lc-f1fSqwKBlQ-7fpVD/ITV0130-Component-Frameworks-VueJS Komponendiraamistikud. Vue.js]
−
#* [https://www.ttu.ee/tugistruktuur/veebitugi-4/sisuloome-tugi/sisuteksti-koostamine-2/ Sisuteksti koostamine]
+
* Loeng 12: Vue.js jätk
−
# Kasutajaliidese koostamise alusprintsiipidest; Inimese mälu eripäradest liidestes (meil on lühi, pikaajaline, protseduuriline ja episoodiline mälu; töömälu 4 +/- 1 seostumatut ühikut, sellest lähtuvalt peame töömälu toetama)
+
* Loeng 13: Vue.js + NPM. SPA.
−
#* [http://asktog.com/atc/principles-of-interaction-design/ First Principles of Interaction Design] - (Esteetika, Ootused, Iseseisvus, Värvid)
+
* Loeng 14: [https://www.beautiful.ai/deck/-LdOegkRcVwgqH_1nyUQ/ITV0130-Telling-Stories-with-Data Andmete visualiseerimine. Dashboard.]
−
# Kasutajaliidese testimisest ([[Media:UI2018_L7.pdf|PDF]])
+
* Loeng 15: [https://www.beautiful.ai/deck/-LeE9qoHCMB682wZ83SQ/ITV0130-SVG-Animations SVG. Animatsioonid]
−
#* [https://www.nngroup.com/articles/ten-usability-heuristics/ 10 heuristics for User Interaction Design], Nielsen
+
* Loeng 16: Kontrolltöö
−
# Kasutajaliidese koostamise alusprintsiipidest II; Pikaajaline mälu (liidestes mõjutab see paroolide meeldejätmist peamiselt ja korduvaid operatsioone)
 
−
#* [http://asktog.com/atc/principles-of-interaction-design/ First Principles of Interaction Design] - (Järjepidevus, Vaikimisi valikud, Avastatavus, Fittsi seadus, Inimliidese elemendid, Viiteaja haldamine)
 
−
# Kasutajaliidese koostamise alusprintsiipidest III; Animatsioonide ajastustest ja iseloomust
 
−
#* [http://asktog.com/atc/principles-of-interaction-design/ First Principles of Interaction Design] - (Õpitavus, metafoorid, Töö kaitsmine, Loetavus, Lihtsus, Olek, Nähtav liides)
 
−
#* Animatsioonide ajastustest ja iseloomust [https://material.io/guidelines/motion/material-motion.html Material Design'i näitel] (Duration & Easing, Movement, Choreography)
 
−
# ''Reactive programming'' kui viis liideses andmevooga arvutusi teha.
 
−
#* [https://gist.github.com/staltz/868e7e9bc2a7b8c1f754 The Introduction to Reactive Programming You Have Been Missing] - tunnis tehtud näide oli analoogne Twitteri näitega siin
 
−
#* [https://medium.com/@urschanselmann/reactive-programming-an-introduction-for-game-developers-f7da00edb424 Unity näide] - koodinäide on Unity3d kontekstis relevantne, aga põhjendused on väga hästi illustreeritud
 
−
#* [https://jsfiddle.net/jirve/bmb7zrhe/ Tunni näide] - lihtne ajastatud klõpsimine, kus mudel täieneb kohe, aga visuaal väikese hilistumisega
 
−
# Tarkvara tõlkimisest
 
−
#* [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]
 
−
# Tarkvara hõlbustusfunktsioonid
 
−
# Liidese andmete liigutamise paremad praktikad. Vuex.js
 
−
# Kodutööde ülevaatamine ja Disco Elysiumi liidese arendusest (ei ole järelvaadatav)
 
−
# Kontrolltööst
 
−
# Kontrolltöö (võimalusel kahes auditooriumis)
 
  
−
== Kontrolltöö ==
 
  
−
Kontrolltöö toimub viimase loengu päeval, loengu ruumides. Kontrolltöö sisuks on alltoodud materjalide lugemiskontroll ning HTML/javascripti tehniliste küsimuste lahendamine paberil.
 
−
 
−
Kõhurääkijate ja mobiilinokkijate tööd võtan ära ja ei hinda. Tööd saab teha üks kord (topelt-käimisel teist tööd ei hinda).
 
  
 +
<!--
 +
Kursuse kordajatele: varasemate aastate kontrolltöö hinde võib paluda otse üle kanda.
 +
-->
  
 
== Viidete kogu ==
 
== Viidete kogu ==
  
−
''Siit on mõistlik õppida''
+
===Koodinäiteid===
 +
[https://github.com/martinve/itv0130 Kursuse koodinäiteid Githubis]
  
 
===Lugemist===
 
===Lugemist===
  
 +
* Spolsky: [http://www.joelonsoftware.com/uibook/fog0000000249.html User Interface Design For Programmers] - kontrollitundest, kasutajamudelist ja päris inimestest
 
* A List Apart: [http://alistapart.com/article/indefenseofeyecandy In Defence of Eye Candy] - miks ilus liides on "parem".
 
* A List Apart: [http://alistapart.com/article/indefenseofeyecandy In Defence of Eye Candy] - miks ilus liides on "parem".
−
* Spolsky: [http://www.joelonsoftware.com/uibook/fog0000000249.html User Interface Design For Programmers] - kontrollitundest, kasutajamudelist ja päris inimestest
 
 
* Brandon Walkin: [http://www.brandonwalkin.com/blog/2009/08/10/managing-ui-complexity/ Managing UI complexity] - sellest kuidas asju kasutaja eest ära peita
 
* 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
 
* 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
 
* 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://ui-patterns.com/patterns UI-Patterns.com] - input, navigation, data
−
* [http://www.joelonsoftware.com/articles/Unicode.html Spolsky: The Absolute Minimum Every Software Developer Absolutely, Positively Must Know About Unicode and Character Sets (No Excuses!)]
 
 
* [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]
 
* [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===
 
===Tehniline===
 +
 +
''Kontrolltöö mõttes tasub mõelda praktikumi- ja kodutööde mahus.''
  
 
* 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.
 
* 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.
 
* 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.
 
* 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.
 
* 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  
+
* HTML DOM põhipunktid
−
* Cookied ja sessioonid (vt http://en.wikipedia.org/wiki/HTTP_cookie, http://www.quirksmode.org/js/cookies.html). Peab aru saama cookie põhimõtetest server-side ja aru saama javascripti näidetest cookiede kasutamise kohta. Programmeerimisülesannet selle kohta ei tule.
 
−
* Cgi protokoll (vt http://www.jmarshall.com/easy/cgi/). Peab aru saama, kuidas vormisisusid postitaktakse, mis vahe on GET ja POST protokollil.
 
  
 
== Niisama huvitavat lugemist ==  
 
== Niisama huvitavat lugemist ==  
134. rida: 175. rida:
 
* [http://sass-lang.com/guide Sass - miinimumsüntaksiga CSS]
 
* [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://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://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://gist.github.com/staltz/868e7e9bc2a7b8c1f754 The introduction to Reactive Programming you've been missing]
140. rida: 180. rida:
 
* [https://sander85.com/download/vaba_tarkvara_tolkimine_eestis.pdf Tarkvara tõlkimine Eestis]
 
* [https://sander85.com/download/vaba_tarkvara_tolkimine_eestis.pdf Tarkvara tõlkimine Eestis]
 
* [https://viki.pingviin.org/Stiilijuhend_tarkvara_t%C3%B5lkimiseks Stiilijuhend]
 
* [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.]
  
 
[[Kategooria:Kasutajaliidesed]]
 
[[Kategooria:Kasutajaliidesed]]

Viimane redaktsioon: 14. jaanuar 2020, kell 14:21

Kursuse kood: ITV0130
Link: https://courses.cs.ttu.ee/pages/ITV0130
Õppejõud: Martin Verrev, Kristian Lember
Kontakt: martin.verrev@ttu.ee, TTÜ ruum ICT-422
2018 aasta kursuse lehte näed siit: ITV0130_2018

Jooksva info edastamiseks on kursusel Slacki kanal millega saab liituda kasutades seda linki

Aeg, koht, tulemus

Loeng toimub igal teisipäeval kell 10:00-11:30 ruumis U06a-201.

Praktikumid toimuvad eri gruppidele neljal erineval ajal. Esimesel nädalal on juhendajad Martin Verrev ja Kristian Lember, järgmistel tuleb praktikumijuhendajaid juurde.

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.

teisipäeval kell 12:00 ruumis ICT-401 rühmad: IAIB42, IAIB43 teisipäeval kell 14:00 ruumis ICT-401 rühmad: IAIB41, IAIB43 teisipäeval kell 16:00 ruumis ICT-401 rühmad: IAPB63, IAPB64 neljapäeval kell 10:00 ruumis ICT-403 rühmad: IAPB61, IAPB62

Kursus lõpeb hindelise arvestusega. Hinne sõltub kursuse jooksul tehtud praktikumide tulemustest (60%) pluss kursuse lõpus toimuva kontrolltöö tulemustest (40%).

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.

Hindamine

ITV0130-Excel-error.png

Aine hinnatakse 100 punkti skaalal; saadaval olevate punktide hulk on veidi suurem. Punktid kogutakse semestri jooksul ja jaotuvad:

Iga töö annab 0-15 punkti. Hilinenud tööd annavad poole punktidest. Töid võib (ja on soovitav) esitada enne tähtaega.

Lisapunktid

  • 9-10 mail toimub [Garage48 Visualising Data] häkaton, millel osalemine annab 5 lisapunkti. Koodi registreerimiseks TTÜ tudengina saab õppejõult kursuse Slacki kanalis.


NB!

  • Kui sinu praktikum on õigeaegselt arvestatud, siis saad esitada täiendusi kuni nädalalani enne järgmise praktikumi tähtaega, ilma pooli punkte kaotamata.
  • 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 ainult 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 serveri kasutamise õpetust.

Kursuse edukaks läbimiseks ja kontrolltööle pääsemiseks peavad kõik kohustuslikud praktilised tööd olema tehtud.


Kontroltöö

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.

Kontrolltöö jaoks on sul valida kaks võimalikku päeva.

  • teisipäeval 14. mail kell 10:00 auditooriumis U06a-201
  • neljapäeval 16. mail kell 12:00 IT kolledzis, auditooriumis EIK-316

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.

Kontrolltööle võtke kaasa pildiga dokument


Kontroltöö sisu

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.

Oskused ülesannete lahendamiseks peaks olema automaatselt kõigil, kes on praktikume süvenemisega teinud. Kontrolltöö punktid lisanduvad praktikumi punktidele.

Alla 50% kontrolltöö tulemus tähendab ebaõnnestumist.


Teemade loend

Siin on esitatud valik teemasid mis kontrolltöösse tulla võivad. Oluline on sisuline arusaamine, mite

  • Kasutajateekond, flow
  • Layout
  • Grid
  • Navigatsioon (nupud, menüü jne)
  • Keskkonna struktuur
  • CTA (Call to Action)
  • Pealkirjade hierarhia
  • Kasutajatestimine
  • Gestaltprintsiibid, hea lühikokkuvõte on siin: http://www.paberimuuseum.ee/disainiABC/site/lesson3-1.html
  • HTML raamistikud, lihtsamad programmeerimisülesanded teie poolt valitud raamistikel
  • Lehe kohandamine mobiilivaadetele
  • CSS eelprotsessorid
  • BEM
  • Veebikomponendid, shadow-DOM
  • Lihtsam Vue/React
  • KPI-d

Loengud

Loengute videosalvestised on kättesaadavad sellelt lingilt.



Viidete kogu

Koodinäiteid

Kursuse koodinäiteid Githubis

Lugemist

Tehniline

Kontrolltöö mõttes tasub mõelda praktikumi- ja kodutööde mahus.

Niisama huvitavat lugemist

Kontrolltöö eel siit õppida pole tarvis; siin on lihtsalt lahedused

Pärit leheküljelt "http://courses.cs.taltech.ee/w/index.php?title=Kasutajaliidesed_(ITV0130))_2019&oldid=9012"