Kapitel 1. Indledning

1.1 Hvad er informatik

Informatik er et ret nyt fag. De første elver startede i august 2017, og faget er obligatorisk på HHX. Det er planen, at andre gymnasielle uddannelser også skal have det som obligatorisk fag.

Baggrunden er, at vi efterhånden er storforbrugere af IT. Vi bruger IT, men IT bruger også os. Vi er nødt til at være klogere på IT i bred forstand for at forstå meget af det, der foregår omkring os.

Nogle af de emner, vi skal igennem, er;

• Hvordan er en app opbygget
• Hvordan laver man brugervenligt design
• Hvordan påvirker informationsteknolOgien os, og hvordan påvirker vi den
• Hvad er data, og hvad kan det bruges til
• Hvad er en database
• Hvordan laver man hjemmesider

Link til toppen af siden.

Kapitel 2. Det grafiske puslespil

Der er mange elementer, som du skal få til at spille sammen, når du skal lave et layout eller en prototype. Kend reglerne og respekter reglerne, men være heller ikke bange for at bryde dem.

Tænk på dit layout som en god film. En opskrift på en god film kan være:

Den gode film har …	Det gode layout har derfor …
– En eller få hovedroller	– Overskriften og/eller få elementer overstråler alt andet
– Birollerne i et film skal være synlige. Mere synlige end statisterne, men ikke så dominerende som hovedrollen	– Under-overskrifter eller ikke-så-vigtige billeder/grafik skal være mindre end hovedoverskriften, men ikke så synlige som brødteksten

• En god film har en eller 2 hovedpersoner. Derfor: Overskriften og/eller et dominerende billede overstråler alt andet
• Birollerne i et film skal være synlige. Mere synlige end statisterne, men ikke så dominerende som hovedrollen. Derfor: Under-overskrifter eller ikke-så-vigtige billeder/grafik skal være mindre end hovedoverskriften, men ikke så synlige som brødteksten
• Statisterne giver filmen fylde, men de er anonyme. Derfor: Brødtekst er vigtig, men må ikke overstråle overskrifterne
• I en god film er der en klar handling. Derfor: Hjælp din læser. Skru op for billeder og grafik, ned for unødvendig tekst
• En god film har orden og hiraki. Vis brugeren, hvad “hovedrolen” er, så brugeren ikke er i tvivl. Dvs. sørg for, at det vigtige træder frem. Baggrunden skal fremhæve forgrunden

I de næste 3 afsnit gennemgår jeg kort forskellige elementer inden for grafik: Typografier, farver og gestaltlove.

Link til toppen af siden.

2.1 Typografier

Typografier er det samme som skrifttyper. Man kan dele alle skrifttyper ind i 2 slags skrift: Serif og sans-serif. Serif betyder “fod”. Nogle typer skrift har en lille fod på bogstaverne, andre har det ikke.

Hvis vi sætter en lille fod på bogstaverne, så danner bogstaverne en kunstig linje. Den linje hjælper os især, hvis vi laver lange tekster. Til korte tekster er det bedre med skrifttyper uden fødder. På nettet finder vi mest sans-serif skrifttyper.

Skrifttyper kan understrege vores budskab. Den her skrifttype er f.eks. meget brugt i det vilde vest i USA.

Hos www.dafont.com kan du finde en guldgrube af sjove skrifttyper, grænsende til det vanvittige. https://www.youtube.com/embed/_ukXb-fAfSI?feature=oembed

Hvis emnet interesserer dig, så kik på artiklen her, som har undersøgt brugen af typografier på hjemmesider generelt: https://www.smashingmagazine.com/2009/08/typographic-design-survey-best-practices-from-the-best-blogs/

Link til toppen af siden.

2.2 Farvelære

Vi bruger farver mere end vi tror. Farver kan hjælpe os med at understrege budskabet. Kik f.eks. på http://play.barbie.com/da-dk, hjemmeside for barbiedukken. Et orgie i bløde pastelfarver, men siden henvender sig også til små piger, ikke til voksne. Ikke overraskende er hjemmesiden for Rammstein, tysk heavyrock-gruppe, noget mere “maskulin” i sit udtryk. https://www.rammstein.de/de/. Politiet bruger kølige, alvorlige farver for at understrege autoritet, mens en klovn i cirkus er et orgie af varme og stærke farver.

Farvelære handler om at forstå farver. Start med Goethes farvecirkel. Ud fra 3 grundfarver: Rød, blå og gul dannede han alle mulige andre farver.

Farvecirklen fortæller os en masse. 2 farver på hver sin side af cirklen vil fremhæve hinanden. En orange farve fungerer godt med blå baggrund og omvendt. Dette kalder man for “kontrastfarver”. Der er dog en vigtig undtagelse: Brug aldrig kontrastfarverne rød-grøn sammen, for farveblinde kan ikke se forskel.

BEGREB	FORKLARING
Kontrastfarver	Farver, der står overfor hinanden i farvecirklen. Kontrastfarver fremhæver hinanden
Varme og kolde farver	Varme farver træder frem og er gode forgrundsfarver. Kolde træder tilbage og er gode baggrundsfarver. Varme og kolde farver står overfor hinanden i farvecirklen. Verdens bedste baggrundsfarve er … grå. Kik på grå beton, al grafitti træder tydeligt frem.
Farvefamilier	F.eks. pastelfarver, jordfarver, pangfarver. Man kan skabe en god sammenhæng ved at bruge farver fra samme farvefamilie.

Farveudtryk

I de næste videoer kan du lære om både teoretisk farvelære og om farvelære i praksis.

Link til toppen af siden.

2.3 Gestaltlovene

Når vi ser på ting, har vi nogle ubevidste måder at opfatte (eller “perceptionere) tingene på. Vi ser “skikkelser” eller på tysk “gestalter”, “hvad der er stillet i orden. Hjernen forsøger at skabe sammenhænge i, hvad den ser. Disse måder er formuleret i gestaltlovene.

