vissenbjerg terrarium eksamensprojekt

31

Upload: helle-andersen

Post on 10-Mar-2016

216 views

Category:

Documents


0 download

DESCRIPTION

Projektrapport fra Helle og Bettina

TRANSCRIPT

Page 1: Vissenbjerg Terrarium eksamensprojekt
Page 2: Vissenbjerg Terrarium eksamensprojekt

Indholdsfortegnelse

Indledning 1

-Metode 1

Foranalyse 2

-Dataindsamling 2

-Tidsplan 2

-Projektbeskrivelse 2

Undersøgelsestrin 3

-Casebeskrivelse 3

-Testafeksisterendewebsite 3

-Målgruppe 6

-Markedsføring 7

-Ideudvikling 7

Designtrin 7

-Informationsdesign 7

-Interaktionsdesign 7

-Præsentationsdesign 8

-Grafiske virkemidler 8

-Komposition 8

-Logo 9

Designparametre 9

-Form 9

-Typografi 9

-Illustration 10

-Farver 10

Realiseringstrin 10

Konklusion 11

Bilag1:Tidsplan 12

Bilag2:Screendropsafdeteksisterendewebsite 13

Bilag3:Flowchartfordeteksisterendewebsite 16

Bilag4:Mindmapfordetnyewebsite 17

Bilag5:Flowchartfordetnyewebsite 19

Bilag 6: Diverse håndskitser for det nye website 20

Bilag7:Storyboardfordetnyewebsite 22

Bilag 8: Endeligt design af det nye website 23

Bilag9:Designprocesfordetnyelogo 24

Bilag 10: Designmanual 25

Bilag11:Screendropsafdetnyewebsite 26

Page 3: Vissenbjerg Terrarium eksamensprojekt

Indledning

Efter 6 ugers kursus i ’Multimedieteknologi og interaktionsdesign’ på Lillebælt Erhvervsakademi står nærværende opgave, som det endelige resultat af vores arbejde. På dette kursus er vi blevet introduceret forenheltnyverdenafHTML/CSSkoderogdesignafwebsitesm.m.,ogvieridengradblevetudfordretpåvores tekniske færdigheder. Kurset har bl.a. givet os kendskab til opsætning af brugervenlige CMS grænsef-lader, udvikling af websites og ikke mindst viden om grafisk design og virkemidler. Som afslutning på kurset har vi gennemført et projektarbejde, hvor vi er blevet givet muligheden for at demonstrere vores nytileg-nedekompetencer.

ProjektarbejdeterudvikletisamarbejdemellemgruppenogvoreskundeVissenbjergTerrarium,somharindvilligetiatværemedieksamensprojektet.VissenbjergTerrariumdeltagerunderforudsætningaf,atvioverholder krav om fuld fortrolighed af de oplyste informationer, og at vi ikke anvender billeder fra den eksisterende website til offentliggørelse, da terrariets webmaster har copyright på disse.Detskaldognævnes,atVissenbjergTerrariumikkeharudtryktønskeometnytwebsite,menderimoderyderst tilfredse, med det de har på nuværende tidspunkt. Formålet med denne eksamensopgave er der-for at udvikle et website, som muligvis kan inspirere Vissenbjerg Terrarium til at overveje et nyt design og struktur af deres website, som måske i højere grad kan skabe interaktion med deres interessenter.

Metode

Vi har valgt at anvende HOME-modellen1 som metode for vores opgave. HOME-modellen er en åben og helhedsorienteretmetode,derforløbergennem4udviklingsprocesser.Detværesig:forundersøgelse,undersøgelsestrin, design og realisering. De fire trin skaber en naturlig struktur for arbejdsprocessen. En af modellens styrker er dens åbenhed, som gør det muligt at tilpasse og anvende modellen i forskellige situ-ationer. Det kan være svært at forudsige, hvilke faktorer, der gør sig gældende for den specifikke kunde, og dermed giver HOME-modellen mulighed for at skabe et individuelt projektarbejde. Desuden er der fokus på at skabe helhed og kontinuitet for det færdige produkt, da hvert udviklingstrin fortløbende evalueres.

