23
Projektrapport Multimedieteknologi og Interaktionsdesign Udarbejdet af: Martin Chrøis Rasmussen Michael Eriksen Mark Sølvgren Jannik Stenbæk Andersen

Projekt Rapport fra Herregruppen

Embed Size (px)

DESCRIPTION

aflevering af projekt vedr. Dansk Angolansk Venskab

Citation preview

Page 1: Projekt Rapport fra Herregruppen

Projektrapport Multimedieteknologi og Interaktionsdesign

Udarbejdet af:

Martin Chrøis Rasmussen

Michael Eriksen

Mark Sølvgren

Jannik Stenbæk Andersen

Page 2: Projekt Rapport fra Herregruppen

Projektrapport

Side 1

Projektrapport Multimedieteknologi og Interaktionsdesign

Indhold

INDLEDNING ............................................................................................................................................................................... 2

UDVIKLINGSMODEL .............................................................................................................................................................. 2

FORANALYSE .............................................................................................................................................................................. 3

FASTLÆGGELSE AF UDVIKLINGSPARADIGME. ..................................................................................................................... 3

PROJEKTBESKRIVELSE ............................................................................................................................................................ 3

UNDERSØGELSESTRIN ............................................................................................................................................................... 4

KOMMUNIKATIONSPLAN ..................................................................................................................................................... 6

DESIGNTRIN ............................................................................................................................................................................... 6

INFORMATIONSDESIGN ........................................................................................................................................................ 6

INTERAKTIONSDESIGN .......................................................................................................................................................... 7

PRÆSENTATIONSDESIGN ...................................................................................................................................................... 7

REALISERINGSTRIN ..................................................................................................................................................................... 8

FREMTIDIG UDVIKLING ......................................................................................................................................................... 9

KONKLUSION ............................................................................................................................................................................. 9

BILAG ....................................................................................................................................................................................... 10

TIDSPLAN ............................................................................................................................................................................ 10

MINDMAP .......................................................................................................................................................................... 10

INDHOLDSDOKUMENT ...................................................................................................................................................... 11

FLOWCHART ....................................................................................................................................................................... 12

STORYBOARD ..................................................................................................................................................................... 13

DESIGNMANUAL ................................................................................................................................................................ 17

SCREENSHOT ...................................................................................................................................................................... 19

KODERETTELSER ................................................................................................................................................................. 20

Page 3: Projekt Rapport fra Herregruppen

Projektrapport

Side 2

Indledning

Den afsluttende opgave på kurset Multimedieteknologi og Interaktionsdesign består af denne rapport

samt et forslag til et website for foreningen Dansk Angolansk Venskab (DAV). Dav er en upolitisk

humanitær forening, som har til formål at støtte udviklingsprojekter i Angola, og i den proces at

fremme kulturel udveksling og venskab mellem befolkningerne i Angola og Danmark.

Foreningen har allerede et Website man ikke er tilfredse med. Man ønsker et nyt site der bedre kan

fange opmærksomheden omkring foreningen, dens værdier og virke. Sitet skal være let at

vedligeholde og udbygge.

Vi har fået følgende input til opgaven:

Oplæg fra DAV

Oplæg til projektopgave

Dansk Angolansk Venskabs nuværende site (www.dav.nu)

Et kundemøde på 1,5 timer

Et kort kundemøde midtvejs i processen

Vores forslag til websitet kan ses på: http://multimedieteam.dk/0512/hg/wp/

Projektgruppe

Martin Chrøis Rasmussen

Michael Eriksen

Mark Sølvgren

Jannik Stenbæk Andersen

Kontakt: Martin Chrøis Rasmussen

Mail: [email protected]

Tlf# 20817364

Udviklingsmodel

Udviklingsmodellen HOME er anvendt igennem projekt forløbet. HOME er en forkortelse af Holistic

Open Multimedia mEthod, og er en udviklingsmodel målrettet projekter der vedrører udvikling af