Faktaboks: Hvad er en gestalt? En gestalt er tysk for “skikkelse”. Et eksempel: Vrede Viggo går i terapi, fordi han er rasende på sin far. Tereapeuten beder Viggo forestille sig, at hans far sidder i en stol overfor ham, og så får Viggo ellers lov til at fortælle hans far et par borgerlige ord. Faderen er selvfølgelig ikke til stede fysisk. Den form for terapi kaldes “gestaltterapi”

Gestaltlovene har enorm betydning, når man laver grafisk design. Hvis man f.eks. (som på denne hjemmeside) lukker navigationen inde i en ramme, anbringer dem tæt ved hinanden og giver dem samme typografi, så opfatter hjernen alle menupunkter som hørende sammen. Det er pga. loven om lukkethed, lighed, nærhed og måske loven om symmetri. Kik selv efter.

Her er en oversigt over de 5 måske 6 gestaltlove. De 3 første, dvs. loven om nærhed (og afstand), loven om lighed og loven om lukkethed er klart de vigtigste og mest brugte.

Link til toppen af siden.

1. gestaltlov. Loven om nærhed (afstand)

“Objekter anbragt tæt ved hinanden opfattes som hørende sammen”.

Man kan udlede af loven, at ting, der er anbragt fjernt fra hinanden, opfatter vi omvendt ikke som hørende sammen.

De blå og røde cirkler opfatter vi som hørende sammen i 3 grupper. Dels står de tæt, dels er der afstand mellem de 3 grupper

Link til toppen af siden.

2. gestaltlov. Loven om lighed

“Objekter der ligner hinanden, opfattes som hørende sammen”.

Vi opfatter de røde objekter som hørende sammen og de blå som hørende sammen. Både pga. farven, men også fordi de røde har firkantede hjørner mens de blå har runde hjørner.

Link til toppen af siden.

3. gestaltlov. Loven om lukkethed

“Objekter, som er lukket inde, opfattes som hørende sammen”.

De røde cirkler til højre er lukket inde af en blå baggrund, så dem opfatter vi som hørende sammen

Link til toppen af siden.

4. gestaltlov. Loven om forbundethed

“Objekter, der er forbundet, opfattes som hørende sammen”.

De røde cirkler, som er forbundne, opfatter vi som hørende sammen. To mennesker, der holder hinanden i hånden, vil vi også opfatte som hørende sammen.

Link til toppen af siden.

5. gestaltlov. Loven om figur og baggrund

“Den mindste, afgrænsede figur på arealet vil først blive opfattet som figuren”.

Hvad ser du først? Vasen eller de 2 ansigter vendt mod hinanden? Den sorte farve er afgrænset, så på det første billede ser du ansigterne først, på det andet billede ser du vasen først.

Link til toppen af siden.

6. gestaltlov. Loven om symmetri

“To figurer, anbragt symmetrisk omkring en linje, opfattes som hørende sammen”.

Vi opfatter de 2 cirkler som hørende sammen, fordi de er anbragt symmetrisk omkring linjen.

Link til toppen af siden.

2.4 Gode råd til din grafiske produktion

Her er et par gode råd.

• Sørg for, at alt tekst er nemt at læse. Mørk tekstfarve på mørk baggrund er sjældent en god idé
• Brug kølige farver til baggrund og varme til forgrund
• Tænk på målgruppen og design efter det
• Overhold gestaltlovene
• Skab symmetri og sæt de grafiske elementer på linje
• Skab orden. Det vigtigste skal være tydeligt
• Skab genkendelighed. Genbrug farver, grafik og skrifttyper. Det gør brugeren tryg
• KISS (Keep It Simple and Stupid)

Eksempel 1. Baggrund- og forgrundsfarve

Den første er rædselsfuld. Lys tekst på en skriggul baggrund. Jeg får næsten ondt i øjnene. Nr 2 er bedre. Der er en god kontrast, men den gule baggrundsfarve dominerer teksten. Nr. 3 er god. Diskret baggrundsfarve, god kontrast og teksten får hovedrollen.

Eksempel 2. Symmetri

Ove Schneiders løbesidet. Der er INGEN symmetri. Siden er så rodet, så det nærmest er kult.

Gucci har selvfølgelig en helt anderledes orden og symmetri. Der er tænkt over hver en lille stump grafik her, og tingene er millimeter symetriske.

Skab orden og symmetri og hiraki

Her er et forslag til en AGF fanside. Det er svært at se, hvad der er vigtigst da alle skrifttyper er lige store. Navigationen er virkelig rodet. Men ok, det er en side for fanfraktionen “Tossehjørnet”, så de er tilgivet. Der er i øvrigt ingen hjørner på Aarhus Station :-).

Nu er der skabt noget orden. Overskrifterne har et hiraki, der er orden på navigationen, og der er symmetri. Dvs. at tingene er på linje eller centrerede.

Alt i alt. Kend reglerne. Du må gerne bryde reglerne, men du skal kunne argumentere for det. Et eksempel: Fodboldholdet Liverpool er et af verdens mest populære hold. De spiller i rødt. Rød er en meget varm farve, og duer som udgangspunkt ikke som baggrundsfarve. Jeg har alligevel set et fornuftigt forslag til en hjemmeside for Liverpool med rød baggrund.

Link til toppen af siden.

Kapitel 3. Forberedelser til en app

Når man skal udvikle en app, en hjemmeside eller lignende, så er der forskellige måder at indkredse det færdige resultat på. I kapitlet her skal du se et par metoder.

Link til toppen af siden.

3.1 Målgrupper

Det gælder ikke kun i IT-verdenen, at man skal tænke over, hvem modtageren er. Hvis vi vil overbringe folk et budskab, så skal vi gøre os klart, hvem målgruppen er. En af de mest brugte modeller er Minerva-modellen.