Under projektarbejdet fokuserer HOME-modellen på, at arbejdet fordeles på to forskellige aktiviteter. Detværesigprodukt,deromhandlerundersøgelse,designogrealiseringsamtproces,deromhandlerplanlægning,vurderingogregulering.Detervoresoverbevisning,atenløbendekorresponderingmellemprodukt- og procesaktiviteterne skaber de optimale rammer for at tilpasse og udvikle et samlet produkt. Dog skal det nævnes, at vi konstant har arbejdet sideløbende på både produkt og processiden i HOME-modellens fire udviklingstrin, og at det til tider kan være svært at adskille arbejdsprocesserne, da de er gensidigt afhængige.

1HOME står for Holistic, Open Multimedia development method 1/31

Page 4: Vissenbjerg Terrarium eksamensprojekt

Foranalyse

Dataindsamling

Som HOME-modellen angiver, indledes projektarbejde med en foranalyse, hvor vi forsøger at få et overblik over projektets forudsætninger. Først og fremmest skulle vi indsamle den nødvendige information for at kunneløseopgavenforkunden.Vistartedemedatundersøgeterrarietshjemmesideforatfåetindtrykaf,hvilket websitelayout de pt. er i besiddelse af, samt hvilke informationer vi kunne trække fra hjemmesiden. Dernæst udarbejdede vi spørgsmål til kunden om de informationer, vi havde brug for i udarbejdelse af et nyt website. Det være sig bl.a. info om målgruppe, samarbejdspartnere, holdning til nuværende website m.m.Torsdag den 26. maj 2011 tog vi på kundebesøg for at mødes med Klaus Dræby, der er direktør for terrariet. Han gav os en rundvisning på stedet og fortalte derefter detaljeret om terrariets organisation og daglige udfordringer. Vi fik mulighed for at stille spørgsmål og fik generelt en god fornemmelse af hvad det er for en kunde,viharmedatgøre.

Tidsplan

Foranalysen har også til hensigt at skabe et overblik over, hvor meget tid vi skal bruge på de forskellige udviklingstrin. Derfor har vi udarbejdet en tidsplan, som giver os en ide om, hvor meget tid vi skal bruge på projektet og evt. faktureres for. Tidsplanen er lavet bagudrettet. Dvs. ud fra den arbejdstid, vi har til rådighed,harvifordeltarbejdsopgavernepådeenkeltedagemedklarstrukturfor,hvilkeopgaverviskalløse dag for dag jf. bilag 1 ’Tidsplan’. Såfremt terrariet vælger at købe vores websitedesign, kan vi således dokumentere vores tidsforbrug og dermed fastsætte pris for vores arbejde.

Projektbeskrivelse

ProjektopgavenlyderpåatdesigneetwebsiteforVissenbjergTerrarium,somskalbeståaf3-4sider.Viudvikler en CMS brugergrænseflade i et Wordpress tema, som herefter implementeres i vores Wampserver for at kunne sætte sitet op i en browser. Slutteligt uploades projektrapporten på www.issuu.com i gruppen ’Multimediedesign og interaktionsteknologi 5411’, så den kan downloades for underviser og censor. Formålet med opgaven er at designe et website, som kan være inspiration til nytænkning af terrariets eksisterende website. Vi mener, at hjemmesiden i den grad er forældet og trænger til både nyt design og en større omstrukturering. Dog er terrariet af en anden overbevisning. De er meget tilfredse med deres hjemmeside og hævder at få yderst positiv respons fra deres brugere. Udfordringen bliver derfor at skabe et inspirerende website, som kan overbevise direktør Klaus Dræby om at etablere en mere nutidig, brugervenlig og salgsfremmende digital præsentation af Vissenbjerg Terrarium.

2/31

Page 5: Vissenbjerg Terrarium eksamensprojekt

