indholdsfortegnelse · bettina lehmann - eksamensopgave, 3. semester for valgfaget mobile...

20
Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 1 INDHOLDSFORTEGNELSE Indledning .......................................................................................................................................................... 3 problemformulering .......................................................................................................................................... 3 Udviklingsarbejde .............................................................................................................................................. 4 Procesbeskrivelse .......................................................................................................................................... 4 Udviklingsmetode ...................................................................................................................................... 4 Projektstyring ............................................................................................................................................ 5 Anvendt teori og metode (begrundelse for valg af teorier & metoder). ...................................................... 5 Oplevelsesøkonomi ................................................................................................................................... 5 De fire E’er ................................................................................................................................................. 6 Dream society ............................................................................................................................................ 6 Mobilkontekst med stort K ........................................................................................................................ 6 MobilKontekst med lille K.......................................................................................................................... 7 Delkonklusion ................................................................................................................................................ 7 Produkt dokumentation .................................................................................................................................... 7 Konceptbeskrivelse........................................................................................................................................ 7 Udformning................................................................................................................................................ 8 Beskrivelse af brugssituation ......................................................................................................................... 8 Brugerprofil................................................................................................................................................ 8 Brugerscenario........................................................................................................................................... 9 Dokumentation & argumentation for dine designvalg ................................................................................. 9 Teknisk dokumentation ............................................................................................................................... 10 Kravspecifikationer .................................................................................................................................. 10 Beskrivelse af informationsarkitektur ..................................................................................................... 10

Upload: others

Post on 25-Sep-2020

1 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

1

INDHOLDSFORTEGNELSE

Indledning .......................................................................................................................................................... 3

problemformulering .......................................................................................................................................... 3

Udviklingsarbejde .............................................................................................................................................. 4

Procesbeskrivelse .......................................................................................................................................... 4

Udviklingsmetode ...................................................................................................................................... 4

Projektstyring ............................................................................................................................................ 5

Anvendt teori og metode (begrundelse for valg af teorier & metoder). ...................................................... 5

Oplevelsesøkonomi ................................................................................................................................... 5

De fire E’er ................................................................................................................................................. 6

Dream society ............................................................................................................................................ 6

Mobilkontekst med stort K ........................................................................................................................ 6

MobilKontekst med lille K .......................................................................................................................... 7

Delkonklusion ................................................................................................................................................ 7

Produkt dokumentation .................................................................................................................................... 7

Konceptbeskrivelse ........................................................................................................................................ 7

Udformning................................................................................................................................................ 8

Beskrivelse af brugssituation ......................................................................................................................... 8

Brugerprofil................................................................................................................................................ 8

Brugerscenario........................................................................................................................................... 9

Dokumentation & argumentation for dine designvalg ................................................................................. 9

Teknisk dokumentation ............................................................................................................................... 10

Kravspecifikationer .................................................................................................................................. 10

Beskrivelse af informationsarkitektur ..................................................................................................... 10

Page 2: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

2

Brugertest ................................................................................................................................................ 12

Udvalgte eksempler på dynamisk kildekode ........................................................................................... 12

Konklusion ....................................................................................................................................................... 14

Bilag ................................................................................................................................................................. 15

Bilag 1: FitnessWorld – kort og godt ........................................................................................................... 15

Bilag 2: De seks tænkehatte ........................................................................................................................ 15

Bilag 3: Databaseordbog.............................................................................................................................. 16

Bilag 4: Tidsplan ........................................................................................................................................... 17

Bilag 5: Spørgeskema ................................................................................................................................... 18

Bilag 6: EksempLER på brugerprofilER ......................................................................................................... 18

Bilag 7: Tænk-højt-testen ............................................................................................................................ 19

Litteraturliste ................................................................................................................................................... 20

Page 3: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

3

INDLEDNING

I mange år har vi hørt fra alle sider at vi skal spise sundt og motionere mindst 30 minutter dagligt. I dag kan

det dog være svært at finde den fornødne tid til at motionere og lave sund mad. Vi lever i et samfund, hvor

alle har travlt med arbejde og familie – og mange har svært ved alene at nå alle de daglige gøremål. Derfor

kan det være svært at finde motivation og overskud til at tage bedre vare på sig selv - også selv om at vi ved

at det er vigtigt.

PROBLEMFORMULERING

Opgaven lyder på at udvikle en mobilapplikation med emnet sundhed i fokus, som kan hjælpe brugeren til

at tage vare på sig selv. Jeg fokuserer på motion, og har taget udgangspunkt i fitnesscenteret,

FitnessWorld(FW1) som tilbyder træning gennem dynamiske og fleksible tiltag2.

Der er opstået et nyt behov hos mange fitnessudøvere, som ikke stemmer overens med FW’s vision om

billigt medlemskab. Danskerne vil gerne have en personlig træner, hvilket koster mindst 500 kr. for en

enkelttime3.

Er en mobilapplikation en mulig løsning, som giver medlemmerne en form for personlig træning

uden at en personlig træner behøver at være til stede fysisk ved hver træning?

o Hvis det er tilfældet, er danskerne villige til at anvende mobilen under træning?

o Hvad skal der til for at motivere dem til at bruge den?

o Hvilken udformning skal den have for at fungere optimalt?