Minerva deler målgrupperne ind efter 2 akser. Moderne kontra traditionel og idealistisk kontra materialistisk. Det giver 4 områder:

• De blå: Typisk højreorienterede, vellønnede, ledere. Prestige, tro på sig selv, resultatorienteret. Måske er det ikke tilfældigt, at f.eks. Venstre har en blå partifarve.
• De violette: Typisk faglærte, men mere orienteret mod traditionelle værdier. Praktikere, orienteret mod spænding. De elsker Olsen-Banden og de traditionelle kan finde på at stemme på Dansk Folkeparti
• De rosa: Politisk midten, en del kvinder, idealister frem for materialister. Tradition, det nære miljø, familie
• De grønne: Idealister og moderne. Her har vi “økoflipperen” og folk, der typisk stemmer på alternativet eller lignende moderne og idealistiske partier . Engagement, fællesskabsorienteret, principmennesker

En sidste gruppe, du ikke finder i modellen, er de grå. De er gruppen i midten, som kan være svære at placere. De kan have kendetegn fra flere kategorier på en gang.

Link til toppen af siden.

3.2 Persona

En “persona” er en opfundet person, som gerne skulle repræsentere en typisk bruger. Man prøver på at gøre beskrivelsen så levende som muligt. Vi kan sagtens finde på at finde et billede og sætte den på personbeskrivelsen. Idéen er, at vi bedre kan gøre en side brugervenlig, når vi prøver på at gøre brugerne mere levende. Det er ikke helt forkert at beskrive en persona som en slags skuespiller.

Store hjemmesider/apps kan sagtens bruge flere persona’er. Her er 2 eksempler på tænkte persona’er, som DSB kunne bruge til deres billet app.

Persona 1. Fru Olsen

Fru Olsen er 75 år. Hendes mand døde for et par år siden. Fru Olsen er ikke så høj, men hun er ret aktiv i hverdagen. Hun bor i Kolding. Fru Olsen går til bridge og besøger veninder, og til det bruger hun sin bil. Men hendes børn og børnebørn bor i Aarhus og København, og når hun skal besøge dem, foretrækker hun at køre i tog. Bilkørsel i storbyerne er lidt for stor en mundfuld for hende.

Persona 2. Gert Gymnasieelev

Gert bor i Middelfart hos hans mor, far og hans lillesøster. Gert går i 3.g på Fredericia Gymnasium. I fritiden gamer Gert og spiller fodbold med hans venner fra folkeskolen. Gert pendler med tog. Gert er meget glad for dels Pepsi Max, dels festivaller. Når det er sommer, skal han som minimum på Skanderborg og Jelling festival.

Når man har sine personaer på plads, kan de bruges til udviklingsarbejdet. F.eks. ser fru Olsen ikke så godt, så bogstaverne i DSB’s app skal være store. Gert vil sætte pris på at vide, når Pepsi Max er på tilbud hos 7-11 på stationerne, og han vil gerne have tilbud om togbilletter i forbindelse med festivallerne.

3.3 Kravspecifikation

Hvis man skal bygge et hus, så starter man med en plantegning. Det forstår både dem, der skal have et hus, og dem, der skal bygge det. Så kan man tage på ferie og når man kommer hjem, står huset præcist som aftalt. En tegning er nem at gennemskue for alle, også ikke-fagfolk.

Man formulerer de krav, som man har til en hjemmeside/app i en kravspecifiktion. Det kan både være et kort afsnit om, hvad hjemmesiden skal kunne, men det kan suppleres af prototyper, strukturdiagrammer, user stories mv. Du møder prototyper, strukturdiagrammer og user stories i de næste afsnit.

Sådan er det langt fra med apps. Her er vi nødt til at kunne snakke sammen undervejs og justere undervejs. Vi er på forhånd slet ikke så sikre på det færdige produkt, som vi er med et hus eller en madopskrift. Derfor har vi brug for, at vi kan snakke sammen undervejs og korrigere projektet om nødvendigt. Meget mere om det i kapitel 4. Udviklingsmodeller.

3.4 Strukturdiagrammer

En nem og effektiv måde at skaffe sig overblik på, er at lave en oversigt i punktform. Det gælder både, hvis man producere en ny app/hjemmeside, men det gælder også i forhold til eksisterende apps/hjemmesider. Punktopstillinger har den fordel, at det er super nemt at bytte rundt på tingene.

For hjemmesiden her kunne en punktopstilling se sådan ud: Bemærk at søgefunktionen er anbragt lidt for sig selv, for den er ikke som sådan en del af menuen.

• Forside
• Informatik C
  • Lærebog til informatik C
  • Emne 1. Udvikling
    • Modul 1. Introduktion
    • … osv
• Informatik B
• …osv.
• Søg

Indtil nu har vi fokuseret på layout. Vi vil nu kikke på funktion. Hvem skal bruge appen, og hvad skal brugergruppen kunne gøre med appen. Til det brug har vi use-case eller på dansk “brugstilfælde”.

Link til toppen af siden.

3.5 Prototyper

En vigtig brik i app udvikling er modeller eller prototyper. Prototyper er ikke et færdigt produkt. Det ligner bare det færdige produkt så meget, at både udvikler og kunde kan forstå hinanden og komme videre i projektet. Det er langt billigere at lave en prototype end at lave et færdigt produkt.

Der er frit spil i forhold til at vælge, hvordan en prototype skal laves. Det kan være en tegning, noget i PhotoShop eller endda en PowerPoint. Her er en model for boligindretning. Du har allerede prøvet at lave en prototype i PowerPoint den første gang, du havde informatik.

Link til toppen af siden.

3.6 User stories

En user story er en kort sætning, som indeholder et kundeønske til en hjemmeside. Det er meget simpelt. Man skriver en kort sætning med et udsagn. Hver sætning indeholder

• HVEM er brugeren
• HVAD skal brugeren kunne
• HVORFOR skal kunden kunne det