multimedieproduktioner. Metoden har 4 metodetrin: Foranalyse, Undersøgelse, Design og Realisering.

De enkelte metodetrin har anbefalinger til aktiviteter, processer, værktøjer og dokumentation.

Metodens trin afvikles i 2 spor:

Et procesrettet spor der vedrører det styringsmæssige og økonomiske aspekt af et projekt

Et produktrettet spor, der vedrører de aktiviteter der fører frem til det ønskede produkt.

I denne opgave fokuseres næsten udelukkende på det spor der vedrører produktet. Det eneste

artefakt fra processporet er således den udarbejdede tidsplan.

Page 4: Projekt Rapport fra Herregruppen

Projektrapport

Side 3

Beskrivelsen af de enkelte metodetrin indledes med en kort beskrivelse af de aktiviteter der skal

udføres i trinnet. Herefter præsenteres metodetrinnets artefakter.

Foranalyse

I denne første fase er formålet at skaffe så meget information, at der kan laves et første udkast til hvad

projektet skal indeholde, både hvad angår det styringsmæssige og det produkt der skal udvikles.

Resultatet er en tekstuel beskrivelse (en projektbeskrivelse) af baggrunden for projektet, hvad der

ønskes udviklet og målgruppen for produktet, samt en afgrænsning af hvilke dele af det ønskede,

projektet leverer.

Det fastlægges også hvordan arbejdet skal organiseres (udviklingsparadigme). Endelig indeholder

metodetrinnet en fastlæggelse af projektets tidsplan og dets bemanding.

Resten af afsnittet består af: fastlæggelse af valg af udviklingsparadigme, projektbeskrivelse samt en

henvisning til tidsplanen.

Fastlæggelse af udviklingsparadigme.

Foranalyse og undersøgelse forekom os at være rimeligt konkrete, vi valgte derfor at udføre disse

metodetrin efter vandfaldsmodellen.

Da ingen i teamet havde erfaring med udvikling af multimedieproduktioner, var vi fra start

opmærksomme på, at vores design og realiseringsprocesser ville blive noget eksperimenterende. Vi

havde en fornemmelse af, at vi ville lave et overordnet design og ud fra det, vælge et tema der kunne

opfylde dette. Designtrinnet og realiseringstrinnet blev udført som en blanding af udforskende og agil

udvikling, med fælles udforskning og derefter uddelegering af opgaver når de var tilpas veldefinerede.

Fælles for alle trin var, at vi ønskede så megen brugerinddragelse som det var muligt, med de givne

rammer, vi har således haft løbende mailkontakt med kunden.

Projektbeskrivelse

Motivation

Projektet er ønsket af bestyrelsen for foreningen Dansk Angolansk Venskab (DAV). Det opleves at

foreningens nuværende website ikke fungerer godt nok, i forhold til at tiltrække opmærksomhed om

foreningens virke. Sitet er ikke færdigudbygget og ikke opdateret på alle punkter, og er desuden

opbygget og vedligeholdt af et enkelt bestyrelsesmedlem, som ikke har dybdegående erfaring med

webudvikling.

Formål og resultater

Bestyrelsen ønsker en hjemmeside der bedre promoverer foreningen og som gør det let for de

forskellige brugere af hjemmesiden at finde de informationer de søger.

Page 5: Projekt Rapport fra Herregruppen

Projektrapport

Side 4

Erfaringsmæssigt besøges sitet af meget forskellige mennesker og instanser. Der er således flere

forskellige målgrupper med forskellige behov for information. Websitet skal således på en enkel måde

give information, der er målrettet følgende grupper:

Potentielle danskere med interesse for foreningen

Potentielle donorer

Danske virksomheder

Danske myndigheder

Medier

Andre danske NGO’er

Foreningens medlemmer

Uddannelsesinstitutioner

”Vildfarne” danskere der søger oplysning om Angola, eksempelvis turister der ønsker at

