odder museum

Multimedieteknologi og interaktionsdesign

WEBSITE TIL ODDER MUSEUM December 2009

Udarbejdet af:

Claus Bolther Rasmussen

Lise Dahl Jørgensen

Maria Winther Kristensen

Mette Petersen

1

Indholdsfortegnelse

Indledning .............................................................................................................. 2 Metode ..................................................................................................................... 2 FORANALYSE ......................................................................................................... 3 Projektbeskrivelse .............................................................................................. 3

UNDERSØGELSESTRIN ....................................................................................... 3 Afsender ................................................................................................................. 4

Museets ønsker ........................................................................................................... 4 Test af eksisterende website ........................................................................... 5 Målgruppe .............................................................................................................. 6 Budskab .................................................................................................................. 8

DESIGNTRIN .......................................................................................................... 8 Informationsdesign ............................................................................................ 8 Interaktionsdesign ............................................................................................. 8 Præsentationsdesign ......................................................................................... 9 Grafiske virkemidler ........................................................................................ 10

Komposition ...............................................................................................................10 Stil og stemning .........................................................................................................10

Grafiske designparametre ............................................................................. 10

Format ...........................................................................................................................10 Farver ............................................................................................................................10 Illustration ...................................................................................................................11 Typografi ......................................................................................................................11

REALISERINGSTRIN .......................................................................................... 11 Anvendt teknologi ............................................................................................. 11 Kvalitetsvurdering/konklusion ................................................................... 11

BILAG 1. Tidsplan

2. Mindmaps

3. Skitseproces

4. Eksisterende flowchart

5. Nyt flowchart

6. Storyboard

7. Skelet

8. Designmanual

2

Indledning

Efter seks ugers kursus i multimedieteknologi og interaktionsdesign lød opgaven på at

producere et website for Odder Museum, der i højere grad end det eksisterende site

præsenterer museet som en moderne formidler af egnens kulturhistorie. Dette var det

overordnede udgangspunkt – ingen specifikke krav til farver og layout eller om genbrug

af eksisterende designelementer – blot en håndfuld ønsker, primært relateret til sitets

indhold. På den ene side en enestående mulighed for på ny at opfinde den dybe

tallerken; på den anden side en relativ stor udfordring i at fokusere projektet. Denne

dobbelthed i opgavens karakter har givet anledning til såvel fornøjelse som til

frustration i processen, men frem for alt har den været generator for et fantastisk

engageret og dynamisk gruppearbejde.

Det udviklede site kan findes på:

http://www.multimediekursus.dk/1au0946multi/claus/wp/

For at illustrere bredden af det udviklede layout, har vi valgt at detaljere følgende sider:

Forside:

http://www.multimediekursus.dk/1au0946multi/claus/wp/

Mølleri:

http://www.multimediekursus.dk/1au0946multi/claus/wp/?page_id=172

Kalender:


Blog:


Metode

Projektet er grebet an efter HOME-metoden (Holistic, Open Multimedia development

Method)1, som er en helhedsorienteret og åben metode til udvikling af multimedier, der

vægter såvel procesforløb som produkt. Idéen med metoden er, at hvert skridt i

processen fortløbende evalueres i forhold til den samlede opgave, hvorved der skabes

1 Metoden er mere udførligt beskrevet i Christensen & Fischer: Udvikling af multimedier 2003.

3

størst mulig helhed og kontinuitet i det færdige produkt. HOME-metoden består af fire

overordnede principper: Foranalyse, undersøgelsestrin, designtrin og realiseringstrin.

Disse principper benyttes i de følgende afsnit til at præsentere det aktuelle projekt.

FORANALYSE

Foranalysen består af en overordnet definition af projektet og forskellige former for

indledende research. Vi indledte projektet med et kundebesøg på Odder Museum, hvor

vi via dialog med museumsleder Klaus Markmann Jensen forsøgte at indkredse museets

krav og ønsker til websitet. Vi erhvervede ved den lejlighed inspirationsmateriale i form

af fotos og informationsfoldere fra museet. På baggrund af kundebesøget foretog vi en

brainstorm samt en nærmere definition af målgruppen. Derudover diskussion af

udviklingsmetode, hvor valget som nævnt faldt på HOME-metoden. Vi udviklede

desuden en overordnet tidsplan, som i løbet af processen blev specificeret med konkrete

arbejdsopgaver (se tidsplan i Bilag 1 og mindmaps i Bilag 2).

Projektbeskrivelse Opgaven er at designe et website for Odder Museum; et meget lokalt forankret

kulturhistorisk museum, der ønsker at tiltrække flere besøgende fra især det yngre

segment (35+) og fra en større geografisk radius. Samtidig vil de gerne fastholde det