o Og ikke mindst hvilket indhold skal den have for at give medlemmet fornemmelsen af at

hun blevet assisteret af en instruktør?

Det virker som en naturlig overgang fra problemformuleringen at afsløre en grov skitse, som tager fat i

det sidste spørgsmål (det vil blive udspecificeret i kapitlet om konceptbeskrivelse):

Mobilapplikation-løsningen skal give adgang til et(flere) træningsprogram tilrettelagt af en instruktør og et

medlem. Jeg har valgt at udvikle løsningen som en webapplikation i jQuery mobile(jQm)og PHP, da

størstedelen af indholdet skal hentes fra/skrives til en database. Da der ikke er brug for mobilens egne

funktioner, er der ikke behov for en native applikation.

Jeg har grundet tidsrammen på 14 dage valgt at udvikle et grundkoncept, som jeg kan nå at

implementere. Jeg vil give en beskrivelse af de ekstra funktioner, som jeg ikke når at realisere. Derudover

1 Bilag 1: Kort og godt om FitnessWorld

2 De fokuserer på at gøre det let at komme i gang med træning, bevare motivationen og få en god oplevelse.

http://www.fitnessworld.dk/traen-hos-fitness-world - Se også Bilag omkring FW 3 Schultz, Karina(2011): “Danskerne elsker personlig træning”.

Page 4: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

4

har jeg løst opgaven ud fra det faktum at jeg har været alene om projektet. Nogle ting ville være gjort

anderledes, hvis jeg havde heft et team bag mig.

UDVIKLINGSARBEJDE

Én ting er af at have en idé. En anden ting er at visualisere den og udvikle et fysisk produkt indenfor en

begrænset tidsramme. I kapitlet fremlægges de metoder og den projektstyring som jeg har anvendt under

udviklingen af mobilapplikationen. Dernæst præsenterer jeg de teorier og metoder som ligger til grund for

konceptet.

PROCESBESKRIVELSE

Jeg fremlægger og begrunder her min udviklingsmetode og projektstyring.

UDVIKLINGSMETODE

Jeg har valgt at anvende en sammensat procesudvikling af vandfald og iterativ prototyping:

1. Vandfaldmetodens faste deadlines passer til min strukturerede arbejdsgang.

2. Prototyping gør det muligt for mig at skabe noget konkret tidligt, og det samler mine tanker og min

fokus.

3. Den iterative metode hjælper mig til at tage konceptet og dets udvikling op til revision, og tilpasse

projektet ud fra de erfaringer, som jeg løbende gør mig under udviklingsprocessen.

Udviklingsprocessen har bestået af følgende antal trin:

1. Brainstorm og mindmap af emnet og mulige indfaldsvinkler. Resultatet blev vurderet vha. ”de seks

tænkehatte”4, og idéen til FW blev valgt.

2. Research bestående af spørgeskema, søgninger på Google og en snak med FW.

3. En skitse af grundidéen.

4. De forskellige funktioner udspecificeret og tegnet i en wireframe.

5. Et logisk- og fysisk E/R diagram blev tegnet.

6. Attributterne til de forskellige entiteter blev sat op i en databaseordbog5(inklusiv normalisering).

7. Tabellerne blev oprettet i databasen.

8. De fysiske PHP-sider blev lavet og de visuelle dele til brugerfladen udviklet. Det hele blev dernæst

implementeret i jQm.

4 Metode til idé-udvikling(Bilag 2: De seks tænkehatte)

5 Bilag 3: Databaseordbog

Page 5: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

5

9. Til sidst tog nogle testpersoner en ”tænk-højt-test” for at kommentere eventuelle fejl og

manglende logisk flow.

Under hele forløbet er koncept, wireframe (og E/R diagram) blevet rettet til efterhånden som løsningens

funktioner er blevet lavet, og problemer har krævet en løsning.

PROJEKTSTYRING

De enkelte dele af projektet er blevet nøje vurderet ud fra kompleksitet og tidsfaktor, og hvilken

rækkefølge de skulle udføres i. Jeg skabte et fundament, som jeg dernæst byggede videre på. Jeg medtog

en plan B i tidsplanen6 ud fra den risiko at jeg ville få problemer med programmeringen. Det blev

efterfølgende til en plan C, da det oprindelige koncept var for avanceret og tidskrævende.

ANVENDT TEORI OG METODE (BEGRUNDELSE FOR VALG AF TEORIER & METODER).

Jeg har anvendt følgende teorier og metoder til at udvikle og underbygge mit koncept.

OPLEVELSESØKONOMI

Fitness kan placeres i toppen af Maslows behovspyramide med selvrealisering. Oplevelsesøkonomi er en

teori som fokuserer på selvrealisering:

Fitnessaktiviteter har et konkret output, fx at komme i bedre form, tabe et par kilo eller at blive fysisk

stærkere7. Men det at gå til fitness er mere end at træne vha. maskiner i et center(commodity). Mange

betaler for at opnå en bestemt oplevelse/følelse/forestilling. Hos FW har medlemmerne en forestilling om

noget de gerne vil opnå med dem selv8. Der følger oftest en følelse af velvære og en oplevelse af at udrette

noget godt for sig selv. For nogle handler det sågar om at brande sig selv. For dem kommer motionen i

