käyttöliittymien perusteet 26.10 - uta.fi · käyttöliittymien perusteet 26.10.2011...
TRANSCRIPT
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
1
WIMP-käyttöliittymät: Ikkunointi
Saila Ovaska
Informaatiotieteiden yksikkö
Tampereen yliopisto
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
2
Tarjolla tänään
• WIMP – Windows, Icons, Menus, Pointing Device– Mikä on ikkuna?– Ikkunan osat– Navigointi ikkunoiden välillä, ikkunanhallinta
• Esimerkkejä erilaisista ikkunointijärjestelmistä
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
3
WIMP-käyttöliittymien historiaa
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
4
Tietojenkäsittelyn historiaa…
• Isot tietokoneet, kaukana konesaleissa – Eräkäyttö (batch processing)– osituskäyttö (time sharing) – käyttäjän kannalta vuorovaikutteista
• the IBM Personal Computer 1981– DOS… kunnes Windows 3.0 vuonna 1990– v. 1983 myyty jo 1 300 000 PC-konetta
Paul Allen & Bill GatesMicrosoft 1975
Steve Wozniak & Steve JobsApple 1975
Xerox PARCPalo Alto ResearchCenterfirst Alto 1972-1973
The best way to predict the future is to invent it.
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
5
Xerox 8010 – Xerox ”Star”
• April 1981
• Double-clickable icons, mouse, overlapping windows, dialog boxes and a 1024*768 monochrome display.
• J. Johnson, T. L. Roberts, W.Verplank, D. C. Smith, C. Irby and M. Beard, K. Mackey, The Xerox "Star": A Retrospective. Human Computer Interaction: Toward the Year 2000, Morgan Kaufman Publishers.
http://www.digibarn.com/friends/curbow/star/retrospect/index.html
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
6
Historiaa lyhyesti…
• WIMP-käyttöliittymienkaupallinen kehitys– Xerox ”Star”, 1981:
työpöytä ja ikkunointi– Yksittäisen pikselin tarkkuus
grafiikassa; 72 dpi– käyttöliittymässä uusia
mahdollisuuksia visuaaliseen suunnitteluun: fontit ja typografia, eri kielet, vektorigrafiikka ja muu kuvitus (mutta näyttö oli mustavalkonäyttö, ei vielävärejä käytössä vaan mustan eri vaaleusasteita)
– Ethernet ja lasertulostus
Kuvan lähde: www.digibarn.com http://www.digibarn.com/friends/curbow/star/retrospect/index.html
http://www.youtube.com/watch?v=Cn4vC80Pv6Q
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
7
Historiaa lyhyesti…
• Xerox ”Star” on esikuva WIMP-käyttöliittymille– Mutta siinä ei ollut roskakoria…
– Osa toiminnallisuudesta näppäimistön ”geneerisillänäppäimillä”
– valitse kohde (tiedosto, viiva piirroksessa, …) hiirellä ja paina Delete-painiketta
Kuvan lähde: www.digibarn.com http://www.digibarn.com/friends/curbow/star/retrospect/index.html
http://www.youtube.com/watch?v=Cn4vC80Pv6Q
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
8
Mikä on WIMP?
• Alkuperäiseen WIMP-käyttöliittymään kuuluu– Windows
• Ikkunoita voi avata, sulkea, vierittää, muuttaa kokoa, liikutella työpöydällä, pitää limittäin
– Icons• Ikonit, kuvakkeet esittävät sovelluksia, objekteja, komentoja ja
työkaluja ja ne avataan tai aktivoidaan klikkaamalla
– Menus• Valikot tarjoavat listan vaihtoehdoista, listaa voi vierittää ja
valinnan voi tehdä klikkaamalla (vrt. ruokalista eli menu ravintolassa)
– Pointing device (osoitinlaite)• Hiirellä tai muulla osoitinlaitteella ohjataan kursoria, jolla
manipuloidaan näytöllä olevia ikkunoita, kuvakkeita ja valikoita
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
9
Apple Macintosh – 1984
http://en.wikipedia.org/wiki/Mac_OS, http://www.mac-history.net/
http://www.openculture.com/2009/02/steve_jobs_demos_the_first_macintosh_in_1984.html
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
10
Windows 1.01 - 1985
Ei vapaasti liikuteltavia ikkunoita, vaan ikkunat aseteltiin vierekkäin (tiled).
http://toastytech.com/guis/guitimeline.html
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
11
Windows 2.03 e
Liikuteltavat ikkunat ja ikkunoiden hallintatyökaluja.
http://toastytech.com/guis/guitimeline.html
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
12
Windows 95
http://toastytech.com/guis/guitimeline.html
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
13
http://www.xwinman.org/
Kuvassa: KDE 3.3 http://www.kde.org/
http://en.wikipedia.org/wiki/X_Window_System
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
14
… ja uusia versioita: KDE 4.7
http://www.kde.org/announcements/4.7/KDE 4.7. Plasma and applications
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
15
Ulkonäkö
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
16
Ikkunat uudistuvat…
• Ikkunoiden ulkoasu ennen– Kaikki ikkunassa kulmikasta
– Raskas ja synkkä ulkoasu, mm.pseudo-3D varjostukset painikkeissa
• Vuorovaikutuksen näkökulmasta– Käyttöliittymäelementit olivat paisuneet (työkalupalkit,
kuvakkeet,…) ja veivät suuren tilan ikkunoista sisällön sijaan
• Mac OS, 2002– Ulkoasun suunnittelun lähtökohtana: väriä ja hauskuutta
– Vuorovaikutus: Mac OS 8.5ssä oli seitsemän tapaa hallita ikkunoita tavoitteeksi ikkunoinnin yksinkertaistaminen
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
17
Vista & Windows 7: ikkunoiden Glass-ulkonäkö
Standardi-ikkunoillaläpinäkyvät kehykset
Joskus kontrollit sijoitetaan kehykseen
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
18
Maksimoidulla ikkunalla on erilainen ulkonäkö.
… ja mukaan on tullut ikkunoita, joita ei
raamiteta.Windows desktop gadgets
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
19
Pääikkunat, ali-ikkunatModaalidialogin käsite
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
20
Ikkuna (window)
• Ikkuna on ruudulla oleva rajattu alue, joka voi sisältäätoiminnallisuutta, tekstiä, grafiikkaa
• Ikkunalla on tiettyjä ominaisuuksia (riippuen ikkunan tyypistä ja ohjelmasta)
• Otsikkorivi?• Valikkorivi?• Vierityspalkki?• Liikuteltavuus?• Koon säädeltävyys?
• Samanaikaisesti voi olla auki monta ikkunaa useampi käyttäjän tehtävä voi olla näkyvillä yhtä aikaa
– fokus on kuitenkin vain yhdessä niistä
Ikkuna (window) = Näyttöpinnan osa, jokatarjoaa käyttäjälle liittymäntietojärjestelmään tai sen toimintoon.‐ ATK‐sanakirja
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
21
Ikkunointi
• Ohjelma aukeaapääikkunassa (main window)
• Pääikkunan osat– Otsikkorivi
• Pienennyspainike• Suurennuspainike• Sulkemispainike
– Valikkorivi– Tilarivi– Vierityspalkki
• Ali-ikkunat (secondary window)– Mm. dialogit, viestiruudut, paletit– Tukevat pääikkunassa tapahtuvaa käyttäjän toimintaa– Valikkokomennossa ali-ikkunan aukeaminen osoitetaan
merkinnällä … komennon nimen jälkeen
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
22
Ali-ikkunan aukeaminen
Pääikkunan valikko
Valikosta avautunut dialogi
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
23
Tuttuja dialogeja
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
24
Usein ns. modaalidialogeja
• mitä tapahtuu, kun ohjelman suorituksessa on avattu ali-ikkuna ja käyttäjä yrittää napsauttaa pääikkunan aktiiviseksi?
• miksi tapahtuu näin (eli miksi tarvitaan modaalidialogeja)?
• Modal dialogue vs. modeless dialogue– Anna esimerkki moodittomasta dialogista!
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
26
Macintosh OS X Sheet – ”Lakana”
[Apple HIG]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
27
Aktiiviset ikkunat Macissa
Päällimmäisenä oleva ikkuna (”Key window”) ottaa käyttäjän syötteen Fontin muutos vaikuttaa samalla hetkellä pääikkunassa. Fonts-dialogia ei tarvitse sulkea, kun palataan pääikkunaan.
[Apple HIG]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
28
Ikkunoiden hallinta Mac OSX
• The foremost document or application window that is the focus of the user’s attention is referred to as the main window.
• The main window is often also the key window. The key window is the window that accepts user input, whether from the keyboard, mouse, or alternative input device. The “close window” keyboard shortcut, Command-W, targets the key window.
• Main and key windows are both active windows.
• An active window is visually distinct from an inactive window in that its title bar (and its toolbar, if there is one) displays the standard window-frame color, while the title bar (and toolbar) of an inactive window displays a lighter shade of the window-frame color.
[Apple HIG]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
29
Eriasteisia modaalisia dialogeja
• Fonts-dialogi on esimerkki moodittomasta dialogista (lapsi-ikkunasta)– auki rinnalla eikä estä pääikkunan käyttöä
• Macintoshissa tunnetaan kaksi modaalidialogin muotoa– Document-modal– Application-modal
• Windows-ikkunat Application-modal– (System-modal)
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
30
Ikkunan osia
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
31
Windows-pääikkunan osia
Pystyvieritys-palkki
Tehtävä-ruutu(task pane)
Valikko-rivi
otsikkorivi (title bar
sulkemis-painike
pienennys-suurennus-
vieritys-ruutu(scroll box)
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
32
Ikkunoita onmonenlaisia
[WindowsUserExperience]
[Apple HIG]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
33
Ikkunoita: Windows 2000
Mistäerottaapääikkunan jaali-ikkunan?
[WindowsUserExperience]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
34
Windowsin ali-ikkunoita
• Secondary windows (ali-ikkunat, ei-pääikkunat)– Dialogit, kuten Tallenna nimellä... tai Avaa...
• Otsikkorivi kertoo ikkunan tarkoituksen
– Välilehdelliset dialogit, kuten Asetukset ja Ominaisuudet– Viestiruudut (message box), virheilmoitukset
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
35
Microsoft Windows: suosituksia
[vanha Windows User Experience]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
36
Ikkunoita: Macintosh OS X
http://www.apple.com/macosx/
kun dokumentissa on tallentamattomiamuutoksia
Proxy-kuvakkeestaesim. raahausmailin liitteeksi
huomaa: pääikkunassa ei ole valikkoriviä.Missä Macissa on valikko?
[Apple HIG]
valikkorivitällä hetkellä käytössäFinder
Dockvrt. Windows tehtäväpalkki taskbar
[Apple HIG]
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
38
Windows 7 Valintanauha (Ribbon)
• Perusvalikoiden ja -työkalupalkkien uudelleensuunnittelu– Tarkemmin valikoiden yhteydessä
[UXGuide]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
39
Ikkunatyyppejä
Dialog box Keskusteluikkuna (KÄLIn
suositus) Valintaikkuna (Windows-
suomennos) Viestiruutu (Atk-sanakirja)
Message box Viestiruutu, viesti-ikkuna tai
sanomaruutu
Palette window / panelValikoimaikkuna (Windows-suomennos)
Property sheet (Windows) / Inspector window (Mac) Ominaisuusikkuna
Inspector window
[Apple HIG]
A transparentpanel
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
40
Vista: Property windows
Asettelu pystyyn tai vaakaan
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
41
Mac OSX: Preferences window
Huomaa: ei OK- eikä Cancel-painikkeita. Miten ikkunat suljetaan?Milloin muutokset astuvat voimaan?
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
42
Vieritys
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
43
Vierityspalkit
• Scroll bar– Vierityspalkki
• Scroll arrow– Vieritysnuoli
[Apple Human Interface Guidelines]
• Scroll box– Vieritysruutu
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
44
Mietittäväksi…
• Mihin suuntaan teksti liikkuu vieritettäessä?
• Miten paljon se liikkuu vierityspalkin eri osista?– Vieritysruudusta raahaamalla– Vieritysnuolia napauttamalla
• Miten saa aikaan automaattisen vierityksen?
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
45
Vierittimiin liittyviä ongelmia
• Kenguruefekti: vieritysruudun kulkeutuminen hiiriosoittimen alle tai ohitse, kun vieritetään sivu kerrallaan
• Vierityksen pysähtyminen, jos hiiriosoitin harhautuu liian kauas vieritysruudusta
• Liian vähäinen palaute siitä, missä kohdassa dokumentissa ollaan
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
46
Miten palautetta voisi lisätä?
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
47
Miten voisi helpommin löytää takaisin?
Alexander et al. (2009). Revisiting read wear: analysis, design and evaluationof a footprints scrollbar. CHI’09. ACM DOI.
Footprints scrollbar- Merkintä automaattista - Käydyn paikan merkki- Thumbnail-pikkukuva- Värikoodaus,”jälki vanhenee”- Vain 10 kpl/dokumentti- Vanhimmat häipyy kokonaanToimiiko se?
jalanjälkikirjanmerkkiTaustalla oleva metafora:
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
48
Mietittäväksi…
• Kun käyttäjä raahaa kohdetta, mistä järjestelmätietää, pitääkövierittää kansion sisällä(automatic scroll) vai haluaako käyttäjä siirtyäpois tästä kansiosta?
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
49
Vierityksen tehostaminen
• Tuplanuolilla sivu kerrallaan selaaminen
• Microsoft Word: vierityspalkin yhteydessäerilaisia dokumentin selaustapoja ”piilotettuina”
• Uudemmissa Wordeissa selaaminen kuva kuvalta tai taulukko taulukolta jne.
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
50
Ikkunoinnin erikoistapauksia
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
51
Ikkunan jako ruutuihin
[UXGuide]
[UXGuide]
pane = ruutu
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
52
Ikkunan jako ruutuihin
vrt. split-operaatio (split = Jaa)ikkunan sisällä
vaakasuora jakopalkki(esim. Excelissä myöspystysuora jakopalkki)
Miten ruudutus ja jakaminen osiin eroavat toisistaan?
[WindowsUserExperience]
[UXGuide]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
53
Ikkunan jako ruutuihin Javassa
Nested split panes: http://java.sun.com/products/jlf/ed2/book/HIG.Windows3.html
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
54
Ei näkyviä kehyksiä
• ”Gadgets” Vistassa Vrt. MacissaDashboardwidgets
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
55
”Työpöydän pienoisohjelmat”
• ”normaalitilassa” vs.
• asetuksia muutettaessa
[UXGuide]
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
56
Ikkunoiden hallinta
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
57
Mietittävää…
• Milloin ikkuna on aktiivinen?
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
58
KDE Window Behavior Settings
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
59
Mietittävää…
• Milloin ikkuna on aktiivinen?
• Miten voi liikkua ikkunoiden välillä helposti?
Alt + tab
[UXGuide]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
60
Windows 7
Tehtäväpalkissa olevista ikkunoistasaa pikkukuvan (thumbnail) näkyviin hiiren kursorilla.
Alt+Tab
Flip 3D ikkunoiden selausWindows logo key+Tab
[UXGuide]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
61
Macintosh OS X
• Dock-valikko– sovelluksien avaamiseen ja auki olevien sovellusten välillä
liikkumiseen– sisältää usein käytettyjen sovellusten ja auki olevien sovellusten ja
tiedostojen kuvakkeita
– vaihteleva määrä kuvakkeita, skaalautuu työpöydän leveyteen ja kursorin kohdalla olevat kuvakkeet suurenevat
• Exposé– Auki olevan ikkunan löytäminen, työpöydän esiin tuominen
http://www.apple.com/macosx/what-is/http://mactutorial.wikidot.com/macbasics:a06
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
62
Macintosh OS X
• Dock Stacks– Viimeiset lataukset ja
dokumentit ponnahtavat viuhkaksi tai ruudukoksi
http://images.appleinsider.com/leopard-preview-dock-12.png
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
63
Useat työpöydät
• KDE:ssa tarjolla neljä virtuaalista työpöytää (virtualdesktops)– Pikkukuvassa (pager) näkyy kullakin työpöydällä auki olevat
ikkunat asetteluineen
• Macintosh OS X ”Spaces”– Liikkuminen useamman yhtäaikaisen
työpöydän välillä– Ei enää käytössä (vrt. seuraava kalvo)
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
64
Monta virtuaalista työpöytää
Työpöydät (ja Dashboard) saatavilla esim. Exposé-näkymässäKs. ”Mission Control” [Apple HIG]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
65
Ikkunoiden asettelun termejä
• Tiled– vierekkäiset ikkunat
• Overlapping– päällekkäiset ikkunat
• Cascading– limittäiset ikkunat
cascading windows
Kuvan lähde: http://www.answers.com/topic/cascading-windows
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
66
Dokumentti-ikkunoiden hallinta
• Multiple document interface, MDI– Vanhempi-ikkuna (sovellus) ja lapsi-ikkunat
(dokumentit)• Käyttäjä voi työskennellä useamman dokumentin kanssa
yhtä aikaa
[WindowsUserExperience]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
67
Multiple Document Interface
[WindowsUserExperience]
Käyttöliittymien perusteet 26.10.2011
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
68
Dokumentti-ikkunoiden hallinta
• Multiple document interface, MDI– Vanhempi-ikkuna (sovellus) ja lapsi-ikkunat
(dokumentit)• Käyttäjä voi työskennellä useamman dokumentin kanssa yhtä
aikaa
– Vaikeutena hahmottaa, mitkä ikkunat ovat milloinkin auki
• Ratkaisuja: tehtäväpalkit, tehtävien hallinta, dock-valikko yms. ikkunoiden välillä liikkumiseen
• Nykyisin yleistynyt ratkaisu: välilehdet (tabbed documentinterface, TDI)
• Single Document Interface, SDI– Kaikki ikkunat erillisiä toisistaan
[WindowsUserExperience]
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
69
Uusia ikkunointi-ideoita
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
70
Uusia tuulia...
• Metisse desktop– Välilehdet (tabbed windows)– Kääntyvät (rotating) ikkunat– Kuoriutuvat/taittuvat
(peeling) ikkunat
Beaudouin-Lafon, Novel Interaction Techniquesfor Overlapping Windows. Proc. UIST’01.
http://insitu.lri.fr/metisse/
• Ikkunoiden välillä liikkuminen– Kiertyvät ikkunat (rolling)– Copy-paste päällekkäisten
ikkunoiden välillä
Chapuis & Roussel. Copy-and Paste Between Overlapping Windows. Proc. CHI’07.
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
71
Project Looking glass
• Looking glass tuo 3D metaforan työpöydälle– Kolmiulotteisuus, läpinäkyvyys, …– Javaan perustuva, alustasta
riippumaton– ”Käyttäjät voivat organisoida
työtään paremmin ja olla vuorovaikutuksessa visuaalisesti miellyttävällä ja rakentavalla tavalla.”- John Fowler, Sun Microsystems
Muistiinpanojen lisääminenkääntyvän ikkunan takapuolelle.
http://www.youtube.com/watch?v=SMWd1FOgr18Kuvan lähde: http://en.wikipedia.org/wiki/Project_Looking_Glass
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
72
BumpTop Desktop
• Fyysisen työpöydän metafora– Dokumentit pinoissa ja
epämääräisessä (mutta merkityksellisessäjärjestyksessä)
• Ominaisuuksia– Tabletop UI
– Pinot keskeinen organisointitapa
– Nätit ja sotkuiset pinot
– Dokumenttien heittely, törmäily
http://bumptop.com/
Agarawala & Balakrishnan (2006). Keepin' it Real: Pushing the Desktop Metaphor with Physics, Piles and the Pen. Proceedings of CHI 2006, 1283-1292.
University of Toronto, Dynamic Graphics Project
TAUCHI – Tampere Unit for Computer-Human InteractionTAUCHI – Tampere Unit for Computer-Human Interaction
73
Ikkunointi – yhteenveto
• Ulkonäköeroja järjestelmien välillä– ”perus-GUI” mutta oma look & feel
• Toiminnallisia eroja vuorovaikutuksessa
• Erilaisia ikkunointimalleja– Yhden dokumentin käsittelystä monen dokumentin samanaikaiseen
avoinna oloon– Ikkuna jaettu osiin jotta saadaan samaan aikaan useita näkymiä
avoinna olevaan sisältöön (kuten excelissä)– Samaan kohteeseen liittyviä (eri hierarkiatasojen) ruutuja samalla
kertaa näkyvillä• Esimerkiksi sähköpostiohjelman kansiot, tulleet postit ja yksi viesteistä
– Myös uusia ratkaisuja ikkunoiden esittämiseen ja käsittelyyn
• Useinkaan käyttäjä ei ole kiinnostunut ikkunasta sinänsä vaan sen sisällöstä. Ikkuna tarjoaa raamit, joissa sisältöä voidaan tarkastella