eksisterende trofaste og lokale publikum (50+). Websitet skal være visuelt stærkt og

overskueligt samt med et design, der vil kunne skabe en forbindelse mellem det lille

lokale museum og det segment, der frem for alt vægter oplevelsespotentialet i besøget.

UNDERSØGELSESTRIN

Research samt idé- og konceptudvikling er et punkt, der i gruppen er brugt meget tid på.

Ved hjælp af en række skitser af hhv. storyboards og flowcharts, der løbende er blevet

diskuteret og redigeret, er gruppen nået frem til hvilket design og struktur, der er mest

relevant i forhold til det, museet gerne vil signalere og formidle (se skitseeksempler i

Bilag 3). I processen har vi været omkring flere mere eller mindre færdige bud på

websites, som vi af forskellige grunde har forkastet igen, enten fordi håndskitserne ikke

fungerede optimalt når de kom op på skærmen, strukturen viste sig at være for

4

kompleks, eller noget helt tredje. Først og fremmest er der i denne fase brugt meget tid

på at definere budskab, afsender og målgruppe, samt overvejelser om det eksisterende

website og museets ønsker til det nye design.

Afsender Odder Museum er et lokalt og kulturhistorisk museum, der beskæftiger sig med nyere

tids historie med særlig fokus på landskabets historiske forandring i og omkring Odder.

Museet startede som forening i 1928 ud fra et ønske om at bevare den lokale kultur og

historie, og først i 1970’erne blev et egentligt museum til. Det har i dag ca. 10.000

besøgende om året og er med sine 8 ansatte et relativt lille museum. Museet består af

Sandager Mølle, en vand- og dampmølle, der oprindeligt fungerede på stedet, og som i

dag dokumenterer møllerens arbejde; Bjørnkær-sættet, møllerens stuehus, med

tekstilsamling på 1. sal samt en større jagtvåbensamling udstillet i montre. Dertil

kommer Museumsskibet Anna, en tidligere ålekvase, der nu fungerer som sejlende

museum med guide og lokale fortællere. Skibet er, sammen med en lang række af

arrangementer, der spænder over alt fra ud-i-naturen aktiviteter over markedsdage til

ølsmagning og foredrag, et væsentligt trækplaster.

Museets ønsker Der er et ønske om i fremtiden at skabe en større opmærksomhed omkring de

permanente udstillinger vha. digitale fornyelser. På det eksisterende website hedder det

bl.a.: ”Vi vil kendes som det museum, der har de mest spændende og utraditionelle

formidlingsmetoder i landet” (www.oddermuseum.dk); en vision, der er i fin

overensstemmelse med de ønsker, som museumsleder Klaus Markmann Jensen

fremlagde på det indledende kundemøde. Det eksisterende site er utidssvarende,

teksttungt og har en ret uigennemskuelig struktur; det nye site skal signalere moderne

kulturformidling på en ny og spændende måde og fungere som et udstillingsvindue, der

kan trække flere og nye kunder til. Vores opgave er således at designe et website, der på

en mere interessant og brugervenlig måde formidler bredden af Odder Museums mange

tilbud. Til opgaven har vi næsten fået frie rammer, dog har museet fremsat følgende

ønsker:

o Et æstetisk gennemarbejdet layout

o Flot og kvalitativt budskab

o Bedre præsentation af arrangementer

5

o Alternativ menuopsætning

o Blogfunktion

o Bedre præsentation af ansatte

o Udnyttelse af museets billedarkiv

o Enkel at vedligeholde og opdatere

Dertil er vi af Klaus Markmann Jensen blevet præsenteret for to websites til inspiration

(hhv. www.dauphine.dk & www.kvorning.dk).

Test af eksisterende website Odder Museums eksisterende website (www.oddermuseum.dk) er blevet analyseret og

testet af projektgruppen. Formålet var at finde frem til eventuelle problemer og

muligheder for forbedringer i forhold til brugeroplevelse, som kan løses i re-designet af

sitet. Desuden hvilke gode elementer man kan videreføre til re-design.

Sitet er testet i forhold til hvilken oplevelse en ny bruger får, i forhold til dennes

forventninger. Alle gruppemedlemmer har ageret brugere og en uvildig person er blevet

observeret via en tænke-højt-test. Følgende problemer blev identificeret:

Overordnet layout

o Ubalance og pladsspild i header

Store billeder og meget tekst, opstillet vertikalt nødvendiggør megen brug af

scroll funktion

o Lange tekstafsnit bevirker manglende overblik

o Manglende konsekvens i anvendt typografi til overskrifter og underoverskrifter

Forside

o Skaber ikke et klart overblik eller indtryk af, hvad Odder Museum dækker over

(Dette fremgår heller ikke tydeligt under museets profil)

Navigations-menu