anden række, og det at signalere at man træner fitness er vigtigst9.

Medlemmerne kan nå langt op af transformationsstigen(customization). FW skal skabe en mental

stemning/iscenesættelse og vække et ”noget” i medlemmerne vha. merværdi. De skal overbevise dem om

at deres produkt(i en holistisk enhed med organisationen FW) gør en forskel og at det udgør en del af deres

identitet(”change me”) 10.

6 Bilag 4: Tidsplan

7 Kierkegaard, Kasper Lund(2007): ”Overblik over den danske fitness-sektor – en undersøgelse af danske fitnesscentre”

8 Men i sidste ende er det medlemmerne, som får følelsen og vælger at signalere noget bestemt!

9 Funch, Anne(2009):” Her er de danske fitness-typer”

10 Pine, Joseph B. & Gilmore, James H.(1999): “The experience economy: work is theatre & every business a stage”

(kap. 9)

Page 6: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

6

DE FIRE E’ER

Et fitnessmedlems oplevelse findes i alle fire områder. Det kommer an på det enkelte medlems intentioner

og forestilling omkring medlemskabet:

Underholdning i forhold til at gøre det sjovt at træne

Læring i forhold til at blive klogere på sin egen krop og tage vare på sig selv

Æstetik i forhold til ens mentale billede af sig selv og sine omgivelser

Eskapisme i forhold til at drømme/forsøge at opnå noget – fx en anden identitet, men også blot at

komme væk fra en stresset hverdag.

Medlemmet køber en aktiv deltagelse i en oplevelse, som hun bliver en del af(immerse), når hun træner

i centeret.

DREAM SOCIETY

Markedsføring, produkt og branding udgør en holistisk enhed i denne teori, og ESP og storytelling

dominerer i kommunikationen. Hvis der er et fysisk produkt, så kommer det i anden række. Dette er vigtigt

at vide i forhold hvordan mobilapplikationen skal markedsføres, men også i forhold til udformningen og

indholdet af applikationen.

Jeg brugte teorien, da FW sælger deres produkt vha. deres ESP, ”Sund fornuft” – og opfordringen til at

forkæle dig selv med god samvittighed11.

Fitness har stort fokus på kategorien omsorg(wellness), identitet og tryghed12. De opfordrer

medlemmerne til at tage del i at skabe produkternes indhold og leve sig ind i den fortalte historie(”sund

fornuft)13.

MOBILKONTEKST MED STORT K

Applikationen skal skabe en merværdi i den forstand, at den gør opstart af et træningsprogram lettere og

giver en følelse af at have en personlig træner.

11 Dette konkluderer jeg ud fra ordvalget på deres website

12 Jensen, Rolf(1999): ”Dream Society”. Jyllandspostens erhvervsbøger(udleveret materiale er uden sidetal)

13 Eksempel: http://www.fitnessworld.dk/nyheder/aarets-tour-de-france-loeber-af-stablen-fra-d-30-maj-7-august

Page 7: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

7

MOBILKONTEKST MED LILLE K

Applikationens brugerflade og struktur skal tage hensyn til at applikationen vil blive anvendt under

træning(”on the fly”): Hurtig og simpel adgang til programmet og opdateringsfunktionen.

DELKONKLUSION

FW’s ESP ”sund fornuft” og de følelser/forestillinger som vækkes ved at dyrke fitness skal overføres til

mobilapplikationen, da de virker motiverende for medlemmerne. En del af arbejdet er allerede gjort ud fra

FW’s generelle kommunikation, så applikationen kan fokusere på den merværdi, som søges; netop at hvis

de kommer godt i gang med træningen og føler en positiv udvikling kan en fuld transformation finde sted.

Og det skal gøres ved skabe en aktiv oplevelse og stemning, hvor medlemmet føler at hun selv udretter

noget, mens hun følges af en dedikeret instruktør, som motiverer og hjælper til. Udformningen skal

desuden tage hensyn til ”on the fly”-konteksten.

PRODUKT DOKUMENTATION

I dette kapitel præsenterer jeg konceptet og udformningen. Dernæst opstiller jeg brugerprofil og –scenario,

dokumenterer og begrunder mit designvalg.

KONCEPTBESKRIVELSE

”Dit træningsprogram hos FitnessWorld” hedder mobilapplikationen. Formålet med applikationen er at

FW’s medlemmer skal have mulighed for adgang til et instrueret træningsprogram. Applikationen skal

hjælpe medlemmerne med at komme godt fra start, træne optimalt og motivere dem til at fortsætte

træningen – og give dem mulighed for at føre en online dialog med en instruktør.

Den tilknyttede instruktør følger udviklingen og kommer med gode råd og motiverende kommentarer,

som vises, når medlemmet logger ind. Herved kan man stadigvæk opnå et vist niveau af personlig

vejledning, uden at man skal bestille et antal dyre timer i selskab med en personlig træner.

Medlemmerne undgår at skulle medbringe programmet på papir. Det kan have en demotiverende

effekt, hvis man glemmer programmet hjemme. Man undgår også en negativ signalværdi af at være

nybegynder.

Ekstra funktioner(udvidelse af grundkonceptet):

Dato og sidste trænet muskelgruppe vises14.

Succesfuldt program – del med andre

14