besøge Angola. Disse brugere skal gerne kunne finde så meget information, at de kan komme

videre uden at belaste foreningen med forespørgsler, der ikke vedrører det humanitære

arbejde.

Der ønskes fra foreningens side et design af sitet der er nemt at bygge videre på. Desuden er der

ønsker om at starte en DAV-facebook gruppe, og blive oprettet som medlem på twitter, som

foreningen ser som et godt værktøj til at have en dialog med medlemmer og interesserede

organisationer. Det skal ligeledes være muligt at afspille video på sitet. Sitet skal udover den danske

version, findes i en engelsk og en portugisisk version. Der skal kunne viderestilles til disse sider fra den

danske side. Som resultat ønskes et website, der er let at bruge, er organiseret så den enkelte

målgruppe let kan finde relevant information og som er let at opdatere og udbygge.

Mål og afgrænsning

Når projektet er afsluttet vil opbygningen af sitets layout, design, informationsstruktur og interaktion

være fastlagt. Der leveres en CMS-løsning der gør det enkelt og let at opdatere sitet med nyt

materiale. Udviklingen af den engelske og portugisiske del af sitet prioriteres lavt af DAV. Denne del af

sitet kan udbygges i en efterfølgende fase af projektet. På sigt kan der udvikles integration til de

sociale medier facebook, twitter mm. Der afleveres dokumentation i form af designmanual, og et idé-

katalog til inspiration for videre udbygning af sitet.

Organisering

Der er udarbejdet tidsplan til internt brug, se bilag. Deadline for projektet er den 12.3.2012 kl. 12:00.

Projektet organiseres i en selvstyrende gruppe.

Undersøgelsestrin

I denne fase har vi brugt meget tid på, at diskutere hvilke virkemidler sitet skulle have. Vores proces

har været lidt eksperimenterende, da det er første gang, flere af os har arbejdet med et sådan projekt.

Vi har selvfølgelig i processen hele tiden forsøgt, at have fokus på kundens ønsker omkring det

kommunikative ved sitet, samt målgruppens opfattelse af information, funktion og interaktion.

Page 6: Projekt Rapport fra Herregruppen

Projektrapport

Side 5

Ligeledes har vi researchet på andre websites som beskæftiger sig med humanitære gøremål som

DAV. Derved kan man konstatere, at andre organisationer ligeledes kunne have et behov for et

redesign af deres sites.

Kunden

DAV er en venskabsforening som har eksisteret siden 2003. Dens overordnede formål er, at skabe

venskabelige relationer mellem danskere og angolanere i Danmark. Derigennem ønsker DAV, at yde

hjælp i Angola på basis af projekter i de områder af Angola, hvor der virkelig er behov for det.

Projekterne omfatter:

Etablering af skoler

Hospitalsudstyr

Landsbrugs isenkram og viden

Handicap- og miljøområder

Repræsentation af lokale svage grupper

Angola er et land som har været præget af ufred og borgerkrig i gennem 30 år. Derfor har DAV

gennem sin interesseorganisation, valgt at støtte lokale NGO'er igennem humanitære

udviklingsprojekter. DAV ønsker ligeledes at skære alle unødvendige mellemled væk, for derigennem

at give danskere som ønsker at deltage og donere penge eller materiel, mulighed for at kunne besøge

de lokaler projekter i Angola og direkte være medvirkende til at udføre opgaverne. Derved sikrer DAV

at midlerne går ubeskåret til dem som har brug for hjælp, uden tunge administrative omkostninger i

baglandet.

DAV's specifikationer

Som det gamle site klart giver udtryk for, har DAV behov for et nyt mere tidssvarende website som kan

repræsentere organisationen på bedst mulig måde. Der er brug for et site som gennem billeder, tekst

og anden information giver interessenten et klart og tydeligt budskab, hvad denne organisation står

for.