o Ved klik på menupunkter kommer der kun en undermenu frem – ingen ændring i

sideindhold, hvilket virker modsat forventning.

6

o Navngivningen af menupunkter er ikke overensstemmende med underordnet

indhold (Man finder ikke hvad man forventer)

o Ulogisk rækkefølge af undermenupunkter

o Menupunkter og tekstindhold er for ens typografisk (det fremgår ikke tydeligt,

hvad der fungerer som links)

Flowchart

o Flad og ulogisk hierarkisk opbygning med uhensigtsmæssigt mange sider. (se

eksisterende flowchart, Bilag 4)

Følgende positive elementer blev identificeret:

Generelt

o Aktuelle begivenheder kan ses på forsiden

o Åbningstider på alle sider (dog med ulogisk formulering)

o Kontaktinformation på alle sider (dog skal der ofte scrolles for at se footer)

Målgruppe Museets primære brugere er i dag, iflg. museets beretning for 2008, børn under 14 år og

voksne af begge køn i alderen 30 til 70 år. Museumslederen ønsker at hjemmesiden

primært skal henvende sig til dansktalende brugere i voksensegmentet, hvor man gerne

vil tiltrække flere gæster under 50. Museets publikum er primært lokale, men der

kommer også turister og besøgende fra Århusområdet. Man har et ønske om at tiltrække

flere turister og besøgende fra et større opland men er dog ikke klar til at medtage

udenlandske turister i målgruppen.

Vi har diskuteret hvorvidt vi skulle benytte Steve Mulders teori om Personas2 til støtte

for en nærmere identifikation af museets målgrupper. Betegnelsen dækker over en

række af fiktive brugere, der hver for sig udgør arketyper og tilsammen repræsenterer

bredden i målgruppen. Personas bør imidlertid udvikles på baggrund af f.eks.

brugerinterviews, hvilket vi har valgt at nedprioritere på grund af den stramme tidsplan.

I stedet har vi valgt at definere målgruppen baseret på vores egen tolkning af segmenter,

2 Mulder, Steve: The User Is Always Right 2007

7

dels ud fra museets nuværende kunder, dels ud fra dets ønske om at nå nye segmenter,

hvilket er forsøgt illustreret med følgende opdeling:

Den traditionelle gæst:

o Lokal og trofast besøgende, 50+

o Godt kendskab til museet og til de nuværende formidlingsmetoder

o Meget interesseret i lokalhistorie

o Let it-kendskab, evt. svagtseende

o Krav: Viden om (special)arrangementer, pris tid, tilmelding. Ville være

interesseret i blog og nyhedsbrev

Udefrakommende oplevelsessøgende

o 35+. F.eks. børnefamilier, er på arbejdsmarkedet.

o Ringe eller intet kendskab til museet

o It-kendskab på relativt højt niveau

o Krav: Oplevelsesorienteret, Viden om (special)arrangementer og udstillinger,

hvad sker der i weekenden/ferien, pris, tilmelding, åbningstider. Hvor ligger det?

Hvordan kommer man dertil? Er det børneorienteret?

Virksomheder/Skoler/Institutioner:

o Ønsker at besøge museet

o Krav: Hvad kan museet tilbyde af skræddersyede arrangementer?

Ud fra disse tre segmenter, har vi valgt at fokusere særligt på de faste besøgende og på

de potentielle besøgende fra oplandet, idet disse giver et fint billede af bredden i den

målgruppe, museet ønsker at henvende sig til, og fordi brugermålet for de to grupper på

en række punkter strider i mod i hinanden. F.eks. skal det nye website kunne konkurrere

med lignende seværdigheder så langt væk som Århus for at kunne påkalde sig

potentielle besøgendes opmærksomhed, samtidig med at sitet opretholder de lokales

engagement og interesse, som er en vigtig del af museets eksistensgrundlag.

8

Budskab Odder Museum er en moderne kulturformidler med et spændende udbud af udstillinger

og aktiviteter.

DESIGNTRIN

Det endelige design af indhold, struktur og form på websitet er også en proces vi i

gruppen har brugt meget energi på. På baggrund af vores skitser har vi designet

websitets brugerflader i samspil med dets flowchart. I det følgende beskrives og

begrundes de forskellige faser i hhv. informations-, interaktions- og

præsentationsdesign, samt de grafiske virkemidler, der er valgt vedrørende komposition,

samt stil og stemning.

Informationsdesign Informationsdesign henviser til informationen på sitets placering og betydning. På

Odder Museum er museets tilbud det primære, dvs. udstillingerne og de forskellige

aktiviteter; med andre ord oplevelser eller underholdning. I sådanne tilfælde er skreven

information sekundært i forhold til stil og stemning på sitet, hvorfor vi også har