Det er vigtigt at fordele træningen af de forskellige muskelgrupper ud over hele ugen. Derved kan kroppen nå at restituere, og træningen bliver optimal(taler ud fra egen erfaring som styrkeløfter)

Page 8: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

8

Kontaktform, hvor medlem kan sende spørgsmål direkte til instruktøren.

UDFORMNING

Mobilapplikationer stiller visse krav til udformningen af brugerfladen(Mobilkontekst med lille K); Det skal

gøres så simpelt som muligt. Man skal kunne få adgang til programmet hurtigt, og det skal være let og

logisk at navigere rundt. Knapperne skal have en ”trykvenlig” størrelse, og indholdet til de enkelte øvelser

skal helst ikke fylde så meget at man skal scrolle alt for meget.

Da jeg har været nødt til at lave separate sider, er det ikke muligt at anvende de indbyggede transitions i

jQm, som fremmer et behageligt flow mellem siderne. Dog loades siderne ganske hurtigt, og det har den

største betydning.

Alt hvad der kan klikkes på af knapper m.m. har den limegrønne farve, hvilket man hurtigt får indlært,

når man bruger den. Det sekundære indhold(programmet er det primære) er placeret i ”collapsible” div-

tags. Det gør siderne mere overskuelige og der skal undgås for meget ”scroll”.

BESKRIVELSE AF BRUGSSITUATION

Jeg har lavet et spørgeskema15 for at få et indtryk af om hvorvidt folk vil anvende applikationen under

træning, og hvad der måske kunne motivere dem til at bruge den. 34 personer har deltaget i undersøgelsen

via Facebook(Alder 21-46 år). Resultatet viser at folk ikke er afvisende overfor at anvende mobil under

træningen. Hvis der tilbydes motiverende ekstra goder vil mange anvende applikationen.

5.000-10.000 medlemmer har downloadet den eksisterende FW applikation, hvilket også peger på

interesse.16

BRUGERPROFIL

Applikationen er rettet mod folk som bruger fitness eller som er interesseret i at komme i gang. De skal

være villige til at anvende mobiltelefonen som et hjælpeværktøj under træningen og have lidt eller nogen

erfaring med at anvende en smartphone.

Nogle værdier og forestillinger, som disse mennesker kan have tilfælles; De er interesseret i at træne

deres krop. Der er individuelle faktorer som bestemmer hvorfor de ønsker at ville dyrke motion – fx

vægttab, dårlig kondition, vedligeholdelse, udseende, selvtillid, det sociale samvær17.

15

Bilag 5: Spørgeskema 16 https://market.android.com/details?id=com.shapehq.fitnessworld&feature=search_result 17

Funch, Anne(2009):” Her er de danske fitness-typer”

Page 9: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

9

BRUGERSCENARIO

Henriette er 26 år og har en søn på 4 måneder18. Hun har ikke så meget tid og vil ikke bindes af faste tider

med en instruktør. Hun får derfor tilrettelagt et træningsprogram hos FW. De snakker om hendes

forventninger og mål og hun prøver de udvalgte øvelser. Træningsprogrammet gemmes i en database med

hendes brugernavn, adgangskode og instruktørs kommentarer.

Allerede ved første login er der en hilsen og kommentar til Henriette fra instruktøren. Han minder

hende om at hun skal sørge for at spise masser af protein og drikker masser af vand. Derudover har han et

godt råd til hvordan hun kan træne lidt derhjemme, de dage hvor hendes søn ikke kan undvære hende.

Efter at have startet på programmet med de indstillinger, indser Henriette at hun hurtigt bliver bedre.

Hun ændrer de forskellige indstillinger på maskinen og gemmer dem i mobilapplikationen.

DOKUMENTATION & ARGUMENTATION FOR DINE DESIGNVALG

Jeg har defineret identitetstrækkene hos FW og anvendt dem i et format som passer til en applikation.

Ved at genbruge deres design overfører jeg den forventning og tillid som medlemmerne har til FW som

helhed.

JQm har en fast opsætning(API og CSS), som binder designet i nogen grad men uden at gå på kompromis

med FW’s identitet. Applikationen anvender jQm’s ikoner, da de er sigende og simple (semiotiske på andet

niveau, konnotation19).

Figur 2: Mobil design

18 Bilag 6: Brugerprofileksempler 19

Chandler, Daniel: ”Semiotics for Beginners”

Page 10: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

10

Jeg har bevidst valgt indbydende billeder af maskinerne og instruktørerne, som giver et behageligt og

professionelt indtryk. Billeder og grafik anvendes varsomt på en mobilapplikation20. Designet får mere liv

med farven limegrøn. Skillelinjer mellem indhold og knapper gør det let at orientere sig på siderne21.

TEKNISK DOKUMENTATION

KRAVSPECIFIKATIONER

Kravet til en webapplikation var jQm, som jeg har anvendt sammen med PHP. Det har krævet en del

tilpasninger, og jeg har måttet gå på kompromis med PHP og oprette enkeltsider(id-generede)22.

BESKRIVELSE AF INFORMATIONSARKITEKTUR

I nedenstående kapitel vil jeg ud fra en teknisk synsvinkel fortælle om applikationens opbygning.

E/R-DIAGRAM