Undersøgelsestrin

Casebeskrivelse

Vissenbjerg Terrarium er et mindre terrarium, der ligger godt 15 km fra Odense. Terrariet blev stiftet i 1973 på initiativ af Carl Aage Gram. Terrariets speciale er krybdyr og padder, og på hjemmesiden præsenterer terrariet sig som en ’specialzoo med en af Skandinaviens største samling af krybdyr, padder, insekter m.m.’. I dag ledes terrariet af direktør Klaus Dræby, som tiltrådte posten i 1992. Under sig har han 4-6 fastansatte plusnogleløsarbejdere.Klauserenstærkpioneråndindenforsitfelt.Hanharenklarmissionomatformidledyrslivinaturen.Derforerdetvæsentligtforhamatskabedemestnaturligeomgivelserforter-rarietsdyr.

Terrariets opgaver er mangeartede, og de arbejder ikke kun på lokalt plan. De bliver ofte kontaktet af private personer, som efterspørger gode råd om pasning og pleje af deres kæledyr.. Desuden har terrariet indgået en 24-7 aftale med politiet i Danmark om, at de gerne hjælper til med indfangelse af løsfarende dyr, som herefter indleveres som hittegods. I årenes løb har terrariet endvidere gjort sig særligt bemærket i internationale sammenhænge ved professionelt opdræt. De har bl.a. indgået samarbejde med Jersey Zoo i Polen,hvordevidendeleromdennyesteudviklingafopdræt.

For et års tid siden var terrariet lukningstruet og tæt på at dreje nøglen om efter 28 år. Terrariet har på intet tidspunkt modtaget støtte fra staten, men modtager dog hjælp fra Assens Kommune til de daglige driftsomkostninger. Dog valgte Assens Kommune sidste år at nedlægge den skoletjeneste, som hvert år indbringer 300.000 kr. til terrariet. Da Terrariet oprettede en vennegruppe på Facebook, fik de 12.000 tilmeldte fans, som efterfølgende donerede i alt 250.000 kr. til terrariet. Det var nok til, at de kunne fort-sætte endnu et år. Pt. er terrariets økonomi dog forsat ustabil, og fremtiden ser usikker ud.

TestafeksisterendewebsiteVissenbjerg Terrariums nuværende website findes på Websitet er blevet testet af projektgruppen. Vi har i nedenstående påpeget de relevante parametre, som vi finder problematiske. I bilag 2 findes samlede screen drops af de forskellige sider på websitet, som vi henviser til.

WrapperNårviklikkerindpåterrarietshjemmeside,kommerviindpåenside,derbyderbrugerenvelkommen.Der er tydeligvis problemer med indholdet i wrapperen idet det hele floater til venstre og således ikke er centreret på sitet. Det giver et ubalanceret visuelt indtryk jf. bilag 2.1 ’Velkomstside’. Når vi efterfølgende klikker rundt på de forskellige sider, centreres indholdet pludselig på siden ’Litteratur’ jf. bilag 2.4 ’Litteratur’.

Der er således ingen fast struktur, og dette er med til at forvirre læseren, og giver et samlet uprofessionelt indtrykafwebsitet.

3/31

Page 6: Vissenbjerg Terrarium eksamensprojekt

Farver

De valgte farver til hjemmesiden synes meget mørke og kolde. Velkomstsiden består af et baggrundsbillede medetclose-upbilledeafenslangeiblåogbrun/lillanuancer.

Baggrunden er sort. Jf. bilag 2 ’velkomst side’.

Sort #000

Mørkeblå #1C489F

Brun/lilla#9D666C

Medundtagelseafvelkomstsidenerdervalgtenfastbaggrundsfarveforhelesitet.

Mørkeblå #00446B