Kundens ønske var at billedillustrationerne skulle udgøre hovedparten af budskabet for derigennem at

skabe interesse hos danskere som ville donere til foreningen eller direkte kunne deltage aktivt i

aktiviteterne.

Udenlandske organisationer skulle også kunne søge oplysninger om DAV på enten engelsk eller

portugisisk. Lokale Angolanere skal kunne også læse om DAV's arbejde og om Danmark hvorfra

foreningen stammer.

Sitet skal være enkelt og simpelt uden for megen brug af for mange farver og tekst ud fra begrebet

”less is more”

Page 7: Projekt Rapport fra Herregruppen

Projektrapport

Side 6

Kommunikationsplan

Formål

Kunden er foreningen Dansk Angolansk Venskab, som ønsker et nyt design på deres website. Formålet

med sitet er at synliggøre og formidle foreningens information på internettet og derigennem udvide

deres kontaktflade.

Afsender

Foreningen Dansk Angolansk Venskab (DAV) er den dominerende afsender for hele sitet.

Målgruppe

Sitet vil primært henvende sig til danskere med interesse i foreningen som for eksempel myndigheder,

samarbejdspartnere, private donorer samt nuværende og eventuelt kommende medlemmer. Den

sekundære målgruppe er angolanere. Det kunne være lokale folk med projekt forslag og generel

interesse i foreningens arbejde. Tertiært er der en international målgruppe, for eksempel andre

udenlandske venskabsforeninger og interesse-organisationer.

På grund af at folk skal tage et bevidst valg om at besøge sitet, er målgruppe og modtagergruppe den

samme. Selvfølgelig kan der være folk som fejlagtigt kommer ind på sitet, og ligeledes medlemmer af

foreningen som aldrig besøger sitet.

Budskab

Sitet har til opgave at formidle foreningens arbejde, som kan beskrives med mottoet ”Giv en mand en

fisk, og du giver ham mad for en dag, lær en mand at fiske, og du giver ham mad for livet.”

Medie

Mediet er naturligvis et website, der hovedsagligt indeholder tekst og billeder men eventuelt også

video. Sitet skal indekseres under søgeordene: Angola, venskabsforening, humanitært arbejde,

udviklingsland. Der lægges vægt på at sitet kan ses på forskellige platforme som computere, tablets

og smartphones.

Designtrin

Designtrinnet har været en iterativ proces mellem ideer til indhold og skitser til layout, holdt overfor

udleveret materiale fra DAV og interessante temaer. En stor del af forløbet er gået med at diskutere

holdninger, ideer samt muligheder for sitets opbygning. I dette afsnit beskrives hvordan informations-,

interaktions- og præsentationsdesign er blevet udformet.

Informationsdesign

Det har ikke været den overordnede hensigt at udarbejde tekster og definere indholdet på sitet. Derfor

er størstedelen af informationsindholdet på sitet taget fra det gamle site eller plagieret andre steder

fra på nettet, hvor relevant information kunne findes. Billeder og video er modtaget fra foreningen, og

det bedste materiale er blevet udvalgt og redigeret. Det første punkt i designfasen var at diskutere og

Page 8: Projekt Rapport fra Herregruppen

Projektrapport

Side 7

fastlægge hvilke sider og deres indhold sitet skulle bestå af. Igennem projektet har vi udelukkende kun

fokuseret på det danske site, og vi har derfor kun forholdt os til hvilket indhold vi mener, er relevant

for den danske bruger. Først lavede vi en brainstorm i form af et mindmap, hvor alle ideer blev

nedskrevet. Dernæst lavede vi et udkast med hvilke sider og indhold vi i gruppen diskuterede, sitet

skulle bygges op omkring. Der er blevet lagt vægt på at holde sitet enkelt, således at

informationsindholdet på hver side er begrænset. Dette har også medført at vi har forsøgt at opveje

billeder i forhold til tekst, de steder hvor det har været muligt.