nedprioriteret tekst, for at give plads til billeder og derigennem fastholde et enkelt og

rent udtryk. Selvom information er sekundært i første omgang, er det selvfølgelig langt

fra irrelevant. Det er yderst vigtigt, at den rette information er let tilgængeligt og logisk

opbygget. Menuerne er derfor designet med tanke på de målgruppesegmenter vi har

defineret i vores undersøgelsestrin. Vi har forsøgt at tilgodese både traditionelle og nye

brugere, hvorfor flere irrelevante elementer fra det eksisterende site er fravalgt, og nye

er tilføjet.

Interaktionsdesign Interaktionsdesign beskriver, hvordan brugeren interagerer med websitet. Der er ud fra

de definerede målgruppesegmenter udarbejdet et flowchart for sitet (se nyt flowchart,

Bilag 5). Her er der overvejet, hvordan brugerne med færrest mulige klik kan finde frem

til de informationer, de ønsker. For at bevare overskueligheden og spare klik frem og

tilbage er det kun forsiden og bloggen, hvor et klik på menuknappen sender brugeren

videre til en faktisk side. De resterende menuknapper udløser en dropdownmenu,

9

hvorfra man kan klikke sig ind på præcis de oplysninger man ønsker. F.eks. kan man

under menuknappen Aktiviteter klikke sig ind på Museumsskibet Anna eller Historisk

Kajaksejlads. Under Udstillinger linkes der direkte til alle udstillinger og samlinger via

dropdownmenuen, som her udvides med endnu et niveau. Her kan man både vælge at

klikke på ”særudstillinger” eller ”museets samlinger” hvorpå der kommer en side frem

med en linkliste samt kort beskrivelse af hvert emne, hvorfra man kan klikke videre til

den udstilling man ønsker at se. Man kan også komme direkte til den specifikke

udstilling via det ekstra niveau i dropdownmenuen.

Dropdownmenuen er valgt pga. sit enkle udtryk, og fordi man kan komme fra alle sider

til hverandre, mens hierarkiet stadig er afspejlet. Det gør det forholdsvis nemt for

brugeren at orientere sig på sitet. Direkte links i dropdownmenuen er illustreret ved

invertering ved hover, hvor den blågrønne knap skifter til hvid, og teksten modsat

skifter til blågrøn.

Præsentationsdesign Her konkretiseres information og interaktion eller med andre ord: her bliver indhold og

struktur kommunikeret og oplevet. På baggrund af de storyboards og layoutskitser, vi

har udfærdiget i processen ved hjælp af hhv. analog skitsering og Photoshop/InDesign,

udvikles nu det endelige storyboards (se storyboard i Bilag 6).

Websitets forside består af et banner/header med museets navn samt åbningstider, en

vandret menubar med dropdownmenuer og en footer med kontaktinformationer Alt

sammen i samme støvede blågrønne farve, med hvid tekst i Times New Roman. Disse

elementer går igen på alle sider, og er således faste elementer. Herunder er forsiden delt

vertikalt i hhv. en tredjedel og to tredjedele. Den smalle spalte er placeret til venstre og

viser aktuelle tilbud, udstillinger og aktiviteter på museet. Dette er illustreret med to

billeder placeret vertikalt ovenpå hinanden, indeholdende en bjælke forneden i samme

blågrønne farve som header og footer. Disse fungerer som links direkte til de omtalte

aktuelle tilbud. I den brede spalte findes en beskrivelse af museet og herunder tre

stemningsbilleder fra museet, for at vise bredden af museet som rummer både

traditionelle museumsudstillinger, udflugter ud i naturen samt sejlture på vandet.

10

Websitets undersider er bygget op over samme koncept, hvor header, footer og menu

går igen og ligeledes de to spalter på hhv. en tredjedel og to tredjedele. På undersiden

om museets mølle består højre spalte f.eks. af billeder fra møllen, mens venstre spalte

indeholder en beskrivelse af møllen (se også skelet, Bilag 7).

Grafiske virkemidler Komposition For at få funktion, æstetik og teknik til at gå op i en højere enhed har vi efterstræbt en

enkel og overskuelig struktur, der tydeligt illustrerer både museets helhed og bredde.

Det visuelle udtryk er holdt enkelt med fokus på billeder og det blågrønne banner, som

går igen i menu, overskrifter, billedtekster osv. Den enkle struktur afspejles endvidere i

flowchartet, og hvordan man navigerer rundt på sitet. Dropdownmenu-funktionen

minimerer antallet af klik frem og tilbage på siden. Det angives tydeligt, hvor man

befinder sig på sitet via en funktion, hvor både overmenu og dropdownmenuen

markeres invers både ved hover og klik. Den valgte menuknap bliver således hvid i