Løsningen bygger på 1:n forbindelse mellem tre entiteter(medlem, program og øvelse):

Figur 4 – Fysisk E/R diagram

Ét medlem har adgang til et eller flere programmer(som ingen andre medlemmer har adgang til). Ét

program består af en eller flere øvelser. En forbindelse mellem tabellerne skabes vha. en fremmednøgle.

Efter at have lavet det fysiske produkt færdigt, har jeg måtte sande at det ikke er den optimale løsning.

Som det er nu, så kan en øvelse ikke indgå i flere forskellige programmer – og det skal den kunne for at

imødekomme virkeligheden hos FW. Fejlen er et resultat af en for ambitiøs n:m-løsning, som jeg lagde ud

med, inden jeg valgte denne løsning. Desværre erkendte jeg først efter nogle dage i den tekniske del af

udviklingsprocessen at jeg måtte lave en ny løsning. Det har betydet færre dage til udviklingen og mundet

ud i en betydelig fejl.

20

Pedersen, Viktor(2011):”Design trends på mobile web apps”. 21

Ved mobilapplikationer kan det være lidt svært at anvende nærhedsprincpippets modsætning, så man kan adskille ting(netop pga. den manglende plads).

22 Hvis jeg kunne have valgt selv, så ville jeg have lavet en løsning med adaptive design ud fra skærmopløsningen

22. Det

er muligt at der findes en bedre løsning med jQm og PHP, men jeg måtte træffe et valg pga. deadline. Se evt. http://webdesignerwall.com/tutorials/adaptive-mobile-design-with-css3-media-queries

medlem program øvelse

Page 11: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

11

Dog er fejlen ikke værre, end at man kan rette den ved at lave en n:m forbindelse mellem program og

øvelse. Forbindelsen mellem dem skabes vha. en mellemtabel(svag entitet) med de to tabellers primære

nøgler.

HYBRID MAP

Jeg har sammenlagt sitemap og wireframe, da der ikke skal overdrages noget fra en person til anden i

udviklingen. Det giver mig et bedre overblik.

Figur 1: Hybrid map (bilag nr…)

Det skal være muligt at kunne klikke sig hurtigt frem og tilbage til det forrige side eller til

programoversigten.

Der er tilføjet en ekstra side, som en midlertidig brugbar løsning for at undgå en fejlmeddelelse.

Oversigt.php ”erstatter” velkomst.php, når man klikker sig væk fra velkomst.php, så medlemmet kan

komme tilbage til programoversigten. Velkomst.php overfører brugernavn og adgangskode fra login-siden.

Så de to sider er ens, bortset fra at der ikke overføres data fra index.php til oversigt.php.

Page 12: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

12

BRUGERTEST

Det samlede resultat af tænk-højt-testen23 fik mig til at ændre udformningen af øvelsesknapperne, da de

oprindeligt var svære at aktivere. Jeg har desuden fjernet ikonet fra opdateringsknappen, da det virkede

forvirrende.

Nogle gange ”hopper” header ned under teksten på siden, hvilket løses ved at trykke F5. Det er et problem

der ligger i jQm’s CSS, hvilket jeg umiddelbart ikke har haft tid til at løse.

UDVALGTE EKSEMPLER PÅ DYNAMISK KILDEKODE

Jeg har fjernet jQm koden fra eksemplerne, da de fylder meget og blot er HTML-koder som bliver vist vha.

”echo”.

LOGIN-FUNKTION OG ET VARIABELT LINK

<?PHP

$brugernavn = $_REQUEST['brugernavn'];

$adgangskode = $_REQUEST['adgangskode'];

include("database.php");

$sql = "SELECT * FROM medlem

WHERE brugernavn = '$brugernavn' AND adgangskode = '$adgangskode'";

$resultat = mysql_query($sql);

$post = mysql_fetch_assoc($resultat);

$check_post = mysql_num_rows($resultat);

if ($check_post == 1) {

$medlem = $post['medlem_id'];

$_SESSION['medlem'] = $medlem;

echo "<h2>"."Velkommen $brugernavn"."</h2>"

$sql = "SELECT program_id, program_navn FROM program

WHERE ".$medlem." = program.medlem_id";

$resultat = mysql_query($sql);

$antal_raekker = mysql_num_rows($resultat);

if ($antal_raekker == 0){

echo "Du har endnu ikke fået oprettet et program! Kontakt din

instruktør";

}

else {

23 Bilag 7: Tænk-højt-testen

Page 13: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

13

while ($raekke = mysql_fetch_assoc($resultat)){

echo "<a

href='vis_program.php?id=".$raekke["program_id"]."'data-

role='button' data-icon='arrow-r' data-theme='z'

rel='external'>".$raekke["program_navn"]."</a>";

}

}

}

else {

echo "Du har tastet dit brugernavn eller adgangskode forkert!";

echo "<a href='index.php' data-role='button' data-theme='z' rel='external'>Prøv

igen</a></br>";

}

?>

FORKLARING:

1. Det indtastede brugernavn og adgangskode overføres fra formularen på index.php til denne side

vha. funktionen $_REQUEST.

2. En forbindelse til databasen oprettes.

3. For at kunne sammenligne disse data med data i databasen opsætter jeg en SQL-streng, hvor jeg