Interaktionsdesign

Vi har i udviklingsforløbet af sitet forsøgt at holde et brugervenligt overblik, således at navigeringen

rundt på sitet opfattes logisk af brugeren. Dette blev gennemført ved at have en hoved-menubar i

headeren med links til de vigtigste undersider, og derudover en under-menubar i footeren for mindre

relevante undersider. Vi valgte at splitte større indholdsemner op og fordele det ud på flere sider, for

igen at opnå et bedre overblik. Dette betyder at flere af menupunkterne i headeren er blevet tildelt en

dropdown menu, med tilhørende underpunkter som ligger indenfor samme emne. Header og footer

går igen på alle sider. Det er derfor muligt at nå alle andre undersider, fra en hvilken som helst side

med bare et klik. I bilag under flowchart er illustreret hvordan sitet hænger sammen.

I vores kommunikationsplan fastlagde vi hvilke målgrupper sitet henvender sig til. For at målrette

informationsindholdet direkte til de forskellige brugere, er dropdown underpunkterne i menupunktet

”Om DAV” dedikeret til de forskellige målgrupper. Dette gør det nemt for en bruger med en bestemt

baggrund og hensigt, at finde de oplysninger der henvender sig direkte til vedkommende.

Derudover er der i øverste højre hjørne af sitet implementeret en søgefunktion, der skal gøre det nemt

at finde bestemte artikler på sitet. Til venstre for søgefunktionen kan der indsættes ikoner som linker til

facebook og twitter. Ved siden af er desuden indlagt et britisk, portugisisk samt et dansk flag, hvor

meningen er at der linkes til sitets oversatte versioner på disse sprog.

Præsentationsdesign

Valget omkring valg af tema for sitet, gav anledning til en længere diskussion i gruppen. Det har været

en iterativ proces, hvor ideer og layoutskitser er blevet udformet og holdt op imod eksisterende

temaer. Ud fra de to forrige designtrin havde vi et nogenlunde klart overblik over hvordan indholdet

på forsiden skulle præsenteres. For nye brugere af sitet er det vigtigt at have en vis form for tillid, hvis

man har et ønske om at støtte eller involvere sig i foreningens arbejde. Derfor er det også vigtigt at

præsentationen af sitet fremstår med en professionel seriøsitet, der skal underbygge foreningens

troværdighed. Fokus lå derfor på at finde et tema, som fremstod enkelt og ikke havde et rodet

udseende. De forskellige skitser kan ses i bilag under storyboards. Efter en konsultation med DAV, faldt

valget af det endelige tema på ”Chameleon”. Udover det enkle design som vi søgte, er der også

indbygget en del funktioner i dette tema, som også opvejer valget, og gjorde den videre udvikling

nemmere. Temaet består af en wrapper centreret midt på sitet, opbygget med en header og footer

som beskrevet i forrige afsnit. I headeren er der desuden et logo i venstre side hvor navnet Dansk

Angolansk Venskab indgår. Disse elementer er fundamentet for sitet, som altså går igen på alle sider.

Page 9: Projekt Rapport fra Herregruppen

Projektrapport

Side 8

På forsiden er der centralt integreret et slideshow i wrapperens bredde, bestående af fortællende

fotografier og en kort appetitvækkende tekst, der linker til udvalgte undersider. Neden under

slideshowet er opstillet tre kolonner som beskriver foreningens værdier og målsætninger. Brugeren

der kommer ind på sitet skal ud fra disse elementer, kunne skabe sig et fuldt indtryk af hvilken

forening DAV er. Udover billederne i slideshowet, er der på forsiden ikke anvendt andre billeder, da vi

hældte mest til at det ville virke forstyrrende i forhold til designet.

Vi har valgt at holde sitet i neutrale matte farver, fordi vi synes det passer bedst til temaets stil. Selve

baggrundsfarven i wrapperen er i hvid, og det bagvedliggende tapet er holdt i en grå-grønlig farve,

