Erinevus lehekülje "Kasutajaliidesed (ITV0130)) 2019" redaktsioonide vahel
Mine navigeerimisribale
Mine otsikasti
| 89. rida: | 89. rida: | ||
===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". | ||
| − | |||
* 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://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 |
| − | |||
| − | |||
== Niisama huvitavat lugemist == | == Niisama huvitavat lugemist == | ||
Redaktsioon: 9. mai 2018, kell 05:44
Kursuse kood: ITV0130
Link: https://courses.cs.ttu.ee/pages/ITV0130
Õppejõud: Jaagup Irve
Kontakt: jaagup.irve@ttu.ee, TTÜ ruum ICT-425
Kursus varem: 2017
Korraldusest
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)
Hindamine
Aine hinnatakse 100 punkti skaalal; saadaval olevate punktide hulk on veidi suurem. Punktid jaotuvad:
- 0-10 punkti: kaastöö praktikumides (iga nädal 1 punkt; töö paarilisega või üksi)
- 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.
Kursuse kordajatele: varasemate aastate kontrolltöö hinde võib paluda otse üle kanda.
Praktikumid
Kodutöö
- Kodutöö 1: Elukohast teatamise vorm - 28 veebruar tagasiside, 7. märts esitamine.
- Kodutöö 2: Bürokraatia (mäng) - 4. aprill testimine-eelkaitsmine, 11. aprill esitamine.
- Kodutöö 3: Hindamisprotseduur - 2. mai testimine-eelkaitsmine, 9. mai esitamine
Loengud
Loengute videod (halvasti sorditud)
- Korraldusest; Fitt'i seadus, purjus inimese liides, kasutajamudel, liideste hindamine (PDF)
- Kasutajaliidesed programmeerijale; Sobimus; Kodutööst; Visuaaldisainist (PDF)
- Vue.js (loengu asemel on video, sest haigus)
- Müra kahandamine; vormidest. (Eelmisest õhus: kompositsioonist)
- Tekstide kirjutamine, lugemine, struktureerimine.
- 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)
- First Principles of Interaction Design - (Esteetika, Ootused, Iseseisvus, Värvid)
- Kasutajaliidese testimisest (PDF)
- Kasutajaliidese koostamise alusprintsiipidest II; Pikaajaline mälu (liidestes mõjutab see paroolide meeldejätmist peamiselt ja korduvaid operatsioone)
- First Principles of Interaction Design - (Järjepidevus, Vaikimisi valikud, Avastatavus, Fittsi seadus, Inimliidese elemendid, Viiteaja haldamine)
- Kasutajaliidese koostamise alusprintsiipidest III; Animatsioonide ajastustest ja iseloomust
- First Principles of Interaction Design - (Õpitavus, metafoorid, Töö kaitsmine, Loetavus, Lihtsus, Olek, Nähtav liides)
- Animatsioonide ajastustest ja iseloomust Material Design'i näitel (Duration & Easing, Movement, Choreography)
- Reactive programming kui viis liideses andmevooga arvutusi teha.
- The Introduction to Reactive Programming You Have Been Missing - tunnis tehtud näide oli analoogne Twitteri näitega siin
- Unity näide - koodinäide on Unity3d kontekstis relevantne, aga põhjendused on väga hästi illustreeritud
- Tunni näide - lihtne ajastatud klõpsimine, kus mudel täieneb kohe, aga visuaal väikese hilistumisega
- Tarkvara tõlkimisest
- 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).
Viidete kogu
Siit on mõistlik õppida
Lugemist
- Spolsky: User Interface Design For Programmers - kontrollitundest, kasutajamudelist ja päris inimestest
- A List Apart: In Defence of Eye Candy - miks ilus liides on "parem".
- Brandon Walkin: Managing UI complexity - sellest kuidas asju kasutaja eest ära peita
- Ask Tog: First Principles of User Interaction Design - tee liides valmis ja loe see uuesti läbi
- Nielsen: 10 heuristilist kriteeriumit - liidese testimiseks
- UI-Patterns.com - input, navigation, data
- kuidas vormid koledaks lähevad ja vormide disainist
- Stiilijuhend tarkvara tõlkimiseks
- Sisuteksti koostamine
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.
- 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
Kontrolltöö eel siit õppida pole tarvis; siin on lihtsalt lahedused
- Noppeid - ekraanipiltide kogu
- Shaping up with angular - imeline angulari veebikoolitus (aga spämmib teid pärast rohkelt äraütlemisvõimalusega)
- Redesigning Google: How Larry Page Engineered Beautiful Revolution - kuidas Google ennast hiljuti ümber ehitas
- Amazoni alam-menüü nipp
- Firefox developer tools - lahedusi Mozillalt
- RISO: Kasutajakeskse veebi lehekülgede disain (.pdf)
- Windows User Experience Interaction guidelines - Win7
- UX Guidelines for Windows Store apps - Win 8
- iOS Human Interface Guidelines
- Android UI Design
- GNOME Human Interface Guidelines
- Kuidas iOS lapikumaks muutub aja jooksul
- Google Visual Asset Guidelines - Google'i ikonograafia loomisest
- Dark Patterns - salakavalatest kasutajaliidese mustritest.
- CityMapper vs Google Maps - UX võrdlus
- iOS 8 ja shift
- Cross-Site Scripting - tore mäng turvaprobleemidest kasutajaliidese ehitamisel
- Vihakõne PHP suunal - väga must huumor
- Kuidas lennuk valesti disainiti ja inimesed katki läksid sellest
- How Apple Is Giving Design A Bad Name - kuidas Apple oma liideste disainiga veidi rappa on jõudnud
- Jade - miinimumsüntaksiga HTML
- Sass - miinimumsüntaksiga CSS
- Havai tuumahoiatus ja disain