Sammenlagtsynesvalgaffarveratgivehjemmesidenetnogetkedeligtogdystertudtryk.Deteruheldigt,atdenmørkeblåbaggrundsfarvedominerersåmegetsomdengør.Visueltgiverdetenforvirrendeogrodetoplevelse for brugeren. Samtidig er brødtekst og alle overskrifter gjort hvide. Det får teksten til at stå frem fra baggrunden, men nedsænker samtidig brugeres læsehastighed pga. negativ skrift på en mørk baggrund jf. bilag 2.2 ’Forside’.

Header

Headeren består af et close-up billede af krybdyrs-struktur, heri indgår der hvid tekst og terrariets firben. Teksten er igen hvid på mørk baggrund, hvilket gøtr det svært at læse. Efter vores mening egner baggrundsbilledet sig ikke som en optimalt fungerende header, da valg af farver og mønstre ikke er i balance f.eks. er firbenet et meget primitivt animeret billede sat op på et foto; to skarpe kontraster der slet ikkematcher.

Vi antager, at terrariet ønsker firbenet som et kendetegn, da det går igen på både hjemmeside og brochure, men vi synes ikke, at det kan bruges som et logo hvis dette var hensigten. Vi har derfor designet et muligt logo jf. afsnit ’logo’ side 10.

Genereltfremstårheaderenforstyrrendeoguroligforøjet,ogtageraltformegetopmærksomhedfrarestenafsitet.

4/31

Page 7: Vissenbjerg Terrarium eksamensprojekt

Komposition

Forsidens komposition består af en header og 2 kolonner. Der er ingen navigationsbar eller footer. Den venstrekolonneindeholderenoversigtoverdesider,sombrugerenkanklikkeindpå.Dogforsvinderdenvenstre kolonne, når vi klikker ind på siderne ’Dyrene i terrariet’ og ’Galleri’. Hele navigationsstrukturen synes ikke særligt velfungerende jf. bilag 2.3 ’Galleri’.

Contentkolonnenindeholdertekstogbilleder.Dogsynesderendelpladsspild,daforsidenscontentbeståraf de samme sider fra venstre kolonne. Det medfører en meget lang scroll-funktion, hvor brugeren mister overblikket over sidens indhold, da der f.eks. ikke er gjort brug af nemme genveje i form af links til top eller kapitler.Sammeproblemopstårpåsidenforterrarietshistorie,hvorenmegetlangbrødtekstdominerersiden, og brugeren må scrolle sig frem til de sidste informationer. På forsiden opstår endvidere en del spildplads, da brødteksten floater til venstre men uden at udnytte kolonnens bredde.

Flowchart

Flowchartet for det eksisterende website må siges at være noget uoverskueligt. Der findes ikke mindre end 13sider,sombrugerenkanklikkeindpåfraforsiden.Mangeafsiderneindeholderknapsåmegetinformation, som nemt kunne slåes sammen. Der findes ingen undersider, men udelukkende ’forældre-sider’, strukturen må derfor betegnes som et meget fladt hierarki jf. bilag 3 ’Flowchart for eksisterende website’.Vi identificerer også adskillige problemer på de eksisterende sider. Når vi f.eks. åbner siden ’Miljøpolitik’ er der linket til et word-dokument i stedet for at lægge informationerne direkte på hjemmesiden jf. bilag 2.5 ’Miljøpolitik’.

Siden ’Dyrene i terrariet’ er i øvrigt identisk med siden ’Galleri’, men når vi åbner ’Dyrene i terrariet’ man-gler den mørkeblå baggrundsfarve pludselig, og siden fremstår i stedet med en hvid baggrund. Jf. bilag 2.3 ’Galleri’.

5/31

Page 8: Vissenbjerg Terrarium eksamensprojekt

Sammenfatning

Genereltfremstårterrarietswebsitesomuoverskueligt,dystertogikkesærligbrugervenligt.Detersværtat finde vej rundt på websitets mange sider, og som bruger mister man nærmest pusten med de lange scroll-funktioner. Design og layout skaber efter vores mening ikke ligefrem et flatterende billede af terrariet, og websitets visuelle elementer taler slet ikke til terrariets fordel, da der f.eks. er mangel på både logo og slogan.Desudenerviitvivlom,hvilkenmålgruppeterrarietønskeratkommunikeremedviadereswebsite.