stedet for den originale blågrønne, og hover-funktionen bibeholdes, så længe man

befinder sig under det givne menupunkt.

Stil og stemning Vi har valgt en klassisk, traditionel men også meget ren stil til Odder Museum. Vi

syntes, det var vigtigt, at det visuelle indtryk ikke blev for ungt og prangende, men

derimod afspejler ro og passer til museets stil og budskab, som er formidling af lokal

kulturhistorie.

Grafiske designparametre Format Websitet er lavet i et fast format på 960x680px for tage højde for brugere med

forskellige skærmopløsninger og ud fra en formodning om, at scroll-funktionen for de

fleste brugere dermed vil være unødvendig.

Farver Vi har valgt at bruge en støvet blågrøn farve samt sort og hvid. Denne enkelte

farvekombination er valgt for at skabe ro og for at billederne på sitet kan dominere

oplevelsen. Den støvede blågrønne farve er valgt, da den er nedtonet men samtidig

frisk. Farven giver associationer til både vand og natur, og Odder Museum ønsker jo

netop at profilere sig på deres mange tilbud om at komme ud og opleve naturen.

11

Illustration Der bruges primært fotos på sitet da det er den type illustrationer medarbejderne på

museet har adgang til. Der er lagt stor vægt på at billederne får plads på de enkelte sider,

og tekst er nedprioriteret. Dette fordi billederne bedre giver udtryk for museets tilbud og

hovedparten af brugere ikke ønsker at læse lange beskrivelser.

Typografi Til header, overskrifter og menuknapper har vi valgt at benytte Times New Roman for

at signalere tradition og seriøsitet, som vi synes kendetegner netop den kategori af

museer, som Odder Museum tilhører. Times New Roman frarådes normalt til web, da

læsevenligheden, pga. skrifttypens fødder, ikke er optimal. Dette gælder dog først og

fremmest når der er tale om mindre skrift i store mængder, hvorfor der som brødtekst er

brugt Tahoma, som netop er god til web. Til de faste grafiske elementer er der valgt

hvid skrift, fordi kombinationen med den blågrønne farve giver et friskt og let udtryk,

der skaber en god kontrast til det traditionelle udtryk (se tekniske detaljer om valgte

typografier og farver i designmanualen, bilag 8).

REALISERINGSTRIN

Anvendt teknologi Det færdige produkt, re-designet af Odder Museums nye website, er opbygget i CMS-

systemet WordPress, fordi CMS-systemer i højere grad end HTML tilgodeser museets

kompetencer i forhold til den efterfølgende vedligeholdelse. På baggrund af de

udviklede storyboards, flowchart og skelet for sitet, er der valgt et WordPress-tema der

havde lighedstræk med det ønskede design og layout. Dette tema er efterfølgende

redigeret vha. HTML og CSS for at opnå det ønskede udtryk og funktionalitet. Billeder

og enkelte grafiske elementer er redigeret og layoutet i Photoshop og efterfølgende

indsat i WordPress.

Kvalitetsvurdering/konklusion Formålet med projektet har været at udvikle vores forståelse og evner indenfor

brugerfladedesign, fra idé over skitse til realisering. Vores værktøjer gennem processen

har været analog skitsering, Photoshop og InDesign, HTML og CSS kodning, samt

CMS systemet Wordpress. Ydermere har vi i gruppen fokuseret meget på hele

processen med at designe et produkt for en kunde, og hvordan man bedst imødekommer

12

kundens og målgruppens ønsker men samtidig holder for øje, hvad der er teknisk

muligt, og hvordan det tager sig ud visuelt.

Som det gerne skulle fremgå af ovenstående, har vi i processen haft stor fokus på

undersøgelses- og designtrinet. Vi har brugt en betragtelig del af tiden på skitsering af

storyboards og evaluering af disse, fordi vi ønskede at kunne præsentere et optimalt

produkt ud fra devisen: alt er muligt, hvorfor selve realiseringsstadiet har været

udfordrende rent tidsmæssigt. Vi vurderer selv det færdige produkt til at være i fin

overensstemmelse med de idéer og beslutninger, der er blevet vedtaget i løbet af

processen og med kundens ønsker.

Man kunne i højere grad have imødekommet kundens ønsker om alternativ og

anderledes layout, men vores vurdering var, at det dels ville skabe for stor afstand

mellem form og indhold, dels forfordele museets faste og fortrinsvis ældre

publikumssegment. Vi har ladet os inspirere af den flotte grafik og anderledes struktur

på de sider, som vi blev præsenteret for ved det indledende kundemøde men samtidig

holdt for øje, hvilken type museum, der har været tale om, hvem brugerne er, og hvad

der visuelt og navigationsmæssigt passer bedst hertil.

FOR

AN

