270 likes | 389 Views
Kursusgang 4. Oversigt: Sidste kursusgang Opgaver Aktivitet 2: Generer design (fortsat) Design interaktionselementer Analysedokumentet. Udgangspunkt. Identificer behov Etabler krav. Evaluer design. Byg interaktiv version. Generer design. Resultat: Endeligt produkt. Sidste kursusgang.
E N D
Kursusgang 4 Oversigt: • Sidste kursusgang • Opgaver • Aktivitet 2: Generer design (fortsat) • Design interaktionselementer • Analysedokumentet DIEB
Udgangspunkt Identificer behov Etabler krav Evaluer design Byg interaktiv version Genererdesign Resultat: Endeligt produkt Sidste kursusgang • Aktivitet 2: Generer design • Relation til krav • Fremgangsmåde • Begrebsmæssig model • Baseret på aktivitet/objekter • Interaktionsformer • Eksempler • Interaktionsrum og interaktionselementer • Eksempel • Individuelle interaktionsrum • Samlet interaktionsrum DIEB
Opgaver • Begrebsmæssig model: beskriv begrebsmæssig model for et antal eksempler fra sidste lektion. • Interaktionsformer: hvad er de basale egenskaber (Hvordan udpeger vi et objekt?, Hvordan aktiverer vi en funktion?, Hvordan indlæses inddata? og Hvordan opstilles uddata?) for hver af de syv interaktionsformer. • Projekt. Fra brugsmønster til model af individuelle interaktionsrum: Interaktionsrum og opgaver. • Gentag opgave 1 for et andet brugsmøster i jeres projekt. • Brug de to individuelle modeller af interaktionsrum til at lave en samlet model af interaktionsrum. • Sammenhæng mellem begrebsmæssig model og interaktionsform:Overvej, hvilke interaktionsformer, der understøtter hvilke begrebsmæssige modeller.Udtrykt ved en tabel. DIEB
Udgangspunkt: Brugsmønster • Kontanthævning DIEB
Udgangspunkt Identificer behov Etabler krav Evaluer design Byg interaktiv version Genererdesign Resultat: Endeligt produkt Kursusgang 4 Oversigt: • Sidste kursusgang • Opgaver • Aktivitet 2: Generer design(fortsat) • Fremgangsmåde • Interaktionselementer • Muligheder for check • Design interaktionselementer • Analysedokumentet DIEB
Aktivitet 2:Generer design (fortsat) Designet af brugergrænsefladen: • Er et vigtigt krav til systemet (blandt andre) • Det overordnede design indgår i analysedokumentet • Det detaljerede design indgår i designdokumentet Hvordan (i jeres projekt): • Fastlæg en begrebsmæssig model for hele systemet • Identificer interaktionsrum (individuelle og generelle)(sidste kursusgang) • Definer interaktionselementer • Design interaktionselementer • Fastlæg interaktionsform for hvert interaktionselement • Udarbejd detaildesign for hvert interaktionslement • Check dette mod den begrebsmæssige model DIEB
Interaktionselementer • Præsentationsmodellen beskriver brugergrænsefladens elementer, de dele, som indgår i hvert element, samt mulighederne for at navigere mellem elementerne • Præsentationsmodellen beskrives ved et klassediagram • Præsentationsmodellen afstemmes løbende med brugsmønstrene: • kan man udføre brugsmønstrene ved at bevæge sig rundt i præsentationsmodellen • anvender brugsmønstrene de muligheder for at bevæge sig rundt, der er beskrevet i præsentationsmodellen DIEB
Notation • Elementerne i præsentationsmodellen er interaktionsrummene • Udgangspunkt: den samlede model af interaktionsrum • Hvert interaktionsrum beskrives som en klasse • Klassen detaljeres med: • attributter (input og output) • funktioner (action) • Knyt funktioner til de enkelte interaktionsrumsklasser • Beskriv også input- og output-elementer DIEB
Præsentations-model • Sæt alle klasserne op på en stor tavle • Identificer interaktionsrum, som er indeholdt i et andet interaktionsrum (aggregering) • Identificer overgange mellem interaktionsrum • ud fra det reviderede brugsmønster (det med hierarkiske tilstande) • diagrammet skal gøre det muligt at gennemspille alle brugsmønstre Notation: <<navigates>>: navigering mellem komponenter er muligt <<contains>>: interaktionsrummet forneden indgår i det foroven <<input elements>>: interaktionsrummets input-elementer <<output elements>>: interaktionsrummets output-elementer <<action>>: mulige handlinger (funktioner) DIEB
Muligheder for check af indhold • Designet af brugergrænsefladen kan holdes op mod de modeller, I har lavet med OOA&D-metoden • Klassediagram med attributter: • beskriver den information, der indgår i brugernes aktiviteter • denne information skal svare til input- og output-data i præsentationsmodellen • strukturerne i klassediagrammet skal svare til strukturerne i præsentationsmodellen – hvorfor? • dette kan checkes systematisk • Funktionsliste: • beskriver de services, brugerne aktiverer i anvendelsen af systemet • funktionerne (eller delfunktioner) skal svare til actions i præsentationsmodellen • dette kan checkes systematisk • Udfør disse check, før I begynder på detaildesign af interaktionselementerne DIEB
Kursusgang 4 Oversigt: • Sidste kursusgang • Opgaver • Aktivitet 2: Generer design (fortsat) • Design interaktionselementer • Fastlæg interaktionsform • Detaildesign af vinduer: Bridge • Eksempel • Øvelse • Analysedokumentet DIEB
Præsentationsmodellen indeholder den samlede mængde af interaktionselementer For hvert af disse elementer skal vi fastlægge interaktionsformen Skriv det ind som en kommentar i hvert element Muligheder: Kommando Menu Dialog Skemaudfyldelse WIMP Naturligt sprog Udskrivning af data Fastlæg interaktionsform DIEB
Detaildesign af vinduer: Bridge • Næste skridt består i at designe detaljerne i hvert interaktionselement • Dette kan gøres ved hjælp af Bridge-metoden • Bridge har til formål at skabe bro mellem krav og HCI-design • Vi bruger lidt af del 2 og del 3 fra Bridge-metoden DIEB
Bridge:Task-objekter • Task objekt: en samlet mængde information, som brugeren manipulerer for at udføre opgaven • Svarer til klasserne i pæsentations-modellen • Fire elementer: • Identitet: hvad kendetegner et objekt fra denne klasse • Attributter: egenskaber og relaterede objekter (navigate) • Handlinger: det systemets bruger gør ved objektet (funktioner) • Indholdsrelationer: det omgivende objekt og delobjekterne (aggregering) • Suppleres fra OOA&D-model • Brug ideen om at fokusere på task-objekter til at "berige" jeres præsentationsmodel DIEB
Bridge:Eksempel på task-objekter • For et hotel • Hvordan ser præsentations-modellen ud? DIEB
Bridge:Repræsentation af task-objekter • Lad indholdsrelationer (containment eller aggregering og dekomponering) afspejle sig i den måde, hvorpå klasserne repræsenteres i brugergrænsefladen • Eksemplet illustrerer, hvordan det at "Hotel" havde "Room" som "In me" kommer til udtryk: Hotel har en liste med Room-objekter DIEB
Fra task-objekter til GUI objekter • Tegnes på papir (fotokopier af tomme skærmbilleder) • For hvert task objekt besluttes det, hvilken repræsentation det skal have i brugergrænsefladen • De to typer interaktionsrum – browser og viewer – kan udtrykkes på standardform • Actions lægges ind i menuerne DIEB
Resultat • Resultatet er en samling af vinduer • For hvert vindue er der et forslag til detaildesign • Mellem vinduerne er angivet muligheder for navigering mellem dem • Kan bruges som grundlag for implementering af en første version af systemet • Efterfølgende kan der udføres usabilityevaluering sammen med brugerne DIEB
Eksempel • Illustrerer hvordan klasserne i præsen-tationsmodellen repræsenteres på skærmen • En anden teknologi end en stor skærm med mange vinduer DIEB
Aktivitet 2: Generer designOpsummering Hvordan (i jeres projekt): • Fastlæg en begrebsmæssig model for hele systemet • Identificer interaktionsrum • Definer interaktionselementer (præsentationsmodel) • Design interaktionselementer • Fastlæg interaktionsform for hvert interaktionselement • Udarbejd detaildesign for hvert interaktionslement • Check dette mod den begrebsmæssige model DIEB
Øvelse: Indlæggelse af patient • Ud fra et brugsmønster gennemføres metoden på opgaven med at indlægge en patient DIEB
Indlæggelse af patient: Brugbarhedsproblemer • Testperson L (2003-4) DIEB
Kursusgang 4 Oversigt: • Sidste kursusgang • Opgaver • Aktivitet 2: Generer design (fortsat) • Design interaktionselementer • Analysedokumentet DIEB
Analysedokumentet (1) • Stakeholders kan bruges til supplering af A'et i afsnit 1.2 • Personas kan bruges til supplering af beskrivelsen af aktører i afsnit 3.1.2 • Scenarier kan bruges til at give overblik før de detaljerede brugsmønstre som nyt afsnit 3.1.3(brugsmønstrene bliver så afsnit 3.1.4) • Et scenarie sammenfatter et antal brugsmønstre for en aktør DIEB
Analysedokumentet (2) Afsnit 3.3. Brugergrænsefladen 3.3.1. Mål for brug. Prioriteringsskema med mål i forhold til brugbarhed (usability) og brugeroplevelse (user experience). 3.3.2. Begrebsmæssig model. Karakteristik af den grundlæggende form hvorunder brugeren interagerer med systemet. Kan udtrykkes i forhold til aktiviteter eller objekter. 3.3.3. Interaktionsform. Beskrivelse af den eller de interaktionsformer, som forventes anvendt i brugergrænsefladens elementer. 3.3.4. Generel interaktionsmodel. En komplet oversigt over interaktionsrum for hele brugergrænsefladen og de opgaver, der hører til hvert interaktionsrum. DIEB
Opsummering • Færdige med aktivitet 2: generer design • De interaktioner, som systemet skal understøtte, er omsat til en præsentationsmodel • Der er en samling af specifikke vinduer svarende til interaktionselementerne i præsentationsmodellen • For hvert vindue er attributter og handlinger beskrevet DIEB