Detskaldognævnes,atterrarietfårpluspointpåindholdssiden.Terrarietharenspændendehistorieatfortælle,ogderliggernoglegodeaktuellenyhederfradesenesteevents.Desudenharhjemmesidennoglerigtigt flotte billeder af terrariets dyr. Der synes rigeligt af indhold og gode billeder, der kan bruges i kommu-nikationen omkring terrariet, og det vil vi drage fordele af i udviklingen af det nye website.

Det er vores ambition, at det nye website skal opfylde følgende punkter:

•Mere overskueligt og brugervenligt flowchart, så brugeren hurtigt kan finde de nødvendige infor mationer indenfor 3 klik med musen.

•Centreretindhold,somerimmunoverforhvilkenbrowser,websitetåbnesi.

• Et lysere og mere imødekommende valg af farver, der dog afspejler de naturlige omgivelser for

terrarietsdyr.

•Stærktvisueltlayout,sådetbliverenspændendeoplevelseatbesøgewebsitet.

•Skabeetmerebørnevenligtlayout.

• Flere nyhedsrubrikker på forsiden så som ’appetitvækkere’, som hurtigt kan fange brugerens

interesse f.eks. ’Månedens Dyr’ og fortællinger/beretninger fra besøgende gæster.

• Fast footer og navigationsbar under header, som ikke ændres, uanset hvilken side brugeren står

på.

•Udviklingafgenkendeligtlogoogcatchyslogan.

•StørreeksponeringafterrarietsdirektørKlausDræby.

Målgruppe

Terrarietsprimæremålgruppebestårafbørnefamilierogturister.Dogmodtagerterrarietogsåendel

skolegrupper, der benytter sig af skoletjenesten, hvor skolen kan booke en biolog, og eleverne kan få under-

visningiterrarietslokaler.Dogerskoletjenestenpt.nedlagt.Terrariethardesudenendelfastegæstermed

årskort.

6/31

Page 9: Vissenbjerg Terrarium eksamensprojekt

Markedsføring

Pt. bruger terrariet 55.000 kr. om året på markedsføring. Det består af en pakkeløsning fra ’Det Gule

Kontor’, hvor terrariet får trykt annoncer i et samlet katalog for turistattraktioner på Fyn. De får lavet en

brochure, som uddeles i lokalområdet f.eks. i dagligvarebutikker.

Det skal nævnes, at det ikke virker som om Klaus Dræby tildeler hjemmesiden særlig stor markedsførings-

værdi, hvorfor driftomkostninger til denne er nedprioriteret. Hjemmesiden har primært funktion af at

formidle de mest nødvendige informationer, hvor muligheden for at tiltrække nye gæster via hjemmesiden

ikke ses som en værdifuld kommunikationskanal. Efter vores mening er dette rigtig ærgerligt, da et

velfungerende og inspirende website er alfa omega for at tiltrække nye gæster. Vi ser et godt website som

en rigtig vigtig del af en virksomheds markedsføring.

Ideudvikling

Påbaggrundafovenståendedataindsamlingogtestafterrarietseksisterendewebsiteharvibrugtenstordel af vores tid på at udvikle og planlægge vores idé til et nyt website. Vores idéudvikling illustreres via et mindmap, hvor vi først og fremmest samler alle vores idéer til projektet jf. bilag 4 ’Mindmap for det nye website’. Mindmap danner det spæde fundament for vores website. Der foretages efterfølgende på baggrund af mindmap en udviklingsprocess med yderligere tilvalg og fravalg.

Designtrin

Informationsdesign

