Design och konstruktion av grafiska gränssnitt

Transkript

1 Design och konstruktion av grafiska gränssnitt Peter Börjesson Interaktionsdesign Tillämpad informationsteknologi Chalmers/GU

2 Idag Kort kursinfo Lab info Föreläsning - Vad utmärker ett bra användargränssnitt?

3 Om kursen Design och konstruktion av grafiska gränssnitt Inte i första hand en kurs om gränssnittsprogrammering En kurs om gränssnittsdesign Metoder för att utveckla gränssnitt Studera och förstå användarna Ta fram prototyper Testa och göra om Projekt och labbar i Java Det blir en del programmering också

4 Läromål Efter genomgången kurs skall studenterna kunna: Skapa och motivera skisser på ett grafiskt gränssnitt baserat på en specifik användning och användargrupp Implementera ett gränssnitt genom tillämpning eller expansion av ett standardbibliotek för grafiska gränssnitt Arbeta iterativt för att skapa lättanvända gränssnitt genom en växelverkan mellan implementation och användartest Genomföra projekt där uppdelning och koordinering av arbetsuppgifter mellan medlemmar behövs Utveckla och specificera projektmål successivt allteftersom ett projekt genomförs Kurshemsidan Studentportalen

5 Kurshemsida Kurshemsida Se till att kolla den ofta Viktiga deadlines markerade PingPong Inlämningar Utskick av viktig info Viktigt med registrering

6 Ansvariga Kursansvarig: Olof Torgersson Lärare: Olof Torgersson Armin Nezirevic Peter Börjesson Handledare: Hanna Kowalska Elleberg Max Witt Mathias Forssén

7 Kurslitteratur Tidwell - Designing Interfaces (Cooper - About Face) Finns som e-böcker på Chalmers bibliotek Annat material finns på kurshemsidan

8 Upplägg Föreläsningar Övningar (5st, obligatoriska) Labbar (2st, obligatoriska) Projekt Tenta Lab, övningar, projekt och tenta krävs för godkänt Betyg sammanvägning av projekt och tenta Tenta 55% av betyget Lab och övning betygssätts inte (U/G)

9 Övningar Syftar till att ge träning i olika delar av designprocessen för grafiska gränssnitt. Övning 1: Gör om, gör rätt Övning 2: Design för användare i olika stadier Övning 3: imat skisser Övning 4: imat pappersprototyp test Övning 5: Cognitive walktrough Obligatorisk närvaro i salen Missade övningar 1-4 kan tas igen på uppsamlingstillfället 25 februari Missad övning 5 tas igen genom inlämningsuppgift.

10 Projekt Presenteras på föreläsningen den 5 februari Designa och prototypa ett användargränsnitt för imat en online mataffär Genomförs i grupper av 4 vi bestämmer grupperna Fyll i enkät 3 delar Design 35% Prototyp 35% Rapport 30%

11 Tentamen Salstenta Hjälpmedel En fusklapp med viktiga begrepp Gjord av oss. Ni får inte göra den själva.

12 Laborationer Kursens labbar syftar till att ge träning i att bygga prototyper av grafiska gränssnitt med hjälp av NetBeans och Java. Laboration 1 - En enkel adressbok Laboration 2 - Receptsökning Alla laborationer redovisas genom att demonstrera programmet för en handledare. Inlämning görs genom pingpong: kod + uppgift Missade laborationer kan tas igen på uppsamlingstillfället den 11 februari.

13 Utvecklingsmiljö Lab och projekt görs med Java + NetBeans samt en skalapplikation som vi tillhandahåller. Motiv Java Bra GUI editor i NetBeans GUI-design kärnan i labbarna Rätt komplexitet Fritt fram att använda andra utvecklingsmiljöer, men handledning och instruktioner är riktade mot Netbeans. Krav på använda GUI-editor

14 NetBeans

15 Skalapplikationen ExampleApplication.java Startar upp, avslutar m.m. ExampleApplicationView extends JFrame Jframe och menu finns Redo att börja skapa med GUI-editor initcomponents() Rör aldrig denna Properties-filer Alla strängar på samma ställe Bra för att stödja olika språk

16 Kopplingar Drar objekt till vyn Lämpliga variabler skapas Ändra namnen Kan kopplas till Properties-fil Events Tomma metoder private void buttonpressed(java.awt.event.actionevent evt) { } // TODO add your handling code here:

17 Arkitektur Lab 1 En form av MVC Model-View-Presenter Controller (Presenter) har referenser till både model och view Samordnar kommunikation åt båda hållen Model och Presenter/Controller finns klara

18 Arbetsmetod i kursen Gör saker nu! Projekt andra halvan Kommer inte hinna tenta-plugga i slutet

19 Att göra (1/2) Registrera er på kursen! Viktigt att få tillgång till pingpong Kolla läsanvisningar under resurser på hemsidan Läs GUI-historia Läs preface i Tidwell Läs om Flow och Excise ur boken About Face av Alan Cooper Gör övning 1 på onsdag

20 Att göra (2/2) Lab 1 ska göras denna veckan Börja idag med förberedelser Ha koll på verktyg före onsdag Lab onsdag och fredag ska räcka Kan göras hemma, men ska redovisas för handledare