Lad os igen tage DSB’s hjemmeside. Her er 3 user stories, som kunne være lavet til DSB’s hjemmeside:

• User story 1. Som bruger skal jeg kunne finde en togafgang fra en valgfri station. Så kan jeg bedre planlægge min rejse
• User story 2. Som bruger skal jeg kunne se rejsens pris, så jeg ved, hvad rejsen koster
• User story 3. Som administrator skal jeg kunne redigere sidens indhold, så der altid står det rigtige

Med andre ord:

• Som … bruger (HVEM) … skal jeg kunne … finde en togafgang (HVAD) … så jeg bedre … kan planlægge min rejse (HVORFOR).

Nogle kan godt lide at lave user stories som gule sedler, der hænger på en væg:

Her er det sat op i et lille skema, så det er nemmere at overskue. Jeg har understreget HVEM, HVAD og HVORFOR

User case nr	HVEM er brugeren	HVAD skal brugeren kunne	HVORFOR skal brugeren kunne det
1	Som bruger…	… skal jeg kunne finde en togafgang fra en valgfri station. …	… så jeg bedre kan planlægge min rejse
2	Som bruger …	… skal jeg kunne se rejsens pris, …	… så jeg ved, hvad rejsen koster
3	Som administrator …	… skal jeg kunne redigere hjemmesiden, …	… så brugerne altid har de nyeste informationer

På denne måde ender man med måske 10, 20 eller 100 user stories. Tilsammen udgør user stories den app, vi skal udvikle. Der må ikke være nogle funktioner på appen/hjemmesiden, som ikke findes under user stories.

Link til toppen af siden.

User stories giver dig brugergrupperne

Hvis vi er grundige nok i vores arbejde med user stories, så får vi vores brugergrupper foræret. Se i tabellen lige ovenover teksten her: Vi kan tælle 2 brugergrupper. Brugere (dvs. vores kunder) og administratorer.

Link til toppen af siden.

3.7 Sammenhæng mellem prototype, strukturdiagram og user stories

De 3 værktøjer har en god indbyrdes sammenhæng:

• I prototypen skal alle hovedmenupunterne fra strukturdiagrammet være der
• Strukturdiagrammet og user stories skal passe sammen: Alle user stories skal nemt kunne placeres ind i strukturdiagrammet
• Vigtigst af alt: Alle typer værktøjer skal være
  • Nemme at forstå for både kunde og udvikler
  • Nemme at producere i
  • Give et godt udgangspunkt for en snak om det færdige produkt

Eksempel: I forrige afsnit var der 3 user stories:

• Som bruger skal jeg kunne finde en togafgang fra en valgfri station. Så kan jeg bedre planlægge min rejse
• Som bruger skal jeg kunne se rejsens pris, så jeg ved, hvad rejsen koster
• Som administrator skal jeg kunne redigere sidens indhold, så der altid står det rigtige

Den første er opfyldt midt på forsiden. Her kan man søge en togafgang. Nr. 2 er opfyldt, fordi man kan få en pris på rejsen, når man først har fundet den. Den sidste er ikke noget, som brugeren skal se, så lige netop her giver det mening at skjule adgangen. Ellers giver det ikke mening!

3.8 Kort overblik over værktøjer

Ud over de nævnte værktøjer findes der masser af andre værktøjer. Hvis man ser bort fra kravspecifikationen, så vil det afhænge fra projekt og fra udvikler til udvikler, hvilke værktøjer man bruger.

Her er et overblik over de værktøjer, som er omtalt i kapitlet her.

VÆRKTØJ	FORKLARING
Kravspecifikation	Fortæller hvilke krav vi har til det færdige produkt. Hvis det færdige produkt er en lommeregner, er det f.eks. et karv, at den skal kunne pluser, minusse , gange og dividere osv
Personas	En tænkt person, vi beskriver så levende som overhovedet muligt. Personen skal repræsentere en typisk bruger
Strukturdiagrammer	En punktopstilling, som ligner en menu. Den fortæller, hvordan menustrukturen skal se ud. F.eks. forside, en side med produkter. Alle menupunkter inklusive alle underpunkter er med
Prototyper	En skabelon af det færdige resultat. F.eks. en PowerPoint skabelon
User stories	Man laver en lang række små historier, gerne på små gule Post-IT sedler. På hver seddel står der: HVEM skal bruge systemet, HVAD skal de bruge det til og HVORFOR skal de bruge det. Prøv så vidt muligt at se det fra brugerens synsvinkel.

Link til toppen af siden.

Kapitel 4. Udviklingsmodeller

4.1 Vandfaldsmodellen

Hr. og fru MangePenge har købt en udsigtsgrund til et hus, hvor de skal bygge og bo. De hyrer en arkitektfirma, de bliver enige om hvordan huset skal se ud plus en pris. Så går byggeriet i gang. Først rydder man grunden, støber fundamentet, bygger murene, holder rejsegilde osv. osv., og til sidst får hr. og fru MangePenge nøglerne i hånden. Huset ser ud som aftalt, og alt er dejligt.

Kendetegnende for huset som projekt er, at når man først har tegningerne, så er både kunden og bygherren en rigtig god og fælles idé om det færdige resultat. Det er også kendetegnende, at man tager en ting af gangen. Man siger, at man arbejder i faser. Når først en fase er afsluttet, f.eks. hvis murene er opført, så går man ikke tilbage og ændrer på fundamentet eller tegningerne. Man går heller ikke i gang med taget, mens man støber fundamentet.

Udviklingsmetoden kaldes for “vandfaldsmodellen”. Den er kendetegnet ved, at at vi lukker en fase helt, før vi starter den næste.

Link til toppen af siden.

4.2 Agile metoder

Vandfaldsmodellen er en traditionel metode til at lede projekter. Den metode brugte man også til IT-projekter, men man stødte hurtigt ind i nogle problemer:

• Det var svært at lave udspecificeret kravspecifikation, for vi ved ikke helt, hvordan det færdige produkt skal se ud
• Udviklerne kunne støde ind i ting undervejs, der ændrede projektet. F.eks. at noget udvikling viser sig at være uforholdsmæssigt dyrt
• Det samme for kunden. Kundens behov kunne sagtens ændre sig undervejs.
• Alt i alt kunne både kunde og producent stå med en fornemmelse af, at kravspecifikationen var en klods om benet, snarere end en hjælp

Derfor begyndte man at bruge helt andre projektmodeller til IT-projekter. De kaldes “agile” metoder. “Agil” betyder “bevægelig” eller “adræt”. Kongstanken ved agile (bevægelige) metoder er, at vi skal kunne tilpasse projektet undervejs, fordi vi bliver klogere hen ad vejen. Modsat byggeri så har vi ikke fuld viden om det færdige resultat i starten af projektet, til gengæld gør det ikke noget, hvis vi laver lidt om her og der.

Måden vi gør det på, er ved at blive enige om en ramme for projektet. Typisk en kerne, som skal være i orden. Rundt om kernen nogle ting, som kunne være rare at få, men som kan ændres undervejs.

Så holder vi et startmøde med kunden og bliver enige om de første skridt, kaldet et “scrum”. Vi designer, implementerer og afprøver ligesom i vandfaldsmodellen. Det nye er, at vi allerede efter typisk 2 – 4 uger holder et nyt møde med kunden. Så tager man resultaterne op til vurdering og planlægger de næste 2 – 4 ugers udvikling.

Perioderne fra et kundemøde til det næste kalder man et “sprint” eller en “iteration”, vist med en cirkel i figuren nedenfor. Sådan bliver man ved, indtil projektet er i hus. Den tætte kontakt mellem kunde og udvikler sikrer, at projektet hele tiden justeres efter både kundens behov og de ressourcer, der er til rådighed. “Fail often, fail early”: Jo tidligere vi fanger fejlene, jo nemmere og billigere er det at rette dem.

Link til toppen af siden.

4.3 Fordele og ulemper ved vandfaldsmodeller kontra agile metoder

Fordele og ulemper ved agile hhv. vandfaldsmodeller.

	VANDFALDSMODELLEN	AGILE METODER
FORDELE	– Velegnet til projekter, hvor vi er helt sikre på slutproduktet – Revisoren bliver glad: Det er nemt at dokumentere – Det er også nemt at placere ansvaret	– God til at fange fejl undervejs og få dem rettet .Virker meget mere fleksibel end vandfaldsmodeller – Tæt kontakt med kunden hele tiden, kunden får et medansvar – Vigtigt: Agile metoder gør det nemmere at skalere et projekts omfang. Hvis vi har svært ved at nå i mål, kan vi nemmere prioritere noget fra grundet de jævnlige kundemøder
ULEMPER	– Kan virke stiv og gammeldags – Svært at gå tilbage og rette fejl	– Kræver mere af projektlederen, fordi man ikke har en helt så fast køreplan – Kræver høj grad af tillid mellem udvikler og kunde – Ved uenigheder kan det være sværere at placere ansvaret

Link til toppen af siden.

4.4 Hvad ender vi så med for et produkt

Næsten alle virksomheder har et ERP system. ERP står for “Enterprise Resource Planning”. Kernen i systemet er bogholderiet eller regnskabet, men ERP systemer kan og bliver udvidet til at kunne styre næsten alt i en virksomhed. Løn, lager, produktion, fakturering, snart sagt alt. I faget virksomhedsøkonomi vil du helt sikkert støde på ERP systemer.

Vi siger nu, at en virksomheds ERP system er blevet forældet, eller at virksomheden f.eks. har købt en anden virksomhed, og at de 2 ERP systemer nu skal kobles sammen. En kæmpe opgave med et kæmpe ansvar.

Deres projekt ser sådan ud:

Hvis man styrer projektet ud fra traditionel projektledelse, dvs. vandfaldsmodellen, vil man typisk få det her resultat.

Hvis vi i stedet havde styret efter agile metoder (agil = “bevægelig”, “forandringsparat”), så havde vi fået det her resultat:

Vandfaldsmodellen er forudsigelig, men svær at tilpasse. Agile metoder er mere uforudsigelige, men nemmere at tilpasse. Agile metoder passer bedst til it-projekter, fordi både udviklere og kunde vil ønske tilpasninger undervejs. Samtidig er det forholdsvis nemt at rette i et it-projekt modsat f.eks. hvis man bygger et hus.

4.5 Agil udvikling og user stories

Den agile udviklingsmodel og user stories går rigtigt godt i spænd sammen. Lad os sige, at DSB skulle udvikle den hjemmeside, som jeg tidligere har nævnt: www.dsb.dk.

I afsnit 3.5 User stories forestillede vi os, at vi skulle udvikle en hjemmeside til DSB. Det kom der et par user stories på gule Post-it sedler ud af:

• User story 1. Som kunde skal jeg kunne finde en togafgang fra en valgfri station. Så kan jeg bedre planlægge min rejse
• User story 2. Som kunde skal jeg kunne se rejsens pris, så jeg ved, hvad rejsen koster
• User story 3. Som administrator skal jeg kunne redigere sidens indhold, så der altid står det rigtige
• User story 4 …
• User story 5 …

I virkelighedens verden vil der selvfølgelig komme måske 30, 40 eller flere user stories ud af det. Nu forestiller vi os så, at vi skal holde det første møde med DSB, og at vi arbejder efter den agile udviklingsmodel. Vores user stories er vores kravspecifikation, så vi er nået til det første runde med Design. Dvs. vi holder møde med kunden, det første af mange kundemøder i den cirkulære del af modellen.

Her aftaler man sammen, hvilke user stories man vil prioritere. Det er f.eks. user story 1, 3, 4 og 7.

