Drengekor Birgit Inge Preben Rainer

ProjektrapIngeBirgitRainerPreben[1].docx 10-06-2011 12:21 ~ 1 ~

Skt. Clemens Drengekors hjemmeside

Eksamensprojekt i faget

”MULTIMEDIETEKNOLOGI OG INTERAKTIONSDESIGN”

under Erhvervsakademi Aarhus, kursus i perioden 5. maj til 15. juni

(Team: Inge, Birgit, Rainer, Preben)

http://multimediekursus.ats.dk/1811/birgit/wp/wp-admin

login: admin brugernavn: projekt

Indholdsoversigt I Foranalyse ................................................................................................. 1

Ia Kundemøde ......................................................................................... 2

Ib Informationsindsamling ..................................................................... 2

Ic Projektbeskrivelse ............................................................................... 3

II Undersøgelse............................................................................................ 4

kommunikationsplan .............................................................................. 4

III Design (Informations-, Interaktions- og præsentationsdesign) ............ 5

IIIa Informationsdesign .......................................................................... 5

IIIb Interaktionsdesign ........................................................................... 7

IIIc Præsentationsdesign ......................................................................... 8

IV Realisering ............................................................................................ 10

I Foranalyse

http://multimediekursus.ats.dk/1811/birgit/wp/wp-admin�


Vi dannede vores team før vi kendte det konkrete projekt på grundlag af en vurdering af, at vi hver især besad såvel almene som særlige kompeten-cer fagligt og generelt, som ville være et godt grundlag at gennemføre pro-jektet på.

Ia Kundemøde

Mandag den 30. maj fik vi kl. 09.00 at vide, at kunden var Skt. Clemens Drengekor repræsenteret af korlederen og et seniormedlem. Kunden har en hjemmeside, men ønsker en gennemgribende revision af denne.

Kunden forelægger en række ønsker til hjemmesiden:

• Hverve nye kormedlemmer (i alderen 8 – 13 år) • Være korets ansigt til offentligheden • Oplyse om kommende begivenheder • Fortælle om korets tidligere aktiviteter • Fungere som internt kommunikationsinstrument i et eller an-

det omfang, herunder en fællesmail: [email protected], hvor der oprettes en fællesmail og en mail til de enkelte ”ledere” og ko-rister

• Oplyse om korets organisation og bestyrelse og forenings-grundlag

• Links til samarbejdspartnere • Vise korets bidragsydere og sponsorer • Gerne nyt logo

I den efterfølgende dialog med kunden forsøgte vi at hjælpe ham til at af-klare, hvad det overordnede formål med hjemmesiden egentlig skal være, og kunden nåede frem til at fastslå, at det overordnede formål er ”at hver-ve nye medlemmer”, men så hjemmesiden udformes, således at de øvrige formål tilgodeses så godt som muligt.

Ib Informationsindsamling

mailto:[email protected]�


Teamet gennemså derefter kundens eksisterende hjemmeside og analyse-rede styrke og svagheder, og gennemså så andre danske drengekors hjemmesider og dannede sig et indtryk af, hvad der udgør et drengekors aktiviteter og hvilke funktioner der hører med til dets virksomhed.

Ic Projektbeskrivelse

Teamet udarbejdede den første projektskitse, der bl.a. indeholdt:

• Siden skal opbygges enkelt i såvel ydre fremtoning som i funk-tionalitet

• Skal samtidig være opmærksomhedsfangende og motiverende • Siden skal produceres i WordPress med anvendelse af Ata-

hualpa skabelonen • Der blev til den videre proces uddelegeret opgaver efter de en-