vælger(SELECT) ”brugernavn” og ”adgangskode” fra tabellen ”medlem”.

4. Derefter udfører jeg SQL-kommandoen ”mysql_query” for at danne et resultatsæt(en tabel med de

valgte data).

5. Med ”mysql_num_rows” tæller jeg antal rækker, som forekommer(hvis der er ingen, fortælles

dette ved en echo-sætning).

6. Hvis resultatsæt-tabellen rummer data, så hentes en række ad gangen(tupel) med

”mysql_fetch_assoc”. Variablen som jeg får ud af denne kommando indsættes i en echo, hvor jeg

skriver et tekstlink ud fra en variabel med program_id. Antal forekomster = antal links der bliver

vist. (OBS! Jeg gemmer medlem_id i en $_session for at kunne anvende den på andre sider)

7. HVIS ikke brugernavn og adgangskode findes i databasen, fortælles dette til medlemmet ved en

echo-sætning, og det er muligt at klikke tilbage til index.php.

Page 14: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

14

OPDATERINGSFUNKTION

include("database.php");

$indstilling = $_POST['indstilling'];

$kg = $_POST['kg'];

$saet = $_POST['saet'];

$repetition = $_POST['repetition'];

$sql = "update oevelse set indstilling = '$indstilling', kg = '$kg', saet = '$saet',

repetition = '$repetition' where oevelse_id = '$oevelse_id'";

$resultat = mysql_query ($sql);

if (!$resultat){

echo "<h2>Øvelsen kunne ikke opdateres!</h2></div>";

}

else {

echo "<h2>Øvelsen er nu opdateret!</h2></div>";

}

FORKLARING:

1. Der forbindes til databasen

2. De nye data, som blev indtastet i formularen på opdater_oevelse_formular.php hentes vha.

funktionen $_POST.

3. Dernæst opsætter jeg en update sql-streng, hvor jeg fortæller hvilke attributters værdier der

skal ændres i tabellen ”oevelse”.

4. SQL-kommandoen udføres

5. Hvis databasen opdateres, fortælles dette med en echo. Hvis ikke det lykkes, så fortælles dette

med en echo.

KONKLUSION

Den færdige mobilapplikation sørger for at FW’s medlemmer kan få adgang til et tilrettelagt program, som

løbende kan revideres af medlemmerne selv. Dette sker under en instruktørs online vejledning. Det giver

svar om en mobilapplikation er en mulig løsning, som giver medlemmerne en form for personlig træning

uden at en personlig træner behøver at være til stede fysisk ved hver træning. Research indikerer at der vil

være et marked for den. Ved at tilbyde brugbare goder og fokusere på den eksisterende ESP motiveres

medlemmerne til at bruge den. Den fysiske mobilapplikation er svar på de sidste spørgsmål omkring

indhold og udformning.

Page 15: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

15

BILAG

Bilagene vises ud fra den rækkefølge de bliver nævnt i rapporten.

BILAG 1: FITNESSWORLD – KORT OG GODT

Applikationen er lavet til FW, da de forsøger at gøre det let at træne og skabe merværdi gennem dynamiske og

fleksible tiltag24

.

Deres vision: ” …, at give så mange som muligt mulighed for at få et sundere liv… til en pris alle kan betale”25

.

Medlem hos FW bl.a.;

Får adgang til sin træningsprofil på deres site(hvor man kan bestille plads på de udbudte træningshold)

Kan booke plads til træning via en touchscreen(på stedet) eller en mobilapplikation

Træner i alle afdelinger med det samme medlemskab

Kan sætte sit medlemskab på pause

Det eneste som de ikke tilbyder, er en personlig træner som følger dem ved hver træning.

BILAG 2: DE SEKS TÆNKEHATTE

Hvid hat(fakta)

FitnessWorld har lavet en mobilapplikation til booking af træningshold, som 5000-10000 har installeret. Ud af 47

anmeldelser har 35 givet et positivt svar og anvender applikationen(flere af de negative kommentatorer anvender

applikationen – deres bemærkninger til applikationen påpeger mangler eller lignende). Jeg har talt med flere i

FitnessWorld(Lygten, Kbh NV) og set deres brug af mobil under træning, hvilket indikerer at de gerne tager mobilen

med til træning(sammenlign spørgeskema).

Rød hat(følelser og intuition)

Jeg står selv i den situation at jeg selv er irriteret over at skulle medbringe et stykke papir(tilrettelagt

træningsprogram) til træning. Jeg mener at konceptet vil kunne afhjælpe et behov og yde en ekstra service. Jeg er dog

lidt usikker på hvorvidt og hvor mange der vil anvende applikationen under træning. Det skal min research derfor

underbygge.

Sort hat(det vanskelige og bekymrende)

Udfordringen ligger i det dynamiske og få PHP og database implementeret i løsningen, samtidigt med at designet også

skal kunne overføres til de generede sider(CSS). Og derudover som tidligere nævnt om folk er villige til at anvende app

mens de træner.

24

De fokuserer på at gøre det let at komme i gang med træning, bevare motivationen og få en god oplevelse. http://www.fitnessworld.dk/traen-hos-fitness-world 25

http://www.fitnessworld.dk/om-fitnessworld

Page 16: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

16

Gul hat(Det vellykkede og optimistiske)