Det primære ønske er at gøre det nye website langt mere appetitligt og overskueligt. Det skal være mere børnevenligtogderforlangtmerevisuelt.Viharderforvalgtatminimereitekstogprioriterebillederogfaktuelleogaktuelleoplysninger.Viønskeratskabedenpersonligedirektekontaktmellemafsenderogmodtager. Klaus Dræby får derfor en mere fremtrædende rolle som velkomsttager på forsiden, som skal afspejle den hyggelige og personlige atmosfære i terrariet. Vigtige informationer som f.eks. åbningstider har ogsåfåetenlangtmerefremtrædenderolle,ogerderforplaceretifastlåstewidgetsihøjrekolonne.Vi har valgt at lægge vægt på oplevelsesrige nyhedselementer som skal fungere som appetitvækkere; f.eks. månedensdyrogpersonligeberetningerfrabesøgendegæster.

Interaktionsdesign

Foratgørewebsitetmerebrugervenligt,harviigruppenforsøgtatskabeenmereoverskueligoggen-nemsigtig struktur. Gruppens primære mission er at skabe et website, der har en mere hierakisk infor-mationsopbygning . Vi minimere antallet af menupunkter og søger i stedet at gøre brug af forældresider meddrop-downmenuer.Viønskerenfastlåstmenubar,somerdensammeforallesiderligegyldigthvorbrugeren befinder sig. Det medvirker til en effektiv navigation rundt på sitet, som samtidig gør det lettere at indhente den nødvendige information nemt og hurtigt. Vi har foretaget en kategorisering af indholdet i en prioteret rækkefølge af 8 forskellige menupunkter, der gerne i sidste ende skulle give brugeren en mere positiv oplevelse af terrariets website, og øge brugerens interaktion. Jf. bilag 5 ’Flowchart for det nye website’.

7/31

Page 10: Vissenbjerg Terrarium eksamensprojekt

Præsentationsdesign

I bilag 6 ’Diverse håndskitser for det nye website’ og 7 ’Storyboard for det nye website’ vises forskellige layoutskitsersomvihararbejdetpå,foratudvikledetendeligstorybordogdesignforwebsitet.Viharsøgtat imødekomme ovenstående ambitioner om at skabe en mere brugervenlig struktur. Bilag 8 ’Endeligt design af det nye website’ viser det endelige valg af website, som vi tænker det skal se ud; stadigvæk på storyboardplan.

Hele websitet er opbygget efter en meget simpel og overskuelig brugergrænseflade. Vi har en fast header, menubar, en content kolonne, en højrestillet kolonne og en footer.

•Headerindeholderetvisueltvelfungerendebaggrundsbillede,detnyelogoogslogan. • Menubaren indeholder i alt 8 kategoriserede menupunkter med drop-down menuer. • Content indeholder den valgte sides indhold og ændres således hele tiden. • Højre kolonne indeholder faste widgets med faktuelle informationer. •Footerindeholderterrarietsadresseogtelefonnummer.

Som før nævnt indgår header, højre kolonne og footer i den fastlåste struktur og er tilgængelig og synlig på alle sider uanset hvor brugeren befinder sig. Det er således kun content, der skifter indhold, alt efter hvor brugerenvælgeratklikkesigind.

Grafiske virkemidler

Komposition

Vi har taget udgangspunkt i AIDA med omtanke for øjets naturlige bevægelsesflow, når det skal indsamle

ny information. Brugerens opmærksomhed fanges først øverst i venstre hjørne. Vi har derfor valgt at have

terrariets logo placeret der. Brugeren kan således hurtigt gøre sig bevidst om afsender. Terrariets nye slogan

er med til at fange brugerens interesse med en hurtig catchfrase. Derefter ledes opmærksomheden til klaus

og den personlig kontakt midt på siden og herefter ud til højre kolonne med de vigtige informationer så

som åbningstider osv. Øjets bevægelse slutter nederst i højre hjørne hvor vores appetitvækkere skal ende

ud i brugerens interaktion. Samlet set skal denne opbygning skabe lyst hos brugeren om et endeligt besøg

påterrariet.

8/31

Page 11: Vissenbjerg Terrarium eksamensprojekt

Logo