ALY

SE

DE

SIG

N

UN

DE

RSØ

GE

LSE

RE

AL

ISE

RIN

G

TIDSPLAN Dato HOME-model Opgaver

Mandag 7.12.2009

Kundebesøg

Tirsdag 8.12.2009

Test af eksisterende site

Onsdag 9.12.2009

Brainsstorm og mindmap

Udarbejdelse af tidsplan

Torsdag 10.12.2009

Skitsering af flowchart og storyboards

Afsender og budskab

Målgruppesegmentering

Fredag 11.12.2009

Diskussion af skitser til hhv. flowchart og storyboard Fordeling af arbejdsopgaver og udarbejdelse af rapportstruktur.

Søndag 13.12.2009

Rapport og skitsering

Mandag 14.12.2009

Diskussion af skitser til hhv. flowchart og storyboards

Fastlæggelse og udarbejdelse af flowchart.

Fastlæggelse af stil, stemning og overordnet æstetik

Udarbejdelse af rapport.

Tirsdag 15.12.2009

3-4 storyboards fastlægges

WordPress

Rapport

Layout

Onsdag 16.12.2009

WordPress

Rapport

Laoyout

Bilag

Torsdag 17.12.2009

Wordpress

Rapport

Korrekturlæsning

Rapport klar til print

Fredag 18.12.2009

Opsamling.

Print

gr)) , ry4k^h t;b

6 t ft'r, h ,-" 1/raI - ' - / . -

0/fur f4vrt't'-t

@ryltk'r'n//r'nSJ UAr,