Jeg ved at mange allerede anvender FitnessWorlds eksisterende app, og at konceptet som grundidé ikke er alt for

kompliceret og derfor en realistisk mulighed.

Grøn hat(kreative ideer)

Tegnet på mindmap

Blå hat(opsamling og konklusion)

Efter at have vurderet brugernes velvillighed til at anvende applikationen(research) og kigget på foreløbig skitse af

konceptet(og fremlagt idéen for mine medstuderende) er jeg kommet frem til den konklusion at jeg mener at det er et

koncept med muligheder. Jeg har valgt at fortsætte med konceptet.

BILAG 3: DATABASEORDBOG

Medlem Datatype Grænse Default NULL Autoforøgelse(increment)

Medlem_id Int unsigned Nej Ja

Brugernavn VarChar 12 Nej

Adgangskode

Smallint

unsigned Nej

Normalisering:

1. NF: Alle attributter er afhængige af primærnøglen, ”medlemsnr” – og der er ingen repeterende felter!

2. NF: Der er ingen sammensat primærnøgle, så attributterne skal ikke tjekkes for om de er lige afhængige af de

attributter som udgør primærnøglen.

3. NF: Ingen af attributterne er mere afhængige af en anden attribut end primærnøglen

Program Datatype Grænse Default NULL Autoforøgelse(increment)

Program_id Int unsigned Nej Ja

Program_navn VarChar 25 Nej

instr_billede VarChar 50 Nej

kommentar Text Nej

Medlem_id Int unsigned Nej

(Medlem_id er en fremmednøgle)

Normalisering:

1. NF: Alle attributter er afhængige af primærnøglen, ”medlemsnr” – og der er ingen repeterende felter!

2. NF: Der er ingen sammensat primærnøgle, så attributterne skal ikke tjekkes for om de er lige afhængige af de

Page 17: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

17

attributter som udgør primærnøglen.

3. NF: Ingen af attributterne er mere afhængige af en anden attribut end primærnøglen

Oevelse Datatype Grænse Default NULL Autoforøgelse(increment)

Oevelse_id Int unsigned Nej Ja

Oevelse_navn VarChar 50 Nej

Dato DateTime Nej

Indstilling

Smallint

unsigned Nej

Kg

Smallint

unsigned Nej

Saet

Smallint

unsigned Nej

Repetition

Smallint

unsigned Nej

Billede VarChar 50 Nej

Instruktion Text Nej

Program_id Int unsigned Nej

(Program_id er en fremmednøgle)

Normalisering:

1. NF: Alle attributter er afhængige af primærnøglen, ”medlemsnr” – og der er ingen repeterende felter!

2. NF: Der er ingen sammensat primærnøgle, så attributterne skal ikke tjekkes for om de er lige afhængige af de

attributter som udgør primærnøglen.

3. NF: Ingen af attributterne er mere afhængige af en anden attribut end primærnøglen

BILAG 4: TIDSPLAN

Mandag(23.) Tirsdag Onsdag Torsdag Fredag Lørdag Søndag

- Læse opgave

- Brainstorm og

mindmap

-Formulere

spørgeskema

- Skitsere

koncept

- E/R diagram

- Skrive

problemform.

- Wireframe

- Opsætning af

jQuery Mobile

- Rapportskrivn.

- Normalisering

- Oprette

tabeller i db

- Evt starte på

login

- Fortsætte

med PHP

Plan B: CSS og

design

- Fortsætte

med PHP

Plan B: CSS og

design

Få n:m-løsning

til at fungere

eller finde en

anden løsning

Mandag(30.) Tirsdag Onsdag Torsdag Fredag Lørdag Søndag

- Lave en 1:n

løsning og

tilpasse joins

- Opdaterings-

modul

- Tilbageknap

- Færdiggøre

PHP

Rapportskrivn.

- PHP og MySQL

skal være

færdig

- Købe cd’er,

spiralrygge

m.m.

- Skrive rapport

- Litteraturliste

- Fodnoter

- De sidste

rettelser

- Forside

Page 18: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

18

dertil. - Rapportskrivn. - Tjekke bilag - Indholdsforteg - Printe rapport

Brænde CD

BILAG 5: SPØRGESKEMA

Det er muligt endnu at se spørgeskemaet online: http://www.surveymonkey.com/s/7DFNR5N. Jeg har dog ikke

mulighed for at trække analysen ned, da det koster penge.

Spørgsmål til spørgeskema

1. Din alder

2. Dit køn(M/K)

3. Er du medlem af et fitnesscenter(Ja/Jej)

4. Ville du anvende din mobil i et træningscenter?(adgang til træningsprogram som viser dig indstillinger på

programmets anvendte maskiner, antal kilo m.m. - som du løbende kan opdatere)

(Ja/Nej/Måske/Kommentar)

5. Ville det gøre en forskel, hvis du ville blive tilbudt følgende:

[ ]Ja tak til frit internet(mobilapplikation kræver internetadgang)

[ ]Ja tak til gratis neck strap(halsrem til mobil)

[ ]Ja tak til gratis mobilholder til arm(hvis du bestiller tilrettelagt program)

[ ]Nej, det gør ingen forskel

6. Ville du hellere medbringe programmet på papir?(Ja/Nej)