Vi ønsker et logo, der først og fermmest giver et klart billede af, hvem afsender er. Det skal samtidig være et sjovt og interessefangende logo. Vi har derfor valgt at gøre brug af både informativ tekst med afsender, slogan og et illustrativt billede i stærke farver. Jf.’ bilag 9 ’Designproces af det nye logo’.

Detendeligelogosersåledesud:

Designparametre

FormWebsitet er lavet i et fast bredde på 955px for at tage højde for brugere med forskellige skærmopløsninger. Scroll-funktionen træder i kræft pga. vores udvalgte Wordpress tema. På længere sigt ville dette være et punkt,derskulleudbedresforatgøredetmerebrugervenligt.

Typografi

Temaets indstillinger angiver oprindeligt Arial som font i brødteksten:Arial, 14px:

Her er et eksempel på en skrifttype…

Efter vores mening synes fonten en smule kedelig og rund i det. Derfor har vi eksperimenteret med en mere tiltalende skrifttype jf. bilag 10 ’Designmanual’.

Som resultat har vi ændret fonten således, at brødtekst, overskrifter og menupunkter i stedet bliver verdana. Brødteksten er str. 14px, menupunkter 20px og overskrifter 24px. Fonten verdana er god til skærmlæsning, hvor brugerens læsehastighed er nedsat med 1/3. Fonten verdana er en ren uden seriffer, hvilketgøratordeneernemmeatlæse.

Vissenbjerg

Terrarium- en dyrerig oplevelse!

9/31

Page 12: Vissenbjerg Terrarium eksamensprojekt

Illustration

Med hensyn til illustrationer har vi valgt at fokusere på brugen af nogle flotte farverige fotos af terrariets dyr.Viharbl.a.brugtbillederfrahjemmesidenogegnefotos.Billederneeralleklareogstærkefarver,derkomplimentererhinanden.

Til logoet har vi klippet en frø ind i navn og slogan, der tilsammen skaber et stærkt visuelt udtryk.

Farver

Foratimødekommedenaturligeomgivelserforterrarietsdyrharvisøgtatintegreredisseiwebsitetsfarvevalg. Vi har gjort tanker omkring farvevalg udfra det kriterie, at det skulle associere til regnskov eller jordbundsfarver. Den originale tekstfarve for overskrifter er

Mørkebrun #603913

Vi har forsgt at udskifte overskrifter i lysere brune nuancer og grønne farver jf. bilag 10 ’Designmanual’,

men har i sidste ende besluttet at fastholde den mørkebrune farve til overskrifter.

Brødteksten var oprindelig sort, den har vi valgt at ændre til mørkebrun, så den er identisk med

overskrifterne. Den mørkebrune farve skaber god kontrast til den hvide baggrund i headeren, så det øger

læsevenligheden.

Realiseringstrin

På baggrund af det udviklede storyboard, flowchart og illustrationer af websitets design har vi valgt et Wordpress tema, der imødekommer vores ambitioner for det ønskede design og layout. Det valgte tema har vi efterfølgende finjusteret for så vidt muligt at tilpasse det vores vision. Vi har udviklet en forside og 4 sider til websitet 2 som kan ses som screendrops i bilag 11 ’Screen drops af det nye website’.

2Vi har kun vedhæftet screen drops af forsiden + 3 sider, da vores 4 side ”historie” ville være for lang at indsætte.

10/31

Page 13: Vissenbjerg Terrarium eksamensprojekt

Konklusion

Formålet med projektet har været at opnå forståelse for og kendskab til de arbejdsprocesgange der indgår i opsætningen af et nyt website. Vi har gennemgået en lang og udfordrende proces fra idéudvikling, over skitse til realisering. Vi har udviklet et website, som efter vores mening opfylder de behov som Vissenbjerg Terrarium har for et mere nutidigt, brugervenligt og salgsfremmende design. Vi har arbejdet ud fra en realistisk vurdering om, at terrariet i den grad har brug for større markedsføring, idet de stadig står i en usikker økonomisk situation.