Ved næste designmøde kikker man på implementeringen og diskuterer igen user stories. Det kan sagtens være, at DSB så er kommet i tanke om, at de har et par krav mere. Så laver man flere user stories, der svarer til kravene, f.eks. user story 55, 56 og 57. Af disse 3 er user story 56 og 57 meget vigtige, så de kommer forrest i køen og bliver udviklet inden næste møde.

Hver gang, man mødes til et designmøde, så gennemgår man user stories og priorieter. På et tidspunkt stopper man og udgiver produktet. Det kan sagtens være, at man ikke har implementeret alle user stories, men det kan måske ikke betale sig.

Link til toppen af siden.

5.7 Involver brugerne

“Operationen lykkedes, men patienten døde”

Ovenstående citat er skrækscenariet. Vi laver en god løsning, men den er ubrugelig.

Som designere mister vi meget hurtigt vores “jomfrulighed” over for det, vi designer. Vi bliver til eksperter frem for brugere. Det gælder for interaktionsdesign som for skriftlige opgaver: Man bliver blind på det, man selv laver.

Samtidig har brugerne har enorm magt inden for den digitale produkter, og de vælger os fra, hvis vi skaber bøvl for dem. Ved webshops er konkurrenterne f.eks. kun et klik væk. Så der er alt mulig grund til at involvere brugerne fra start. Det har vi forskellige måder til.

I kapitel 4 Udviklingsmodeller lærte du om, at vi inden for IT foretrækker agil udvikling frem for den traditionelle vandfaldsmodel.

Fordelen ved den agile model er, at den giver bedre mulighed for at korrigere projektet undervejs. Den giver også bedre muligheder for at involvere brugerne. Afprøvning kan fint finde sted med brugerne. En gren af agil udvikling kaldet “extreme programming” kræver direkte, at udviklerne sidder i samme lokale som brugerne.

Vigtigt: User stories er en rigtig god måde at involvere brugerne på. Især hvis det er brugerne selv, som skriver user stories.

Link til toppen af siden.

5.8 Brugertest og systemtest

Vi bruger mange metoder for at nå og forstå både kunder og brugerne. Gentagne møder med brugere og kunder som i den agile udviklingsmodel er kun en af flere muligheder, vi har

• Prototyper. Protyper er mini-udgaver af det færdige resultat. En god prototype kan give en god dialog med brugerne
• Teste undervejs

Der findes forskellige brugertest. Du skal kende disse typer test.

• Eksperttest eller heuristisk test
• Tænke-højt test
• Kvantitative test

Der er forskel på brugertest og systemtest I en systemtest tester vi for, om et system virker som aftalt Hvis vi tester, om vores knapper og links virker, så er det en systemtest På DSB’s hjemmeside www.dsb.dk kunne vi f.eks. tjekke, om der er muligt at købe en billet fra Kolding til Odense. I en brugertest involverer vi brugerne. En brugertest på DSB’s hjemmeside kunne være, om brugerne kan finde ud af at købe en billet fra Kolding til Odense

Eksperttest

En eksperttest eller heuristisk test er såre simpelt. Det er, når du tester dit eget arbejde. Det er nemt, billigt og effektivt, men det kan ikke stå alene.

Tænke-højt test

Tænke-højt test er en test, hvor man stiller brugere forskellige opgaver. Lad os tage DSB som eksempel. Brugeren får til opgave, at de skal være i Nykøbing Falster i morgen kl. 12. Hvilket tog skal de tage og hvad koster billetten.

Brugeren tænker så højt, f.eks. “Hm, først vil jeg åbne DSBs hjemmeside”. “Mon der er en billetknap, næeh, jeg klikker her i stedet …”. Designerne er så bag brugeren og lytter med. På den måde lærer de, hvordan brugeren opfatter programmet.

Tænke-højt test er helt fantastiske til at gøre os klogere på brugernes adfærd, og f.eks. Microsoft har dyre lokaler indrettet specielt til tænke-højt tests. Men de kan være dyre at gennemføre. Især hvis man ønsker et bredt udsnit af brugerne.

Tænke-højt test og user stories

Når man laver tænke-højt test, er det super oplagt at tage udgangspunkt i user stories. Fra afsnit 3.5 User stories har vi et antal user stories

• User story 1. Som kunde skal jeg kunne finde en togafgang fra en valgfri station. Så kan jeg bedre planlægge min rejse
• User story 2. Som kunde skal jeg kunne se rejsens pris, så jeg ved, hvad rejsen koster
• User story 3. Som administrator skal jeg kunne redigere sidens indhold, så der altid står det rigtige
• User story 4 …
• User story 5 …

Vi vil så typisk tage udgangspunkt i de højest prioriterede user stories og bruge dem til en tænke-højt test. På den måde sikrer vi os, at vi får lavet et produkt, som brugerne kan anvende.

Link til toppen af siden.

Kvantitative og kvalitative test

Kvantitative test er hårde fakta, f.eks. tal. Man indsamler ofte data gennem et spørgeskema uden direkte kontakt til kunderne. Vi forsøger på at MÅLE tingene.

Kvantitative test er spørgsmål til følelser, fornemmelser o.lign. Vi forsøger at BESKRIVE tingene snarere end at måle og beskrive tingene statistisk.

Forskellen på kvantitativt og kvalitativt Kvantitative data er data, er kan måles, vejes og efterprøves. Dvs noget objektivt. Modsat er kvalitativt er en personlig oplevelse, dvs. noget subjektivt. Et eksempel. HviiiViggo og Finn Fakta er AGF fans og til fodbold og ser DeHviiii spille. – HviiiViggo: “Add, gult er bare SÅ grimt” – Finn Fakta: “Ja, gult kan godt skære i øjnene, når det er en forgrundsfarve” – HviiiViggo: “Kæft hvor ham BUNDBYtræneren er grim og dum” – Finn Fakta: “Han ser lidt ubarberet ud” HviiiViggo er selvfølgelig den subjektive/kvalitative, mens Finn Fakta er den objektive/kvantitative