7. Vil du lytte til musik, se videoer, blive klogere på træning via din mobil, mens du varmer op?(ved fx. cykling,

hvor der vil være placeret en mobilholder)(Ja/Nej/Måske/Andet)

8. Kunne du være interesseret i:

[ ] at dele dine programmer med andre medlemmer

[ ]at hente færdige programmer

[ ] Ingen af ovenstående

9. Har du eventuelle kommentarer, så skriv dem her [ ]

BILAG 6: EKSEMPLER PÅ BRUGERPROFILER

Jonathan er 33 år og er single. Han er far til to børn på 6 og 9 år, som han har hver anden weekend og i ferier. Han kan

godt lide at mødes med vennerne i sine friweekender, og der bliver ofte drukket en del alkohol og spist god mad. For

at holde vægten og passe på sit udseende, dyrker han styrketræning tre gange om ugen. Han får plejet sit behov i

centeretfor at være sammen med andre mennesker, som har samme interesse som ham.

Henriette er 26 år og er søn til Jonathan på 4 måneder. Hun har taget på i vægt under graviditeten og vil gerne tabe

sig. Hun har aldrig rigtig dyrket fitness før, og hun er derfor lidt uvant ved omgivelserne. Hun overvejer at starte

sammen med en veninde fra mødregruppen.

Page 19: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

19

BILAG 7: TÆNK-HØJT-TESTEN

Testpersonerne har prøvet applikationen på deres egen mobiltelefon. De er kort blevet introduceret til formålet med

applikationen. Dernæst har de fået login, og er selv gået på opdagelse på de forskellige sider.

Allan Roneklint(Har en HTC Desire)

(31 år, løber på inliners, træner til halv marathon og er derudover meget aktiv med motion i sin fritid)

”Det første jeg undrede mig over var at der ikke var en tilbageknap i toppen, men det var der jo(den var bare lille)”.

”God ting at der er en tilbageknap i bunden på nogle af siderne!”

”Det irriterer mig at øvelsesnavnene er på engelsk, når applikationen er på dansk! Men det er jo ikke noget der kan

ændres, som sådan, vel?”

”Hmm, er det meningen at man skal kunne klikke sig videre på øvelsesnavnene? Der sker ikke rigtig noget? Jo nu skete

der noget… Man skal godt nok ramme meget præcis på teksten for at aktivere linket, hva?”

”Headeren har sit eget liv. Den hopper op og ned, som det passer den?”

”Alt i alt en fed applikation – god idé!”

Helle Hansen(har en HTC Desire)

(37 år, spiller håndbold og fodbold og træner en del konditionstræning)

”Er det ikke meningen at man skal kunne klikke på øvelserne?”

”Hvorfor kan jeg ikke ændre i øvelsens indstilling? Nå, jeg skal trykke ’opdater øvelse’ først! Det er altså ikke helt

logisk? Måske du skulle droppe det der flueben som ikon på knappen – det forvirrer bare!”

”Det ser ellers godt ud! Det eneste jeg kunne tænke mig, var at man kunne rette direkte i øvelsen på øvelsessiden –

men det er garanteret ikke lige sådan at lave, eller?”

Johnny Drejer(HTC Desire)

(46 år og erfaren bruger af mobilapplikationer)

OBS! Øvelseslinksene er nu lavet om til knapper i stedet for listed links

"Der virker til at alle knapper virker! Jeg kan ikke få applikationen til at crashe”

”Man kan ikke opdatere med decimaltal?”

”Efter tryk på opdatering kunne det være rart at tjekke det man har opdateret!”

”God, nem og overskuelig applikation!”

Page 20: INDHOLDSFORTEGNELSE · Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app 3 INDLEDNING I mange år har vi hørt fra alle sider

Bettina Lehmann - Eksamensopgave, 3. semester for valgfaget Mobile applikationer: Realiser en sundheds-app

20

LITTERATURLISTE

Chandler, Daniel: ”Semiotics for Beginners”. I: Denotation, Connotation and Myth.

http://www.aber.ac.uk/media/Documents/S4B/sem06.html. Download 26/05/2011

Funch, Anne(2009): ” Her er de danske fitness-typer”. I: Træning og sundhed.

http://www.fri.dk/velvaere/her-er-de-danske-fitness-typer. Download 28/05/2011.

Jensen, Rolf(1999): ”Dream Society”. Jyllandspostens erhvervsbøger

Kierkegaard, Kasper Lund(2007): ”Overblik over den danske fitness-sektor – en undersøgelse af danske

fitnesscentre”. I: Forskning og analyser.

http://www.idan.dk/vidensbank/forskningoganalyser/stamkort.aspx?publikationID=98f5d02b-88f9-47eb-

a770-999b00a37f0f. Download 29/05/2011.

Pedersen, Viktor(2011):”Design trends på mobile web apps”. I: Adapt Blog.

http://www.adapt.dk/blog/designtrendspaamobilewebapps. Download 26/05/2011

Pine, Joseph B. & Gilmore, James H.(1999): “The experience economy: work is theatre & every business a

stage”. Harvard Business Press

Schultz, Karina(2011): “Danskerne elsker personlig træning”. I: Træning og sundhed.

http://www.fri.dk/velvaere/danskerne-elsker-personlig-traening. Download 28/05/2011.