sąveikos projektavimas: apibendrinanti...
TRANSCRIPT
![Page 1: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/1.jpg)
Sąveikos projektavimas:apibendrinanti paskaita
Žmogaus ir kompiuterio sąveika Kristina Lapin
2016.12.20 17:23
![Page 2: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/2.jpg)
Turinys
• Dalyko tikslai
• Dalyko turinio apibendrinimas
– Svetainių projektavimas
– Informacijos architektūra
– Rekomendacijos ir euristikos
• Egzamino informacija
![Page 3: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/3.jpg)
ACM: dalyko tikslai
3
![Page 4: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/4.jpg)
Tikslas - panaudojamumas
• Nauja technologija turi pagerinti žmonių veiklų kokybę
4
užduotis
![Page 5: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/5.jpg)
Naudotojui palankus projektavimas
projektavimas
realizavimasvertinimas
5ŽKS ištakos ir struktūra Studijų reikalavimaiMotyvacija Literatūra
User centred design
![Page 6: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/6.jpg)
Užsakovai - naudotojai
Vartotojai apsilanko, kai nori ...
• sužinoti
• nupirkti ar padovanoti
• pramogauti
• jaustis bendruomenės dalimi.
Pasiekiama, jei paisoma
naudotojų poreikių
Užsakovų lūkesčiai
• Atvers naują rinkodaros kanalą,
• Populiarins prekės ženklą,
• Didins pardavimus.
2016.12.20 17:23
![Page 7: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/7.jpg)
Panaudojamumo ir potyrių tikslai
7
naudPanaudojamumo
tikslai
našumas
efe
ktyv
um
as sa
ugum
as
atsim
enam
u
mas
išm
oks
tam
um
as
naudingu
mas
patenkinantis
malonus
smagus
linksmas
naudinga
s
motyvuojantis
estetiškai
patrauklus
remiantis
kūrybišku
mą
apdovanoj
antis
Potyrių tikslai
![Page 8: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/8.jpg)
Investicijų į panaudojamumą grąža
• Konversijų lygis
– kiek atsitiktinių lankytojų sugrįžta
– kiek tapo nuolatiniais lankytojais,
– Kiek užsiprenumeravo naujienas,
• Bandžiusių pirkti ir nusipirkusių santykis
![Page 9: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/9.jpg)
Svetainių projektavimas
• Galioja bendri naudotojui palankaus projektavimo principai
• Panaudojamumo tikslai (2-3,15 paskaitos)• kas yra numatomi naudotojai?
• kuriam tikslui jie naudos svetaine?
• kokios problemos yra dabartinėse svetainėse?
– Projektavimas
• naudojimo vizijos scenarijai (6 paskaita)
• scenarijų vizualizavimas: maketai (7 paskaita)
• vertinimai (11-14 paskaitos)
![Page 10: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/10.jpg)
Svetainių projektavimas (2)
• Galioja informacijos architektūros projektavimo principai (7 paskaita)
– Matyti
• Kur aš esu?
• Kur galiu nueiti?
• Kur jau buvau?
• Ką čia dar įdomaus galima rasti?
• Praėjus laikui puikiai suprojektuotos svetainės išauga ir tampa sunkiai naviguojamos
![Page 11: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/11.jpg)
Svetainių projektavimas
• Galioja panaudojamumo projektavimo principai (8 paskaita)
– Darna, pvz. vaizduojant nuorodas
– Atsakas, pvz. prasmingi adresai, suprantami pavadinimai, aiški nuoroda į pagrindinį puslapį
![Page 12: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/12.jpg)
Naršytojų strategijos
• Apie 50% pirmiausiai naudoja reikšminių žodžių paiešką
– tiksliai žino, ko ieško
• Apie 20% - pirmiausiai nueina į puslapų katalogus
– žiūri, kas naujo atsirado po paskutinio apsilankymo
• Likę – naudoja mišrią strategiją
![Page 13: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/13.jpg)
Naudotojus nuvilia
• Savitarnos paslaugoje
– nėra naudotojo vadovo, paprasto apmokymo, pagalbininkų,
– nesuprantamos metaforos
• Paini navigacija
• Ilgesnis už 5 sek. atsako laukimas
![Page 14: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/14.jpg)
Naudotojus nuvilia
• Naudotojai išsiugdė gebėjimą nekreipti dėmesio į panašius į reklamą objektus
– Paveikslai, animacija, reklamjuostės, iššokantys langai
• Paprastai ignoruojami
![Page 15: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/15.jpg)
Naudotojus nuvilia
• Esminis dizaino pakeitimas
– Reikia mokytis iš naujo: tam nėra nei noro, nei laiko
– Nepatogu, neįprasta, neaišku
– Jei kitur paprasčiau, tai ir eisiu kitur
• Rekomendacija
– Neversti lankytojo naudotis nauja versija, o pasiūlyti ją pažvalgyti
– Jei atnaujinimas iš tiesų patogesnis, naudotojai pereis be rankų laužymo
![Page 16: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/16.jpg)
Pristatyti naują versiją ir leisti rinktisŠios svetainės kūrėjai neverčia naudotis nauja versija, tik ją pristato
Žiūrėta: 2010-11-29
![Page 17: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/17.jpg)
Naudotojus nuvilia
• Per didelis krovimosi laikas
• Uždelsimas turi būti prognozuojamas ir
nenuviliantis
• Vartotojas turi žinoti, kas vyksta ir kodėl
• Tikslinga perspėti vartotoją apie galimą uždelsimą
iš anksto
![Page 18: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/18.jpg)
TENDENCIJOS
![Page 19: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/19.jpg)
Responsive design
![Page 20: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/20.jpg)
1. Dizaino šablonų įsigalėjimas:
• Svetainės supanašėjo
2016.12.20 17:23
![Page 21: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/21.jpg)
Hamburger menu
![Page 22: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/22.jpg)
Nevienareikšmiškos piktogramos
• Mėsainio meniu
– Paprastai pagrindiniam meniu
– Kai kada - sąrašams
https://www.nngroup.com/articles/icon-usability/
![Page 23: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/23.jpg)
Nevienareikšmiškos piktogramos
• Širdelė ir žvaigždutė
https://www.nngroup.com/articles/icon-usability/
![Page 24: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/24.jpg)
Universalios piktogramos
homeprint
search
https://www.nngroup.com/articles/magnifying-
![Page 25: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/25.jpg)
2. Registracijos
• Vieno mygtuko paspaudimu
![Page 26: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/26.jpg)
3. Ilgas persukimas
2016.12.20 17:23
http://www.awwwards.com/6-web-design-
trends-you-must-know-for-2015-2016.html
![Page 27: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/27.jpg)
Kortelių dizainas
2016.12.20 17:23
![Page 28: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/28.jpg)
Animacijos
• Patraukia dėmesį
– Kraunant puslapį
– Navigacijoje
– Užuominos virš elementų
– Galerijose ir skaidrių prezentacijose
– Judesio rodymas
– persukime
2016.12.20 17:23
![Page 29: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/29.jpg)
Material design
![Page 30: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/30.jpg)
Flat design
![Page 31: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/31.jpg)
EGZAMINAS
![Page 32: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/32.jpg)
Data ir laikas
• Sausio 12 dieną, Didlaukio 103 aud.
• Nuo 10 val.
– PS1, PS2, PS3 (pusė grupės)
• Nuo 11 val.:
– PS3 (antra pusė), PS4, PS5
• Konsultacija
– Sausio 11, 10 val.
• Susitiksime foje.
2016.12.20 17:23
![Page 33: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/33.jpg)
![Page 34: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/34.jpg)
Literatūra MIF bibliotekoje
David Benyon, Phil Turner, Susan Turner
Designing Interactive Systems: People, Activities, Contexts, Technologies,
Addison Wesley,
2005, 2010, 2014
36ŽKS ištakos ir struktūra Studijų reikalavimaiMotyvacija Literatūra
![Page 35: Sąveikos projektavimas: apibendrinanti paskaitaweb.vu.lt/mif/k.lapin/files/2016/12/16_2016ruduo.pdfSąveikos projektavimas: apibendrinanti paskaita Žmogaus ir kompiuterio sąveika](https://reader035.vdocuments.net/reader035/viewer/2022070711/5ecb2fde1154204b814806eb/html5/thumbnails/35.jpg)
SĖKMĖS EGZAMINE
Kristina Lapin