med en struktur af fin granit. Vi har benyttet fonten ”Nobile” til alle overskrifter, menupunkter og

resterende tekst på sitet.

Poynter eye tracking

Med udgangspunkt i teorien om Poynter eye tracking, har vi udviklet sitet efter ideen om

synsopfattelsen i forhold til sidens indhold og komposition. Vores DAV logo har selvfølgelig den

centrale venstre placering, hvorefter slideshowet har center placeringen med henledning på sitets sider

henholdsvis nederst for mindre relevante og på øverst de mest relevante. Søge funktionen ligger

placeret i øverste højre hjørne.

Undersiderne er ligeledes opbygget efter Poynter eye tracking med tekst opsætning i F-pattern.

Realiseringstrin

Med udgangspunkt i vores uddannelsekursus har produktionsholdet skabt et website til DAV som er et

simpelt og nemt CMS-system i WordPress. Det vil give DAV mulighed for nu og på sigt at have nem

adgang til oprettelse af nye sider i sitet og indlæg på deres blog, uden dybdegående kendskab til

HTML og CSS. Ligeledes ligger der en visuel editor i siderne og bloggen, som gør at du ikke skal have

kendskab til HTML og CSS for at kunne betjene sitet.

Page 10: Projekt Rapport fra Herregruppen

Projektrapport

Side 9

For at tilpasse det valgte tema til kundens ønsker, har vi måtte lave en smule rettelser i php'en, for at

opnå vores designmål.

Vores logo tekst sammensat med DAV's eksisterende logo, er manipuleret i Photoshop, med flere

forslag til udseende, se bilag. Samme program er brugt til billedbehandling. Word og Excel er også

anvendt i processen under hele projektforløbet, til håndtering af opgavefordelinger og strukturering af

arbejdet, samt udarbejdelse af denne rapport og flowchart.

Fremtidig udvikling

Et af kundens ønsker var at der kunne etableres henholdsvis et dansk, portugisisk og engelsk sproget

website, målrettet de forskellige informations behov hos hver sproggruppe. Vi har indlagt mulighed

for at linke mellem de tre sites via flag ikoner i øverste højre hjørne af sitet. Vi har i den sammenhæng

fravalgt at benytte funktionen "Google translate" da vi ikke mener at denne funktion opfylder kundens

ønske om differentieret information. For at få et fuldt funktionsdygtigt site, vil en implementering af

det engelske og portugisiske site være krævet. Der er i samme område ligeledes indlagt ikoner for link

til kundens kommende Facebook og Twitter profil, som heller ikke er oprettet.

Da websitet er udviklet i et CMS eksisterer der uanede muligheder for udvidelse af funktionalitet og

design, i flæng kan nævnes forum, galleri, medlems kartotek, webshop, donations modul med mere.

Det er næsten kun fantasien der sætter grænsen for hvad der kan sættes op på websitet, den kan dog

ikke lave kaffe --- endnu.

Konklusion

Hvis vi sammenholder vores vision for udviklingen af et nyt website, er vi tilfredse med det endelige

resultat. De bærende ideer var at lave et website, der er overskueligt for brugeren og præsenterer

foreningens budskab på en enkelt og præcis måde. Det er vigtigt for os at sitet udstråler seriøsitet for

at underbygge foreningens troværdighed. Vi har anvendt et stilrent tema, der er bygget op omkring et

slideshow på forsiden, af billeder der illustrerer foreningens gøremål.

Det var et krav fra kunden at sitet skulle være let at vedligeholde. Dette er opnået med brug af

WordPress og det valgte tema, der giver mange muligheder for tilpasninger og opdateringer.

Selve processen har været inspirerende og sjov. Da den indledende høflighed var lagt til side, var der

et til tider meget passioneret samarbejde, hvor der dog hele tiden blev gået efter bolden. Opgaven har