Dog har projektet ikke været 100% realistisk, da Klaus Dræby tydeligt har udtrykt, at han ikke ønsker et nyt website og er yderst tilfreds med det eksisterende. På trods af modstand fra kunden håber vi, at Vissenbjerg Terrarium kan blive inspireret til at nytænke deres website. I løbet af projektet er vi stødt på adskillige tekniske udfordringer, idet valg af et specifikt tema i Wordpress både har fordele og ulemper. Vi har ikke været i stand til 100% at imødekomme vores ambitioner og ud-viklede storyboard, men har måtte gå på kompromis med mindre designmæssige detaljer. Omvendt har vi fundet inspiration til f.eks. at flytte menubaren i det valgte tema. Vi har brugt en stor del af tiden til at analysere det eksisterende website og udvikle en idé, der kunne forbedre dette. En stor udfordring har bl.a. været at omstrukturere sitets flowchart og kategorisere indholdet i nogle mere overskuelige menupunkter. Samlet set er vi godt tilfredse med det endelige resultat, som vi mener i langt højere grad appellerer til ter-rariets primære målgruppe.

Websitet er udarbejdet i et gensidigt og velfungerende samarbejde mellem gruppens medlemmer :)

11/31

Page 14: Vissenbjerg Terrarium eksamensprojekt

Bilag 1: Tidsplan

Timeforbrug i alt: 9 dage à 7 arbejdstimer = 63 timer.

12/31

Page 15: Vissenbjerg Terrarium eksamensprojekt

Bilag 2: Screendrops af det eksisterende website

2.1 Velkomstside

2.2 Forside

13/31

Page 16: Vissenbjerg Terrarium eksamensprojekt

2.3 Galleri

2.4 Litteratur

14/31

Page 17: Vissenbjerg Terrarium eksamensprojekt

2.5 Miljøpolitik

15

Page 18: Vissenbjerg Terrarium eksamensprojekt

Bilag 3: Flowchart for det eksisterende website

16/31

Page 19: Vissenbjerg Terrarium eksamensprojekt

Bilag 4: Mindmap for det nye website

17/31

Page 20: Vissenbjerg Terrarium eksamensprojekt

Bilag 4: Mindmap af designet for det nye website

18/31

Page 21: Vissenbjerg Terrarium eksamensprojekt

Bilag 5: Flowchart for det nye website

19/31

Page 22: Vissenbjerg Terrarium eksamensprojekt

Bilag 6: Diverse håndskitser for det nye website

20/31

Page 23: Vissenbjerg Terrarium eksamensprojekt

21/31

Page 24: Vissenbjerg Terrarium eksamensprojekt

Bilag 7: Storyboard for nyt website

22/31

Page 25: Vissenbjerg Terrarium eksamensprojekt

Bilag 8: Endeligt design af det nye website (storyboard)

23/31

Page 26: Vissenbjerg Terrarium eksamensprojekt

Bilag 9: Designproces for det nye logo

24/31

Page 27: Vissenbjerg Terrarium eksamensprojekt

Bilag 10: Designmanual

Font

Arial, 14px:

Her er et eksempel på en skrifttype…

Verdana, 20px

Her er et eksempel på en skrifttype…

Calibri, 20px

Her er et eksempel på en skrifttype…

Broadway, 14px

Her er et eksempel på en skrifttype…

Skriftfarve Brun #3C270D

Lysebrun #553713

Meget lys brun #984806

Lysegrøn #00CC00

Grøn #8DC77D

Grålig grøn #4F6228

25/31

Page 28: Vissenbjerg Terrarium eksamensprojekt

Bilag 11: Screen drops af nyt website

Forsiden

26/31

Page 29: Vissenbjerg Terrarium eksamensprojekt

Kontakt

27/31

Page 30: Vissenbjerg Terrarium eksamensprojekt

Priser

28/31

Page 31: Vissenbjerg Terrarium eksamensprojekt

Book en biolog

29/31