App

From CCT - Vidensdeling
Revision as of 15:17, 21 September 2016 by Lindskjold (talk | contribs)
Jump to navigation Jump to search

Status & planer

Der er produceret 2 worked examples, et statisk(HTML/CSS/JQUERY) [1] zip: [2] og et dynamisk (HTML/CSS/JQUERY/PHP) [3] zip: [4], med tilhørende backend (uden design) [5].

På baggrund fra feedback fra lærekollega på Campus har jeg tilrettet og samlet opgaverne i et dokument[6]. Afventer mere feedback fra Helena/Ken til resten af opgaverne.

Introduktion

Forløbet kan skaleres til både informatik C/B og IT A. Selve forløbet er tænkt som et ”stort” forløb, hvor de fleste af de faglige mål behandles og det kan bruge til elevens portfolio eller som et eksamensprojekt. Forløbet kan dog brydes op således at man kun beskæftiger sig med designet af interaktionen og modellering af processerne, hvor slutproduktet er en papirprototype. Man kan også præsentere eleverne for et design som de derefter skal implementere og derved have fokus på programmering af webapps i JQuery mobile. Derudover kan man også vælge om man laver en statisk webapp uden tilhørende database eller laver en dynamisk version hvor data hentes fra en database og eventuelle ordrer gemmes.

Formål

Eleverne anvender konstant app's i deres hverdag og dette forløb har til hensigt at give dem en basis viden omkring hvilke typer af app der er og hvilke hensyn man skal tage sig når man designer og udvikler apps. Desuden vil forløbet give eleverne kendskab til designprincipper, arkitektur, modellering og programmering.

Læreplansmål

Informatik:

  • Interaktionsdesign (C+B): Design af interaktionen i app'en
  • Arkitekur (C+B): IT-Arkitekturen i apps
  • Modellering (C+B): Modellering af flow og process i app'en
  • Programmering (C+B): Udvikling af app i JQuery mobile
  • Innovation (C+B): Alt efter emne kan den app der designes løse et konkret problem

Indhold

  • Baggrundsviden omkring app teknologi (native, hybrid og web)
  • Modellering af processer
  • Design af brugergrænseflader (gestalt, farver, typografi osv.)
  • Database modellering
  • Prototyping
  • Arkitekturdesign
  • Programmering af webapp i JQuery Mobile
  • Test af systener

Forudsætninger

  • Forforståelse: Hvis man agter at eleverne skal programmere en webapp er basis forståelse for HTML/CSS en klar fordel. Hvis man vil lave database versionen er grundlæggende kendskab til php en fordel.
  • Teknologi: PC med editor til programmering. Evt. en database og en PHP server.

Aktiviteter & materialer

Lektionsplan

Antallet af lektioner varierer efter hvor meget vægt man vil lægge på det enkelte emne. Selve udviklingen af app'en tager en del tid, hvis det skal være en prototype, der både visuelt og funktionelt, er af en vis kvalitet.

Materialer

Tekster:
Sådan kommer du i gang med din egen app, Kim Wassmann m. fl., Comprendo 2013 - [7]
Interaktionsdesign, Kapitel 15, ”Informationsteknologi”. Martin Damhus m. fl., Systime 2013
Gestaltlovene, Niels Gamborg - [8]
Farvernes betydning, Jacob Olsen - [9]
Klient-server og tre-lags-arkitekturen Version 1.0, Henrik Bærbak Christensen - [10]


Worked examples:
Statisk web app: [11]
Dynamisk web app med backend: [12]

Forløbet er opdelt i en række mindre opgaver:

1. Definering og analyse af mobile app’s og hvordan app-teknologien påvirker menneskelige aktiviteter. (Fagligt mål nummer 1)

2. Opstart af udvikling af webapp. Valg af systemudviklingsmodel og påbegyndelse af egentlig foranalyse. Hvad skal app’en indeholde og hvilke funktioner skal der være. (fagligt mål nummer 6)

3. Modellering af app’en. Beskrivelse af datamodel (fx E/R) og procesmodel (fx dataflow). Udvikling af database (fagligt mål nummer 3 og 5)

4. Udvikling af mockup / papirprototype. Test af prototypen ud fra både et bruger- og systemperspektiv. (fagligt mål nummer 6)

5. Endeligt design af app’en. Farver, grafik, typografi, gestalt, KISS, FTF. (fagligt mål nummer 6)

6. Definering af arkitekturen for app’en. (3-lagsarkitektur). (Fagligt mål nummer 2)

7. Udvikling af app i JQuery Mobile. (Fagligt mål nummer 4)

8. Test af det færdige produkt (Fagligt mål nummer 6)


Som prerequisite skal eleverne have grundlæggende kendskab til html.

Didaktisk vil selve udvikling af app’en være i form af worked examples, hvor eleverne vil få udleveret en række examples på væsentlige elementer fx DB connection, navigatiion, oprettelse af ordre, som skal tilpasses til det design eleven vælger.

Eksempler på et forløb der er kørt: [13]

Litteratur anvendt til forløbet: [14]

Eksempler som eleverne arbejder videre med: [15]

Færdigt system - eleverne får det udleveret i små bidder: [16]

Elev eksempler: [17] [18] [19]