også været en god måde at anvende den samlede viden vi har fået i løbet af kurset. Eksempelvis er det

rart at konstatere at vi uden problemer er i stand til at benytte vores nyerhvervede HTML-kundskaber

til at ændre i koden så vi kan opnå det resultat vi ønsker.

Ressourceforbruget har også været relativt beskedent:

1 jordbærtærte

2 gang morgenbrød med tebirkes

2 gange morgenmad med Molbosnegle

Page 11: Projekt Rapport fra Herregruppen

Projektrapport

Side 10

Bilag

Tidsplan

Aktivitet/Dato 29/02 1/3 2/3 5/3 6/3 7/3 8/3 9/3 12/3

Kundemøde

Foranalyse

Undersøgelse

Design

Realisering

Projektrapport

Milepæle:

Foranalyse afsluttet(>)

Undersøgelse afsluttet(>)

Design fastlagt(>)

Realisering afsluttet (>) 9.3.201211.3.2012

Projektrapport afleveret(>) 12.3.2012 kl.12

Forventet Slut

2.3.2012 kl.12

5.3.2012 kl.12

8.3.2012 kl.12

Realiseret slut

2.3.2012 kl 12

5.3.2012 kl. 12

10.3.2012

Mindmap

Page 12: Projekt Rapport fra Herregruppen

Projektrapport

Side 11

Indholdsdokument

Kontakt:

Bestyrelsesmedlemmer med billed

Mail/Adresse

Tlf#

Forside:

Samarbejdspartner (link+beskrivelse

Tilmelding(Link)

Nyhedsbrev(blog)

Opdateringsdato

Projekter:

Projekter i Angola

Projekter i Danmark

Engelsk:

Skabelon

Portugisisk:

Skabelon

Om DAV:

Historie

Introduktionsvideo

Presse

Tilmelding (Link)

Arkiv:

Referater

Regnskab

Rapporter

Angola:

Kort

Fakta

Links:

Samarbejdspartner

Sociale Medier

Tilmelding:

Tilmeldingsformular

Afmelding

Page 13: Projekt Rapport fra Herregruppen

Projektrapport

Side 12

Flowchart

Page 14: Projekt Rapport fra Herregruppen

Projektrapport

Side 13

Storyboard

Page 15: Projekt Rapport fra Herregruppen

Projektrapport

Side 14

Page 16: Projekt Rapport fra Herregruppen

Projektrapport

Side 15

Page 17: Projekt Rapport fra Herregruppen

Projektrapport

Side 16

Page 18: Projekt Rapport fra Herregruppen

Projektrapport

Side 17

Designmanual

Cms:

Wordpress ver. 3.3.1 (http://www.wordpress.org)

Wordpress Tema:

Chameleon ( Premium tema fra http://www.elegantthemes.com)

Font :

Nobile (http://www.google.com/webfonts/specimen/Nobile)

Farver :

Bagrunds teksttur website : Stone ( valgmulighed i Chameleon tema)

Bagrundsfrave website: #4c6140

Bagrundsfarve body: #ffffff (hvid)

Fontfarve header / footer : #393939

Fontfarve header /footer hover : #427d8b

Fontfarve header / footer valgt : #427d8b

Fontfarve featured slider: (hvid)

Fontfarve body: #878787

Fontfarve body overskrift #393939

Logo :

Page 19: Projekt Rapport fra Herregruppen

Projektrapport

Side 18

DAV_logo11.png

Der henvises iøvrigt til style.css for temaet Chameleon.

Skeletmål

130 px

360 px

206 px

95 px

791 px

1047 px

Header

Slideshow

Widget

Footer

Page 20: Projekt Rapport fra Herregruppen

Projektrapport

Side 19

Screenshot

Page 21: Projekt Rapport fra Herregruppen

Projektrapport

Side 20

Koderettelser

style.css

#et-social-icons { float: left; padding-top: 9px; padding-right: 20px;}

#et-social-icons a { padding-left: 3px;}

Rettes til:

#et-social-icons { float: left; padding-top: 5px; padding-right: 10px;}

#et-social-icons a { padding-left: 5px; opacity:0.3;}

#et-social-icons a:hover { padding-left: 5px; opacity:1.0;}

#footer-widgets { padding: 33px 48px 45px; }

Rettes til:

#footer-widgets { padding: 33px 48px 0; }

Dette tilføjet i bunden af footer sektion:

#current {color: #427d8b !important; font-weight: normal;}

#navmenu { float: right; padding-right: 30px; }

#navmenu ul { margin: 0; padding: 0; list-style-type: none; list-style-image: none; }

#navmenu li {display: inline; padding: 5px 10px 5px 10px}

Page 22: Projekt Rapport fra Herregruppen

Projektrapport

Side 21

#navmenu a {text-decoration:none; color: #393939; }

#navmenu a:hover {color: #427d8b; }

#likemenu { float: left; padding-left: 30px;}

#likemenu li {display: inline; padding: 0px 0px 0px 0px}

#content-area { padding: 45px 48px 60px; }

#services { margin-bottom: 40px; }

Rettes til:

#content-area { padding: 4px 48px 6px; }

#services { margin-bottom: 4px; }

Tilføjes nederst i bunden:

#featured {overflow: hidden !important;}

#left-area a {color: #427d8b !important;}

feature.php

<a href="<?php the_permalink(); ?>" class="readmore"><?php esc_html_e('Read

More', 'Chameleon'); ?></a>

Rettes til: Læs Mere

header.php

<li <?php if (is_home()) echo('class="current_page_item"') ?>><a href="<?php

bloginfo('url'); ?>"><?php esc_html_e('Home' ,'Chameleon') ?></a></li>

Rettes til: Forside

<?php show_page_menu($menuClass,false,false); ?>

<?php show_categories_menu($menuClass,false); ?>

Udkommenteres

<input type="text" value="<?php esc_attr_e(‘Search this site…’, 'Chameleon'); ?>"

name="s" id="searchinput" />

Rettes til: Søg på dette site

page.php

<?php get_template_part('includes/breadcrumbs'); ?>

Page 23: Projekt Rapport fra Herregruppen

Projektrapport

Side 22

Udkommenteres og <br /> tilføjes ovenover

page-full.php

<?php get_template_part('includes/breadcrumbs'); ?>

Udkommenteres og <br /> tilføjes ovenover

footer.php

<p id="copyright"><?php esc_html_e('Designed by ','Chameleon'); ?> <a

href="http://www.elegantthemes.com" title="Premium WordPress Themes">Elegant

WordPress Themes</a> | <?php esc_html_e('Powered by ','Chameleon'); ?> <a

href="http://www.wordpress.org">WordPress</a></p>

Hele denne linje udkommenteres

<div id="likemenu">

<div id="et-social-icons">

<ul>

<li><a><?php dd_fbshare_generate('Normal') ?></a></li>

<li><a><?php dd_google1_generate('Compact (20px)') ?></a></li>

</ul>

</div>

</div>

<div id="navmenu">

<ul><p><h5>

<li <?php if (is_page('Nyhedsbrev')) {echo " id=\"current\""; }?>><a

href="../wp/?cat=1">Nyhedsbrev</a></li>

<li <?php if (is_page('Links')) {echo " id=\"current\""; }?>><a

href="../wp/?page_id=12">Links</a></li>

<li <?php if (is_page('Arkiv')) {echo " id=\"current\""; }?>><a

href="../wp/?page_id=20">Arkiv</a></li>

<li <?php if (is_page('Tilmelding')) {echo " id=\"current\""; }?>><a

href="../wp/?page_id=436/">Tilmelding</a></li>

</p></h5></ul><br />

</div>

Dette kodestykke indsættes lige før:

</div> <!-- end #footer-content -->