Link til toppen af siden.

A-B test eller splittest

A-B test eller splittest er en meget anvendt måde at teste på. Det går ud på, at man deler (= “splitter”) sin gruppe op i 2 normalt cirka lige store dele. Den ene del udfører man testen på. Det kunne være, om de køber mere af en bestemt vare på en webshop efter en kampagne. Den anden del af gruppen er kontrolgruppe.

Når testen er ovre, sammenligner man resultaterne for de 2 grupper.

Link til toppen af siden.

5.9 Opsummering. Tjekliste til app udvikling

Brug agil udvikling

• Agil udvikling giver mulighed for at ændre produktet undervejs, og det får vi brug for

Kort beskrivelse af din idé

• Hvad er ideen med app’en/hjemmeside
• Hvordan skal den gøre en forskel
• Hvilken målgruppe sigter vi efter

Design

• Involver brugerne om muligt
• Brug din viden om det grafiske puslespil inklusive gestaltlovene, når du designer
• Tag udgangspunkt Normans designprinciper
• Anvend love for brugervenlighed f.eks.
  • Hicks lov: Store knapper er nemmere for brugeren at ramme end s,
  • Fitts lov: Få valgmuligheder er bedre end mange
  • KISS: Keep it Simple and Stupid
  • Måske den vigtigste: FTF, putting First Things First

• Hvis relevant: Lav et strukturdiagram
• Hvis relevant: Lav en prototype

Link til toppen af siden.

User stories

• User stories er altid relevante, og bør være i centrum for al udvikling
• Lav user stories, og lav gerne mange af dem
• I hver user story skal der stå:
  • HVEM er brugeren
  • HVAD skal brugeren kunne
  • HVORFOR skal kunden kunne det

Agil udvikling med user stories

• Sammen med kunden prioriter user stories. Hvilke er de vigtigste
• Involver brugerne om muligt
• Udvikl de vigtigste og udvikl dem
• For hver gang, man kører en “runde” i den agil udvikling, mødes man og prioriterer, hvilke user stories som skal udvikles først
• Kunden må gerne medbringe nye user stories til næste møde. Vi er der for brugernes skyld!

Test din produkt af

• Anvend både system- og brugertest
• Involver brugerne om muligt
• Brug gerne både kvantitative og kvalitative test
• Tænke-højt test er den mest besværlige. Men den er også den bedste måde at teste produktet på

Kapitel 6. Digital markedsføring

Bemærk: En del af afsnit 1 er primært taget fra lærebogen “Afsætning” af Lene Jørgensen m.fl. Bogen bruges i hvert fald på IBC Kolding.

Set med salgsøjne har vi overordnet 3 kategorier af digitale medier:

• Ovned media
  • Egne medier, f.eks. websted, egen Facebook/Instagram/Youtube profil mv.
  • Hvis andre linker til os, og vi linker til dem
• Paid media. Når vi betaler for f.eks …
  • … at komme forrest i søgemaskinerne
  • … bannerreklamer/video
  • … annoncer på Facebook, Instagram eller andre sociale medier
• Earned media
  • Vores “street credit”, dvs. hvis vi f.eks. har en populær blog/populær hjemmeside

Hvad er en “landing page”? Hvis man har en reklame på nettet med et link til organisationens hjemmeside, så linker man langt fra altid til forsiden. Man bruger ofte en særlig side, skabt til formålet, der hedder en “landing page”. Landing page er direkte rettet mod dem, som “lander” på hjemmesiden ud fra reklamen. Dvs. den følger op på et eventuelt tilbud og guider brugerne videre.Landing page sjældent i hjemmesidens menu, men den er uvuderlig både i forhold til at byde kunderne velkommen, men også til at måle effekten af reklamen. Hvis man kan se en stor trafik på landing page, så virker reklamen.

• Der er forskel på push og pull markedsføring
  • Push = når jeg skubber noget ud til dig: Lægger reklame på Facebook og Instagram. Kunden søger og finder selv informationen
  • Pull = Hvis man f.eks. skriver “Sneakers” skrives i Google, så “trækkes” kunden ind gennem Google Search/Google Shopping

Link til toppen af siden.

6.1 Paid media/eksten søgemaskineoptimering

Paid media er, hvis vi går ud og køber os til online markedsføring. Det klasse eksempel er reklamer på Facebook eller at betale Google for at komme højt i deres søgemaskine.

• Paid media anvendes både til push og pull markedsføring (modsat hvad der står i lærebogen om afsætning)
• De mest anvendte er søgeordsannoncering + bannerreklamer
• Søgeordsannoncering betyder, at vi betaler for at stå højt oppe hos Google

Her er et eksempel på, hvor kringlet det kan være at købe de rigtige søgeord . Det kræver god indsigt i en branche at kunne gøre det rigtigt.

• En italiensk restaurant i Kolding vil gerne have flere besøgende ind på hjemmesiden
• De overvejer at købe søgeordet “italiensk restaurant”. Bemærk: De betaler først til Google, hvis nogen klikker på søgeordet
• Men: De er ikke interesseret i at annoncere for kunder, som bor f.eks. på Sjælland. De kører nok næppe til Kolding for at spise italiensk, hvis de kan få det samme mad i f.eks. Roskilde. De kunder er der ingen grund til at bruge penge på. Så de køber søgeordene “italiensk restaurant Kolding”.
• De vil også gerne reklamere for mad, så de vil købe ordet “pizza”. Men de vil ikke konkurrerere med take-away pizzaer, heller ikke i Kolding, så den idé dropper de. Til gengæld er de gode til at lave ravioli, så de køber ordet “ravioli”. Ravioli er pasta med fyld

Bannerreklamer er en mulighed, men det skal altid kombineres med en “call-to-action” knap. Dvs. at annoncen har til formål at få folk til at klikke på en knap. så de kommer ind på hjemmesiden. Gerne en landing page.