it, /u(

/;^

/

J/4 ury1t l l t t - -

//rft-z/tt UJ

t^o/n,t/oDJ ru^

LAioti--r - iEt .rrt-f€T-Mo-uE

snNs- Ssr<it \ Br_aoS---..- (.t bybN) \AR<tv i *

\\ / \

eL-Knhlrne( \ I CrKoN

\ \ | s*t-\\ l!5t<,,..t- I rr -------------r\ rSoey'n tiD

6r5roRi 5rE- tsro* ie /'\: ' t *

5 iutEo€tu 7\ / \

oon(,o I "*uT;''*

/*(----L:.F-rt , ,1, , I / I t*^Drr io ' r / \%d'*ab<r

**r^ur\J(f / / . .^,-,_ .,/un*o

' / e / l"ofor*.l \rr*r{-rw'tvarir-ts*tr

/ [yi- . ; ; :1. /(

\ \rnvo(rn'rq/ t rYt- ' - ' "J / t ' \ ,^NDK{{( ' .

/ ,y. , r r tAr<tu€Ur / t

vrnaoi-lior\re

-=----,,_ / l4c,r,'eu.._.

faen ri>ui,r.lO ----t----....----

./ - -

\! -----.- dPc'trtst 'a<nw ftaNY ror<r',tior-ivCr #r.ura*^r.

Af Qnn"naeUT

Eksisterende flowchart, Odder Museum

FLOWCHART

Note: De hvide kasser repræsenterer de enkelte websider på sitet.

Titlerne i de grønne områder angiver et menupunkt i dropdown-menuen, der ikke udgør en selvstændig side men blot udløser en dropdown-menu.

OM MUSEET UDSTILLINGER PRIVATE ARRANGEMENTER

AKTIVITETER BLOG

KALENDER

MUSEUMSSKIBET ANNA

HISTORISK KAJAK

SEJLADS

NATUR VEJLED NING

MUSEETS SAMLINGER

SÆR UDSTILLING

ER

OMVISNING

KYST

MØLLERI

BJØRNKÆR

SÆTTET

DE GAMLE

FOTOGR…

SKOLER &

INSTITUTI

ONER

TEKSTIL

SAMLING

JAGTVÅBEN

& JAGT

KULTUR

GRUPPER

VIRKSOM

HEDER

PROFIL &

VISION

MUSEETS

ANSATTE

BLIV

MEDLEM

FORSK

NING

BESTY

RELSE

STØTTE

GRUPPEN

DOWN

LOADS

KONTAKT

PRISER &

ÅBNINGSTI

DER

FORSIDE

Sidens navn: forside (index.html)

Navigation/knapperKnapper (dropdown):link: Times New Roman, Bold, 18px, #FFFFFF, bundfarve #819786hover: Times New Roman, Bold, 18px, #819786, bundfarve #FFFFFF, 1px solid border #819786

Billedlinks:link 1: forside_akt1.jpglink 1 hover: forside_akt1_hover.jpg

link 2: forside_akt2.jpglink 2 hover: forside_akt2_hover.jpg

TekstindholdOverskrift 1:Times New Roman, Bold, 19px, #000000Brødtekst:Tahoma, 13px, #000000

Faste grafiske elementerHeader: odder_topbanner.jpgFooter: footer.jpg

Grafik1: forside_1skib.jpg2: forside_2molle.jpg3: forside_3naturvejl.jpg

Evt. andetVertikale linjer: 1px solid #819786

AKTUELT ODDER MUSEUMLorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue magna consent augue modit it nisim volore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame. Ttumsandrem do eu feu feugait nostrud. Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue magna consent augue modit it nisim vo-lore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame. Ttumsandrem do eu feu feu-gait nostrud. Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corperci-pis nos ametue magna consent augue modit it nisim volore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame.

Fotografier fra Hads Herred11. december 2009 - 5. april 2010

Gyllingnæs. JuletraveturSøndag den 27. december kl. 11.00 - 14.00

ÅBNINGSTIDER:Hverdage: kl. 13-16 (Mandag lukket)Weekend: kl. 13-17JULI:Hverdage: kl. 10-16 (Mandag lukket)Weekend: kl. 10-17

ODDER MUSEUM

Odder Museum Adresse: Møllevej 3-5 8300 Odder tlf: 86 54 01 75 email: [email protected]

FORSIDE OM MUSEETAKTIVITETER UDSTILLINGER PRIVATE ARRANGEMENTER BLOGFORSIDE

Sidens navn: molleri


TekstindholdTekst der beskriver mølleriet

Overskrift 1: Times New Roman, Bold, 19px, #000000Brødtekst: Tahoma, 13px, #000000


Grafik1: molleri_stormolle.jpg2: molleri_molle1.jpg3: molleri_molle2.jpg4: molleri_molle3.jpg

Evt. andetVertikale linjer: 1px solid #819786

MØLLERIOdder Vand- og dampmølle står i dag, som da hjulene standsede i 1955. Man kan se rense- og maleprocesserne på store plancher. Er man let til bens, kan man som et orienteringsløb følge byggens vej, fra den blev hejset op på loftet, kommer fra silo til renser og skalkværn, gennem sold og blæser til de store pocelænsvalser, hvor møllens mærkevare “Stærkoddergryn” blev valset.Atmosfæren i møllen er betagende og meget autentisk, og for den teknikinteresserede er der meget at se på.Ttumsandrem do eu feu feugait nostrud. Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue.


ODDER MUSEUM


FORSIDE OM MUSEETAKTIVITETER UDSTILLINGER PRIVATE ARRANGEMENTER BLOGUDSTILLINGER

Sidens navn: kalender


Tekstlinks:Brødtekst link: Tahoma, 13px, italic, underlined, #819786Overskrift 2 link: (pil #819786) Times New Roman, bold, italic, 16px, lineheight 25px, #819786

TekstindholdTekster der beskriver de enkelte arrangementer

Overskrift 1: Times New Roman, Bold, 19px, #000000Underoverskrift 1: Times New Roman, Bold, 16px, #000000Underoverskrift 2: Times New Roman, italic, 14px, #000000Overskrift 2: Times New Roman, bold, italic, 16px, #819786Brødtekst: Tahoma,13px, #000000


Grafik1: kalender1.jpg2: kalender2.jpg3: kalender3.jpg

Evt. andetVertikale linjer: 1px solid #819786Indlejret scrollbar

KALENDERDECEMBER 2009

JANUAR 2010

Fotografier fra Hads Herred11. december 2009 - 5. april 2010Fotografiet som opfindelse går tilbage til før 1840, men først i slutningen af 1880’erne blev fotografiapparatet al-mindeligt udbredt. Herefter gik det stærkt, og allerede fra 1890’erne er der et spændende billedmateriale fra Hads Herred, der udgør en enestående dokumentation af områ-dets historie.Se mere

Gyllingnæs. JuletraveturSøndag den 27. december kl. 11.00 - 14.00Det er nu 7. år, Odder Museum arrangerer en juletur rundt om halvøen Gyllingnæs ved Horsens Fjord. En vandretur langs stranden rundt om næsset, i en storslået natur med vinterfugle og måske et glimt af sælerne. Overalt ses spor af menneskets aktiviteter, trods det faktum, at området for 200 år siden stadig stod som oprindelig urskov med sine enorme egetræer. Se mere

Sild, ålekrager og kulturhistorie ved Nordsminde Fjord - med spisning på Norsminde KroSøndag den 24. januar kl. 12.00-15.00Vandretur ved fjordbredden, hvor store flokke af vandfugle og svømmefugle holder til. Siden stenalderen har menne-sket udnyttet fjordens rigdomme og sat sit spor – og præ-

Gå til:► DECEMBER 2009► JANUAR 2010► FEBRUAR 2010► MARTS 2010► APRIL 2010► MAJ 2010

Tilmelding:Ved aktiviteter der kræver tilmelding kontakt Odder Museum per telefon.

tlf.: 86 54 01 75


ODDER MUSEUM


FORSIDE OM MUSEETAKTIVITETER UDSTILLINGER PRIVATE ARRANGEMENTER BLOGAKTIVITETER

Sidens navn: blog


Tekstlinks:Overskrift 2 link: (pil #819786) Times New Roman, bold, italic, 16px, lineheight 25px, #819786

TekstindholdTekst fra museets medarbejdere

Overskrift 1: Times New Roman, Bold, 19px, #000000Underoverskrift 1: Times New Roman, Bold, 16px, #000000Underoverskrift 2: Times New Roman, italic, 14px, #000000Brødtekst: Tahoma, 13px, #000000


Grafik-

Evt. andetVertikale linjer: 1px solid #819786Indlejret scrollbar

BLOGMuseet får ny hjemmeside15. december 2009 Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue magna consent augue modit it nisim volore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame. Ttumsandrem do eu feu feugait nostrud. Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue magna consent augue modit it nisim volore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame. Ttumsandrem do eu feu feugait nostrud. Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue magna consent augue modit it nisim volore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame.

Lorem ipsum15. december 2009 Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue magna consent augue modit it nisim volore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame. Ttumsandrem do eu feu feugait nostrud. Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue magna consent augue modit it nisim volore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame. Ttumsandrem do eu feu feugait nostrud. Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue magna consent augue modit it nisim volore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame. Lorem ipsum dolor sitamet, consectetuer adipiscing elit. Diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam riure corpercipis nos ametue magna consent augue modit it nisim volore vulputat lutem init dolummodiat, corefeu feugue dolortin heniame.

Seneste indlæg:► LOREM IPSUM► LOREM IPSUM► LOREM IPSUM

Emner:► LOREM IPSUM► LOREM IPSUM► LOREM IPSUM► LOREM IPSUM► LOREM IPSUM► LOREM IPSUM


ODDER MUSEUM


FORSIDE OM MUSEETAKTIVITETER UDSTILLINGER PRIVATE ARRANGEMENTER BLOGBLOG

Skeletopbygning

Wra

pper

960

x 6

80 -

aut

o le

ft o

g ri

ght

960

x 88

628

x 50

630

2 x

506

960

x 25

960

x 25

1px

20 15

20 15

1515

1515

Designmanual

TYPOgRaFiPrimær typografi: Times New Roman; identitetsskabende typografi, der benyttes i header, overskrifter, dropdownmenuSekundær typografi: Tahoma; letlæselig webfont der benyttes til sidens brødtekst og o.l.

PRimæR TYPOgRaFi:Header overskrift: Times New Roman bold, 79px/95px, #FFFFFF, bundfarve #819786

Dropdownmenu: Times New Roman, bold, 18px/21px, #FFFFFF, bundfarve #819786

Dropdownmenu hover: Times New Roman, bold, 18px/21px, #819786, bundfarve #FFFFFF

Billedtekst 1 link:Times New Roman bold, 16px/19px, #FFFFFF, bundfarve #819786

Billedtekst 2 link:

Times New Roman, italic, 13px/15px, #FFFFFF, bundfarve #819786

Overskrift 1:Times New Roman, bold, 19px/23px, #000000

Overskrift 2:Times New Roman, bold italic, 16px/19px, #000000

ABCDEFabcdefghijklmnopqrstuvxyzæøåABCDEFGHIJKLMNOPQRSTUVXYZÆØÅ0123456789 (.,;:?!”#%&/`)

abcdefghijklmnopqrstuvxyzæøåABCDEFGHIJKLMNOPQRSTUVXYZÆØÅ0123456789 (.,;:?!”#%&/`)





Overskrift 2 link: Times New Roman, bold, italic, 16px/25px, #819786

underoverskrift 1:Times New Roman, bold, 16px/19px, #000000

underoverskrift 2:Times New Roman, italic, 14px/17px, #000000

sekunDæR TYPOgRaFi:Brødtekst:Tahoma, regular, 13px/16px, #000000

Brødtekst link: Tahoma, italic, 13px/16px, underlined, #819786

Header underoverskrift: Tahoma , regular, 11px/13px, #FFFFFF, bundfarve #819786

Footer: Tahoma, regular,12px/16px, #FFFFFF, bundfarve #819786








Farver

Blågrøn:Hexi: #819786 RGB: 129, 151, 134 CMYK: 52, 30, 49, 3

sort:Hexi: #000000 RGB: 0, 0, 0 CMYK: 100, 100, 100, 100

HvidHexi: #FFFFFF RGB: 255, 255, 255 CMYK: 0, 0, 0, 0

odder museum

Documents