kelte teammedlemmers særlige kompetencer (Inge skulle finde forslag til nyt logo, og de øvrige hver især forelægge dele til næste fællesmøde, og alle skulle øge deres kompetence i brug af Atahualpa skabelonen og fortsætte researchen til det kon-krete projekt.

• Der blev udarbejdet en tidsplan (se bilag 0)


II Undersøgelse

Ideudviklingen tog udgangspunkt i den udførte research og i en mind-mapping.

Dette arbejde mundede ud i følgende

kommunikationsplan:

Primær målgruppe er eventuelle nye kormedlemmer. Her gør der sig det gældende, at den første modtagergruppe formodentlig ofte er forældre, hvis interesse skal fanges, så de motiveres til at foreslå deres barn at blive medlem og derefter viser siden til deres drenge, hvis interesse derefter skal vækkes med hjemmesiden som (et) middel, så han agerer med en tilmeldelse til optagelsesprøve. sekundære målgrupper

• Koncertgængere og klassisk musikinteresserede • Pressen • Andre kor • Det kirkelige bagland • Familiemedlemmer, bedsteforældre osv, og venner • Koret internt – vedligeholde og styrke samhørighed og kom-

munikation (og se sig selv)

brugerprofilerne er lige så forskellige som målgrupperne, hvilket tilsiger, at modtagermedierne skal kunne være så mangfoldige som mulige, pc, mac, tablets, smartphones osv. De unge vil bruge smartphones, koncertgængerne tæller sikkert teknologiske dinosaurer, der sidder med en Commodore 64 og uopdateret browser.


afsenderen, ”Sct. Clemens Drengekor” skal fremstå som nutidig, frisk og afslappet og tilgængelig for alle og samtidig også som ab-solut seriøs – (billeder af korets ledere og medlemmer i afslappede situationer under øvelse eller på turne og i koncertaktivitet i dyb koncentration og alvor. Koret har baggrund i Århus Musikskole og Domkirken. De evt. kommende medlemmer og deres forældre skal fornemme, at det både er sjovt og et godt fællesskab med nye ven-ner, men at det også er noder og optagelsesprøve og sangundervis-ning, som så belønnes med erhvervelse af ikke blot gode fritidsople-velser men på sigt også med anerkendte nyttige kompetencer. Kommunikationsmiljøet, som hjemmesiden indgår i er Musik-skolens program og annoncering og Domsognets kirkeblad, samt egen dagbladsannoncering og plakatophængning, som den i sitets nyhedsrubrik kan understøtte ved at gengive en aktuel plakat osv., og iøvrigt koordineres med i muligt og ønsket omfang.

III Design (Informations-, Interak-tions- og præsentationsdesign)

IIIa Informationsdesign

Den primære målgruppe skal kunne finde de søgte informationer allerede på forsiden. Informationerne her skal i vidt omfang bestå af billeder. For-siden skal signalere, at her er et spændende og udfordrende sangkor.


Ud fra overvejelser om opmærksomhedsniveauer besluttes det, at forsi-dens header øverst skal have et større billedbanner som logo, således at billedets tyngdepunkt bliver til venstre i sidens øverste venstre hjørne og så fade ud mod højre.

Under headeren midtstillet i bodydelen et galleri med slide-show [1 Flash Gallery] med iøjnefaldende fotos af kormedlemmerne og situationer fra koncerter og rejser, hvor brugeren kan forny billedmaterialet løbende.

Der indsættes en medieknap til video, med teksten: ”Se og hør koret”, idet der allerede eksisterer klip fra korets koncerter på YouTube og idet koret planlægger at producere en præsentationsvideo med en koncertoptagelse. En sådan video vil selvsagt informere mere om koret end mange ord.

Undersidemenuen skal udformes i den vandrette bjælke nederst i heade-ren, så den mest fremtrædende 1. underside får titlen: ”Noget for dig?”, evt. thumbnail af syngende korist som kan klikkes på, altså en side med information rettet til barnet/den unge der fortæller om fællesskab og godt socialt samvær og også oplyser om, at der skal ydes en indsats med øvelser og undervisning.

Undersiden hertil bliver ”Noget for dit barn?”, som giver de informati-oner forældre har brug for.

De øvrige undersider kommer til at afspejle de meget forskelligartede målgruppers informationsbehov:

• Undervisere og ledere – der præsenterer den professionelle stab som en information til både kommende korister og deres forældre og til øvrige målgrupper

• Kommende Koncerter, nyheder og kalender: Information til koret og til offentligheden om fremtiden

• Billedarkiv • Koncertomtale, med anmeldelser og medieomtale: Informati-

on om avisanmelser og anden medieomtale. På sitet skal der indsættes en indlægs-widget der giver koncertgængere mulig-


hed for at rose korets koncerter. Disse informationer er til så-vel kormedlemmerne som offentligheden.

• Om koret, herunder vedtægter og bestyrelsen. De officielle da-ta om koret.

• Kontakt: Navne i tekst hvordan man kommer i forbindelse med korets kontaktpersoner samt indsat kontaktformular

• Intern side: side med log-in til brug for kormedlemmerne, med fælles E-mail og evt. SMS advisering.

Der indsættes et RSS-feed, så alle målgrupper kan holdes løbende orien-teret, når der sker opdateringer på siden.

IIIb Interaktionsdesign

Startsidens interaktionsmuligheder skal være overskuelige, let tilgængeli-ge og interessefangende. Centrale menupunkter er Videoafspilning, der placeres og udformes iøjnefaldende.

Navigationsstrukturen bliver traditionelt og velkendt hierarkisk. Forsidens sidemenubjælke følger med på alle undersider.

På startsiden fremhæves i sidebjælken menu-punkterne: ”Noget for dig?” og ”Noget for dit barn”, der anbringes til venstre i bjælken.

I venstre kolonne fra midt og ned placeres links til relevante sites (Musik-skolen, Domsognet, Andre kor, m.fl.).

I højre kolonne placeres øverst et søgefelt til sitet, under det en tekstru-brik ”Støt os” med oplysning om giro- bankkonto, hvor evt. bidrag kan indsættes, tak for støtte, og kontaktmail.

I undersiden ”Kontakt” placeres en ”kontaktformular”.


I undersiden ”Koncertomtale” placeres en indlægswidget med tekst-overskriften: ”Fortæl hvad du syntes om vores koncert”.

I undersiden Intern placeres en log in formular, Email funktion samt en blog funktion til intern kommunikation.

I undersiden Billedarkiv placeres en kategorivalgs funktion, så man kan få et galleri vist efter kalender, efter emne (jule-, påske, sommer og turnekoncerter og rejser [de samme billeder tagges med forskellige kate-gorimærker].

Sitet som helhed brugeroptimeres til at interaktion kan finde sted fra så mange platforme som muligt: (pc, mac, smartphones, tablets) med en multiplatform plugin og et touch screen plugin.

Processen med udarbejdelse af interaktionsdesign forløb gennem udskriv-ning af skitser indtil et endeligt FLOWCHART (se bilag 1) kunne udfor-mes.

IIIc Præsentationsdesign

I forhold til den primære målgruppe har vi lagt vægt på at anvende me-dieelementerne: billeder, slide-show og mulighed for valg af video med billede og lyd allerede på startsiden og dermed skabe en indbydende brugergrænseflade til denne målgruppe, og som ligeledes vil fungere godt som udgangspunkt for de sekundære målgrupper, der får en generel for-nemmelse af sitets afsender og med et enkelt klik kan navigere videre til deres særlige informationsbehov på sidemenuen og derfra surfe videre på sitet efterhånden som deres interesse bliver vakt.

Som omtalt er logo, slide-show og afspil-video placeret i felter med højt opmærksomhedsniveau, og informationsmenuer for den sekundære brugergruppe i lavere opmærksomhedsområder på forsiden.


I Kompositionen af de enkelte elementers placering og baggrundsfarve-lægning er vi gået ud fra det perspektiv der er angivet i logo-banneret: et massivt startområde med billedtyngden” til venstre med en billedbevægel-se fra venstre, der bliver svagere og fortoner sig ud og op mod højre hjørne – ud mod et åbent perspektiv af muligheder. Denne bevægelse vil vi fast-holde i kompositionen ved at bruge de mørkeste farvenuancer for neden og til venstre og lysere til højre og opad. Således at sitet skal udtrykke, at med først ”alvorligt arbejde”, altså øvetimer, som grundlag og udgangs-punkt, så bevæger man sig også op mod stadig mere åbne muligheder og oplevelser, og således også på denne måde signalere hvad sitets afsender, drengekoret, står for.

Vi vil undgå stærke kontraster mellem de store flader men vægte harmoni-ske, komplementære strukturer der giver en baggrund af rolig udvikling. Dog med større kontrast i forhold mellem skriftfarve og baggrund, af hen-syn til læsbarhed og for at tilføje et element af ungdommelig sprælskhed.

Som baggrundsfarver har vi derfor valgt en rolig baggrundsfarve lyse-blå baggrund #cee3f6 og til sidebarer kaki #eee8aa brune.

Til skrifttype farver er følgelig valgt stærkere nuancer bl.a. rødt #ff0000.

Som primær skriftfont til brødtekst anvendes ”Georgia”, eller ”High Tower” og til overskrifter og fremhævede skrifter ”Bookman Old Style”, eller Rockwell, skærmvenlige skrifttyper der samtidig signalerer nærhed og varme. Vi har overvejet skrifter som f.eks. MetDemo font, der både har nodetyper og alfabetskrift, men det vil vi overlade til genovervejelse ved en senere revision af sitet, også fordi mange platforme ikke understøtter spe-cielle fonte.

En skematisk oversigt over designelementerne er optegnet på et Story-board (se bilag 4).


IV Realisering

Sitet produceres på grundlag af flowchart og storyboard og noter. Under-vejs i produktionen forekom der afvigelser fra det først planlagte, dels af produktionstekniske, dels af andre hensyn.

Clip art blev fundet som free ware på nettet. Billedmaterialet blev hentet fra korets eksisterende hjemmeside. Video klip blev uploadet fra You Tu-be.

Produktionen blev udført i CMS-systemet Word Press. Word Press er kendt for stor pålidelighed, og er som open source omkostningsfri for kunden, og vi lagde vægt på begge dele. I word-press anvendtes skabelo-nen Atahualpa, som er et meget fleksibelt layout at arbejde med. Så vi fandt det var et solidt grundlag for kunden at arbejde videre på med mu-lighed for tilpasning af sitet til fremtidige ønsker.

Af hensyn til den fremtidige brugbarhed installerede vi et SEO plug-in og som validator et link til Unicorn - W3C's forenede kontrollerings-værktøj, til evt. brug ved fremtidige ændringer eller fejlfinding.

Vi vil overdrage sitet med en mundtlig instruktion og med flowchart og storyboard og noter som en samlet portefølje, der som sød musik


vil sætte kunden i stand til at vedligeholde og opdatere sitet.






Planlagt tid

Faktisk tid

Tidsplan for projektet Skt. Clemens Drengekor - Bilag 0 Idéundfangelse

3 3 Idéudvikling

2 5

Idéudvælgelse

1 2 Farver/skrifter

1 2

Planlægning af tekst- og billedfremstilling

10 8 Produktion

20 30

Præsentation for kunden

1 1 Produktions-/finishlayout

2 10

Storyboard

4 2 Brugerfladen slices

5 1

Produktion i word-press

10 25 Portefolie

2 5

Udarbejdelse af rapport

10 20 I alt timer

71 114

Mødeplan:

Mandag kl. 09.00 - 14.30 Tirsdag kl. 09.00 - 14.30 Onsdag kl. 09.00 - 14.30 Torsdag kl. 09.00 - 14.30

Arbejdsdeling

Preben: home model Rainer: grafiske virkemidler Inge: designmanual - fotolayout Birgit: designmanual - procesdokumentation

Multimedieteknologi - Tidsplan for projektet "Skt. Clemens Drengekor"

Documents

Drengekor Birgit Inge Preben Rainer