På Facebook har man kæmpe muligheder for at målrette reklamer, og du kan gå ind ikke kun på det første niveau i salgstragten. Tilbage til vores italienske restaurant. De vil lave en bannerreklame til Facebook. Hvem skal så have den reklame? De kan gøre det utroligt specifikt, som f.eks.:

• Folk, der bor i en afstand af maks 10 km fra Kolding
• De skal mindst have en middel indkomst
• De skal være over 20 år
• De skal have liket opslag om mad
• De må gerne have besøgt Italien
• Osv. osv.

Link til toppen af siden.

6.2 Owned media/intern søgemaskineoptimering

Owned media er de medier, vi selv ejer. Det kan være vores hjemmeside, men det kan også være Facebook, Twitter eller andre online medier som vi styrer og kontrollerer.

Når vi bygger en hjemmeside og/eller webshop, kan vi følge nogle bestemte regler, som Google sætter op. Følger vi de regler, ranker vi højere i Google end hjemmesider, der ikke følger reglerne.

En virksomhed havde en webshop for elektrikere med bl.a. skabe til elektriske installationer. De ville ændre navnene fra “skabe” til “inkapslinger”. Da de ændrede navnet, faldt antallet af brugere. For folk søgte på “el-skabe” på nettet, ikke “el-kapslinger”.

En del af søgemaskineoptimering er, hvis anerkendte medier linker til os. Hvis man kan få populære hjemmesider til at linke til os, så kommer vi højt i søgemaskinerne. Det samme sker, hvis der er mange, der linker til os. Det hedder “link-building”.

Virksomheden Granturismo Cars A/S leaser dyre biler. De har fundet en super smart måde at bruge YouTube på, og de tjener penge på deres arbejde. De producerer YouTube videoer om deres biler, og dem, de interviewer, må gerne være kritiske. De har over 10 mio visninger af deres videoer. Her er et par af de seneste videoer. Granturismo Cars “ejer” jo deres egen YouTube kanal, så de behøves ikke at betale for reklamer her.

Link til toppen af siden.

6.3 Earned media

Sæt nu, hvis vi kan få andre til at gøre markedsføringsarbejdet for os? Det lyder næsten for godt til at være sandt.

Nogen siger, at den bedste reklame er gratis. F. eks. hvis folk taler godt om os. En anden mulighed er at få nogen til at like os på Facebook. Hvis nogen deler opslag eller andet fra os, bare fordi de synes om det, så er det godt for os. Trafikstyrelsen lavede engang en video rettet mod unge mænd, der kører for stærkt i bil. Den bestod af søde, unge og topløse piger, som pegede på skilte med fartgrænser samtidig med, at bilerne kørte forbi. Videoen var selvfølgelig rettet mod unge mænd, der kører for stærkt. Alle snakkede om videoen, og den gik verden rundt … og det var præcis, hvad dem, der lavede videoen, ville opnå.

At få andre til at sprede budskaberne digitalt kaldes “viral markedsføring”. Hvis Granturismo Cars får folk til a sprede deres YouTube videoerne, så er det også viral markedsføring. Se evt. linket her https://foundationinc.co/learn/earned-media/

Link til toppen af siden.

6.4 Forbrugeranmeldelser, influencers og online markedsføring på webshops

Forbrugeranmeldelser

Hvis du bliver anmeldt positivt f.eks. på TrustPilot, så fremmer det din forretning. Desværre er det muligt at købe sig til anmeldelser på TrustPilot og at fjerne negative anmeldelser, så du kan ikke stole 100% på dem. Jo, hvis du ser anmeldelser som ikke er overdrevent positive, så kan du stole på selve anmeldelsen.

Link til toppen af siden.

Ekstern markedsføring via influencers

Influencers har ikke specielt mange år på bagen som anerkendt markedsføringskanal. Det er de ved at blive nu. Det kan skifte meget fra branche til branche, hvor meget influencere påvirker deres følgere. Influencers er dog en mulighed, som man ikke mere automatisk skal se bort fra. Egentlig er influencere “paid media”.

Link til toppen af siden.

Online markedsføring og webshops

Som du allerede har forstået, så er der mange muligheder for online markedsføring. Når det handler om online medier, så har vi yderligere den mulighed, at vi kan få statistik på alt. Jeg mener det: ALT. Vi ved, hvor kunderne kommer fra, hvor lang tid de bruger på de enkelte sider, hvad de har klikket på, hvilke sider der er mest populære osv. osv.

Link til toppen af siden.

6.5 Opsummering omkring appudvikling

Her er en opsummering på, hvordan appudvikling kan foregå fra start til produktet er i drift: Der er to partnere: Kunden og bureauet, der udvikler

• Bureauet får til opgave at udvikle en app. Muligvis er der kravspecifikationer
• Man holder første måde efter den agile metode. Her diskuteres kundens ønsker. Ud fra kundens ønsker. Der udarbejdes følgende:
  • En prototype
  • Strukturdiagram
  • User stories

Prototypen giver os appens udseende. Strukturdiagrammet viser, hvordan appen skal inddeles. User stories fortæller os, hvad appen skal kunne og hvem der skal bruge appen, dvs. brugergrupperne.

• Ved næste møde sker følgende
  • Hvis kunden er tilfreds med prototypen, sættes den i produktion sammen med strukturdiagrammet. Ellers arbejdes videre med både prototypen og strukturdiagrammet
  • De vigtigste user stories implementeres
  • Der arbejdes videre med user stories

• I de efterfølgende møder fortsætter processen med at implementere og tilrette app’en.

På et tidspunkt stopper vi og sætter appen/hjemmesiden i drift. Der kan sagtens være user stories, som så ikke bliver implementeret. Erfaringen siger dog, at disse user stories ofte vil være af lav værdi for kunden.

Ovevej fra starten en strategi for, hvordan siden skal markedsføres. Du vil senere i kurset lære at optimere owned media i forhold til indhold og kodning.

Link til toppen af siden.