Introduktion... 2. Problemformulering... 2. Metode... 2. Research... 3. Kommunikation... 4. Delkonklusion... 4. Analyse... 5. Design...

Relaterede dokumenter
OPGAVE: WELOVEORGANIC.COM WEBSHOP

Grafisk workflow. Se siden her:

Projekt-studieweb. Om kommunikationsteorierne. Morten, Jacob, Kristian og Cihat

Grafisk Redegørelse Opgaven Programvalg Kvalitetsvurdering Målgruppe Arbejdsproces Kvalitet Komposition og layout Brugervenlighed

OPGAVEN PROGRAMVALG. Jeg har brugt Illustrator til at lave logo og ikoner.

Portfolie Redesign. Forord. Det tekniske. Tema ide. Css. opløsning.

Indhold. Grafisk workflow 3 Procesbeskrivelse 4 Inspiration 5 Skitser 6 Flowchart 7 Typografi og farver 8 Skelet 9 Storyboard 12 Html, css og seo 16

GRAFISK DESIGN. Hjemmeside

GRAFISK WORKFLOW Hjemmesidedesign

GRAFISK WORKFLOW H1 MARIA SCHELDE

Nu skal vi især se på <font> og <center> samt centrering af hele siden på skærmen.

Laura Svendsen Kernekompetencer GRAFISK WORKFLOW

GRAFISK WORKFLOW Hjemmeside - Husk hjelmen.

Grafisk Design. rafisk Design

REDESIGN AF GRAFISK FORUMS HJEMMESIDE. Grafisk Workflow

Portfolio. Udvikling af min portfolio Link til portfolio: Michell Aagaard Dranig

Projekt - Valgfrit Tema

Dokumentation. Workflow. Grafisk produktion. Trine Alexandersen 1. hovedforløb

Hhtp:

GRAFISK DESIGN SVENDEPRØVE Dorte Damsgaard Larsen

Portfolio Web:

ELEMENTER Jeg vælger fonten Raleway, som er en af Googles mange gratis webfonte. Det er en grotesk skrift, som især bruges til websites, da de på

Mit grafiske workflow inkluderer:

Cecilie Maria Nielsen, Mathias Fornitz Eriksen og Martin Arnetoft klasse

grafisk workflow Frank winding

GRAFISK DESIGN. Diner no. 34 Hjemmeside + Visuel identitet

Designmanual for websider

Grafisk Workflow STILHISTORIE. Website lavet i forbindelse med et projekt om stilhistorie. Klik her for at se websitet:

Grafisk design. sundfertilitet.dk

GRAFISK DESIGN. Min personlige e-portfolio

portfolio GRAFISK WORKFLOW

INTRODUKTION... 3 PROBLEMSTILLING... 3 PROBLEMFORMULERING... 4 METODE... 4 AFGRÆNSNING... 5 ANALYSE... 5 KOMMUNIKATION... 5 SEGMENTERINGSPROCESSEN...

Produkt. Index side GRAFISK DESIGN

Mark André Lyhne. Eksamen web1b

Grafisk Workflow. hovedforløb 2

GRAFISK WORKFLOW WEBSITE: MEEFRED DESIGN

Dokumentation til Computerspil

Dokumentation. Karen-Louise Fejerskov

GRAFISK WORKFLOW GRAFISK WORKFLOW DIGITAL KOMMUNIKATION OLEMOGELBY.COM

GRAFISK WORKFLOW. Layout Layout af hjemmesiden laves i Photoshop og siderne inddeles i mapper for bedre overblik.

GRAFISK PRODUKTION WORK- FLOW DREAMWEAVER CS5 DESIGN & KODNING AF LANDING PAGE. a.link, a.hover, a.visited. Wrapper. paragraph CSS. h1 h2.

GRAFISK PRODUKTION & WORKFLOW. Endotest website

Stine Dorry Meulengracht Madsen Rapport Multimedie og kommunikation

Portfolioudvikling. Line la Fontaine. Multimediedesigner

1. Hovedforløb. Mediegrafiker

Vigtige funktioner i Word 2003

Grafisk Workflow. Endeligt layout. Om mig. Forside. Portfolio

Afsluttende - Projekt

Grafisk Design 70% Skitser

HHBR. Design. Kvalitets vurdering. Opgaven. Målgruppe og Budskab. De Grafiske valg

Gruppe 15. Redesign af bageriet FeelGood Bakery s website. Gruppen Består af: Nanna Søderquist Christian Thorsø Rolf Josephsen Søren Henrik Wilhardt

Grafisk. Workflow. Side 1

Hvad er Musicon? Hvad vil jeg promovere?

1. Semester afsluttende Projekt Charlotte Bruhn MUL A December Januar 2015

Dokumentation. Grafisk Design

Portfolio Redesign Kamilla Klein 1. Semester eksamen

Afsluttende opgave Webdesign Den 24. maj 2007 Klasse 1.2

Hjælp under login på Mit DLR Oktober 2015

Førsteårsprøven Projektbeskrivelse 2. Semester Multimediedesigner

Portfolio - Grafisk Workflow

OPGAVE BESKRIVELSE ARBEJDSPROCES. Idéudvikling. Inspiration. Skelet. Uploade til server. Kodning. Teste sitet igennem. Rettelser og godkendelse

MÅLGRUPPE Alle typer af boligselskaber, ejer- og andelsforeninger samt div. institutioner (store som små) på Sjælland. Ikke private kunder.

For at finde en stil til hjemmesiden, starter jeg med at lave et moodboard af alle Mikkalina Glas s produkter.

Et krav til portfolien var at det skulle udvikles fra bunden uden brug af CSS-frameworks, samt HTML og CSS skulle valideres uden fejl.

GRAFISK DESIGN. Kenneth Friis Petersen

FORSTÅELSE FOR GRAFISK PRODUKTION OG WORKFLOW

grafisk workflow Madmagasinet

Grafisk produktionsforståelse

hvilke slags arbejde kan man have som uddannet tøj designer hvilke ting skal man være god til som tøj designer Hvorfor er mænd løn højere end kvinders

Niks Frost & Line Søs Hold 32B

Grafisk produktion & workflow

Transkript:

Indhold Introduktion... 2 Problemformulering... 2 Metode... 2 Research... 3 Kommunikation... 4 Delkonklusion... 4 Analyse... 5 Design... 6 Delkonklusion... 9 Implementering og dokumentation... 10 Konklusion... 16 Læringsstil... 17 Litteraturliste... 19 Bilag... 20 Interview med Lars, bilag nr. 1... 20 CSS, bilag. Nr. 2... 22 Ghantt chart, bilag 3... 23 Idegenerering, bilag 4... 24 1

Introduktion I dag er der rigtig mange uddannelser man kan komme ind på. Mange unge har svært ved at vælge den rigtige uddannelse og hvordan kan de vide, at de vælger rigtigt? Uddannelsens hjemmeside er ofte det første de unge ser og derfor har det stor betydning, om den er imødekommende eller ej, - for hvorfor skulle de vælge en uddannelse som har en kedelig hjemmeside? EAL har givet os den opgave at forny hjemmesiden for Pba. i Eksport og teknologi. Faktisk er uddannelsen lukket ned og man kan spørge sig selv, om det har noget med hjemmesiden og informationen derpå at gøre? Det vil vi forsøge at finde ud af i vores opgave og ud fra det, ændre hjemmesiden så den vil være mere fangende og imødekommende til senere brug. Det har vi valgt at gøre, ved at gøre sproget på den nye side mere ungdommeligt, men stadig professionelt. Samtidig har vi gjort siden mere farverig, så den er mere tiltalende. Dette mener vi, kan gøre en forskel når unge skal vælge uddannelse. Problemformulering For at løse denne opgave har vi fundet nogle spørgsmål, der skal besvares, for at vi kan lave en hjemmeside der er korrekt. Spørgsmålene er: Hvilken målgruppe henvender sitet og uddannelsen sig til? Hvilken stilart vil være relevant at bruge på denne hjemmeside? Hvad skal hjemmesiden gøre? informere, sælge? Hvad kigger de søgende på? Hvorfor er uddannelsen lukket? Metode Vi har valgt at bruge AIDA modellen for at gennemskue hvordan vi bedst muligt trænger ind til den korrekte målgruppe. Desk research er brugt, da vi undersøgte hvordan den nuværende side for Pba.i eksport og teknologi er opbygget og læst om studiet for at forstå hvad det er. 2

Field research er brugt i forbindelse med interview af studievejleder. Ved at lave research, har det vist sig, at uddannelsen ikke længere er tilgængelig. Derfor har det været svært for os at lave en dybdegående research. Research Desk research Kort fortalt, hvad denne uddannelse går ud på: Pba. i eksport og teknologi er en uddannelse som tager 3½ år, og kan tages i Odense og Aalborg. Før den nye reform kom, hed uddannelsen eksport teknikker, men den opfyldte ikke kravene i den nye reform, og blev derfor lavet om til Pba. I eksport og teknologi. 1 Pba. i eksport og teknologi, er en uddannelse som kombinerer de tekniske og de merkantile fagområder. Den giver et indblik i virksomhedsopgaver i forbindelse med salg og eksport af tekniske og designmæssige løsninger og produkter. 2 Uddannelsen er opdelt i 7 semestre, heraf foregår de 5 første semestre på skolen, hvor der komponeres med virksomhedsbesøg og gæstelærere. På 6. semester skal de studerende på virksomhedsophold, og på 7. semester skal de skrive bachelor projekt. For at komme ind på denne uddannelse er der flere adgangskrav. Man kan enten blive optaget med en gymnasial uddannelse, med matematik eller erhvervsøkonomi på b niveau og engelsk på b niveau. Man kan også komme ind på uddannelse med forskellige erhvervsuddannelser. F.eks. cykel- motormekaniker, elektriker, køletekniker osv. Field research Interview med Lars Høst- Madsen (studevejleder) Efter vi har lavet desk research fandt vi ud af at man ikke længere kunne søge ind på uddannelsen. Dette undrede os og vi valgte derfor at lave et interview med en studievejleder inden for området, så vi kunne få svar på nogle af de mange spørgsmål der så opstod. I vores interview med Lars Høst- Madsen, fortalte han kort om uddannelsen. Han fortalte om mange af de ting, man også kan læse om på hjemmesiden. Ud over de ting vi vidste i forvejen, fortalte han hvorfor 1 Interview med Lars bilag nr. 1 2 http://www.eal.dk/eal/site.aspx?p=443, d. 31.05.2012 3

uddannelsen var lukket ned, hvor en af de væsentligste årsager var, at der ikke var nok søgende til uddannelsen og de derfor ikke kunne lave et hold til semester start. I stedet har de lagt den til som en del af markedsføringsøkonom uddannelsen, så man kan tage PBA. Eksport og teknologi som en overbygning til markedsføringsøkonom uddannelsen. Samtidig sagde han, at det vigtigste på sitet var, at man kunne finde svar på alt, og at det skulle være nemt at finde oplysninger om kontaktperson så man kunne få svar på spørgsmål. Læs hele interviewet her. 3 Kommunikation Vi har brugt AIDA modellen til at finde ud af, om vores produkt passer til den rette modtager. AIDA modellen går igennem fire faser, attention, interest, desire og action. Attention opstår da sitet skiller sig ud fra de andre fx ved farver, skrift og vores flash element. Interest sker da de har lyst til at læse vores site igennem pga. de fangende overskrifter. Desire, er at sitet er blevet mere imødekommende og læsbar så der kommer flere studerende til. Action sker når pågældende tager kontakt til studievejlederen og søger ind. Delkonklusion Vi har indtil nu, fundet ud af, hvad PBA. I Eksport og teknologi er for en uddannelse, hvad der er af problemer, og hvordan vi kan løse problemerne. Vi har bl.a. prøvet at gå ud fra AIDA- modellen, ved at gøre dét, har vi fundet ud af, at vores site vil kunne hjælpe med at fange de kommenende studerendes opmærksomhed og får dem til at holde dem på siden, så de når til action, så der kommer flere studerende. 3 Interview med Lars bilag nr. 1 4

Analyse Analyse Design Implementering og dokumentation Kommunikation Feltstudie AIDA Design grafisk stil og inspiration Skitse Ændrer farver i den frie hjemmeside Interaktion Kodning Skitse Ændring af billede, flash Vi har valgt at bruge stilarten modernisme, da denne stilart passer godt til uddannelsen og målgruppen. Med det mener vi, at det ikke er en kreativ uddannelse som fx MMD, derfor er det mest korrekt med lige linjer og rent design. Modernismens mest karakteristiske træk er rene former, lige linjer og funktionalitet. Modernisme er en stilart, hvor der arbejdes med tre former; den retvinklede trekant, firkanten og cirklen. Modernisme er en meget stilren stilart, hvor der ønskes stor brug af alignment princippet. Ydermere arbejder man specielt med farverne sort, hvid og signalfarverne rød, grøn, gul og blå. Fonten på et modernistisk design skal være af sans- serif typen, såsom Verdana og Arial. Når man opbygger en hjemmeside med denne stilart, benytter man kun to forskellige fonte på ét design, samt to forskellige fontstørrelser. 45 Vi har fået inspiration til vores billede med en storby, da uddannelsen handler om bl.a. eksport og med eksport tænker vi på storbyer der importer meget, samtidig har vi sat computeren med flyet ind for at give sammenhængen mellem eksport og teknologi. Der er brugt både HTML, CSS og FLASH på sitet. Det har vi gjort fordi, at det passer godt sammen med netop vores ide. Vi har brugt FLASH på vores forside, HTML og CSS på begge vores hjemmesider. Der er både gode og dårlige ting ved at bruge hhv. HTML og FLASH. Vi føler ikke, at FLASH hører til under modernisme, derfor er det ikke brugt der. Rent teknisk fungerer FLASh heller ikke altid, hvis folk ikke har installeret en flash player. Det vil for nogle kunne være et irritationsmoment og de kommende studerende vil derved miste interessen. Vi har antaget, at der er flash player på de fleste computere og har derfor valgt at gå videre med det. 4 http://www.dac.dk/viskanonside.asp?artikelid=2754 d. 29,05.201 5 http://www.denstoredanske.dk/kunst_og_kultur/litteratur/litter%c3%a6re_perioder/modernisme d. 29.05.2012 5

Flash bruges på forsiden for at fange folks interesse. CSS bruges som ekstern stylesheet sammen med HTML. For at kode vores HTML og CSS har vi brugt Dreamweaver, der er også andre muligheder, fx Notepad++ og Textwrangler, men Dreamweaver er mere overskueligt og bedre opstillet. Dreamweaver hjælper også en ved at komme med forslag når man skriver noget. Fx hvis man skriver margin, så kommer der en boks frem med muligheder, hvor der kan stå marign- top, margin- left. Dreamweaver er ikke god at bruge hvis man er helt nybegynder med kodning, da det kan blive forvirrende når den kommer med hjælp, men når man kan skelne mellem det den skriver, så er det godt at bruge. For at se vores produkt, er det et krav, at man har flash player på sin computer, da forsiden er flash. Hvis ikke man har det, vil der være en knap så man kan gå videre til sitet, men så mister man en del af oplevelsen, da vi mener, at forsiden skal trække folk til. Vi har brugt XHTML som standard. Det er testet i Safari, Firefox og Google Chrome, samt i styresystemerne Windows 7 og MacOS5. Vores baggrundbillede er 1000*768, for at det passer til skærmen uden at der kommer en horisental scroll bar Design Efter noget idegenerering 6 og research nåede vi frem til en løsning på, hvordan vores site skulle være. Der blev besluttet, at der skulle laves en ny udgave af EAls site for PBA. I eksport og teknolog, hvor det primært var designet der skulle ændres. Teksten skulle peppes lidt op, men det er designet der trækker folk til, her havde vi forskellige ideer, hvor vi havde de stilarter ind over som vi har lært om, og vi prøvede at sætte uddannelsen og målgruppen op i mod stilarterne. hvad passede sammen? For at finde ud af, hvad der ville være det optimale lavede vi vores research del og nåede frem til, at stilarten skulle være modernistisk og målgruppen faktisk ikke havde nogen aldersgruppe, men nærmere nogle kriterier, såsom folk der er meget udadvendte, og ikke har noget i mod at rejse væk. Det kan fx være folk der vil være eksportsælger. Udlændinge er også en potential målgruppe, da man kan tage uddannelsen på engelsk. Derfor valgte vi at lave en modernistisk hjemmeside med en flash del og et frit site med samme flash del. Flash delen skal ligge som vores forside, både i det frie site og i det modernistiske site. Dette kan ses i vores oversigt over wireframe. Vores wireframe viser måden hjemmesiden er sat op på. Det blev gjort som det første, så vi havde et overblik over vores arbejde og derved var der enighed om hvordan vi skulle bygge sitet op. 6 Bilag nr. 4 6

Nedenfor ses både vores wireframes og sitemap. Sitemap for begge sider: Wireframe for modernisme site 7

8

Wireframe for den frie site 9

Delkonklusion Vi har lavet en analyse over vores site, dette har vi gjort for at give et overblik over at det vi har lavet virker optimalt og hvorfor vi har gjort, som vi nu har valgt at gøre. Samtidig har vi vist vores design proces fra start til slut, for at give et billede af, hvad vi har været igennem. Implementering og dokumentation CRAP analyse af den frie side Contrast: vores contrast farver er sort mod grøn og hvid. Det har vi valgt at gøre, fordi det at det giver en god effekt på siden. Det skaber opmærksomhed og gør det nemt at overskue siden. Man kan også finde kontrast på forsiden, ved at der står en computer midt på gaden i en storby og lyser op. Den lyser op, for at man ved, at det er dér man skal trygge for at komme videre. Repetition: logoet går igen fra forsiden og ind på sitet, det samme gør baggrunden. Menuboksen og tekstboksen er opbygget med samme farve og samme gennemsigtighed. 10

Alignment: hjemmesiden er bygget meget op omkring lige linjer, fx er baggrunden formet så bygningerne får vejen til at ende ud i en spids, vores bokse er firkantet og teksten står på lige linje. Baggrunden skaber en ligevægt i billedet, fordi at bygningerne fylder lige meget i hver side. Vi har valgt at sætte content meget centreret så det også giver en form for ligevægt. Proximity: det er et lille site, så proximity gør sig ikke særlig meget gældende. Men fx kan man sige, at menu boksen og content hænger sammen og er en form for proximity. CRAP analyse af modernisme siden Contrast: blå, grøn, hvid og sort. De farver er kendetegn for modernisme, og skaber en god kontrast. Repetition: der er repetition mellem baggrunden og logoet, samt vores hvide skriftfarve og baggrunden. Sort går igen, ved vores baggrundsboks og vores content. Alignment: hele hjemmesiden er bygget op omkring alignment, det har igen noget at gøre med, at stilen er modernisme og modernismen har altid rene, lige linjer. Baggrunden er kvadratiske kasser, som alle sammen er lige store, content er firkantet og er placeret centreret. Proximity: vi mener ikke der er noget proximity på denne side. 11

Vi foretrækker selv den hvor vi har haft frie hænder, men vores modernisme site passer bedst til uddannelsen. Det er svært at tænke kreativt, når der er faste rammer som der er med vores modernisme site, derfor kan den være sværere at lave, da der har været mange ting at forholde sig til. Det frie site har vi tænkt ud af boksen og gjort hvad vi synes var fedt. Ud fra det, kan vi konkludere, at det er nemmere at lave et site når man har frie hænder. Vi har fundet to eksempler på koder fra vores HTML og FLASH som vi er stolte af. Det første er HTML kode til vores galleri, det har vi valgt at tage med, fordi at vi til at starte med, ikke vidste hvordan vi skulle lave et galleri. Så vi har været inde og søge på det og har derved selv fundet frem til en løsning. 7 Nedenfor ser i kodningen i HTML. Der er også en masse kode i CSS, men det har vi valgt at ligge som bilag. 8 Fra HTML <div class="img"><a href="pic1_big.html"> <img src="gallery1/pic_1.jpg" alt="indgang" width="110" height="90" /></a> <div class="desc">eal på nonnebakken</div> </div> Forklaring på HTML kode: <div class="img"><a href="pic1_big.html"> Denne kode henviser til hvilket billede der skal vises på siden. <img src="gallery1/pic_1.jpg" Denne kode fortæller hvor billedet ligger henne. 7 Bates, Bert, Freeman, Elisabeth og Freeman, Eric, (2005), Head First Html with CSS and XHTML, Oreilly & Associates Inc 8 Bilag nr. 3 12

alt="indgang" width="110" height="90" /></a> Denne kode bruges til at gøre billedet mindre. Billedets normalstørrelse er nemlig meget større, så derfor er denne kode sat ind for at gøre billedet mindre. <div class="desc">eal på nonnebakken</div> </div> Her skriver man en lille beskrivelse af billedet, som kommer til at stå småt under billedet. Denne flash kode gør, at vi kan få vores flash element ind som forside og via ét tryk bliver man sendt videre til HTML sitet. Dette var ikke noget vi har prøvet før. Her har vi også selv været inde og søge på hvordan vi skulle gøre det, og har derefter fået hjælp fra Bjarne 9. Denne kode brugte vi ved at vælge det sted på timeline hvor flyet er lettet her indsatte vi en blank keynote, vi åbnede actionscriptet og satte den nedenstående kode ind. Derefter gik vi ind i public settings og valgte HTML wrapper og publish og kaldte den index.html. Var myurl:urlrequest = new URLRequest("PBA.html"); navigatetourl(myurl, "_blank"); 10 Opbygning af de to sites. Det modernistiske site: Siden indeholder head og body. I mellem header og body har vi lagt baggrundsbilledet. Det modernistiske site er opbygget klassisk med header, content og footer, dog har vi undladt sidebar da vi ikke syntes at det passede til vores dokument. Og vores menu har fået sit eget div- tag i form af en navcontainer. I headeren har vi sat vores logo i form af et jpg- billede. Under vores header findes vores menu i form af en nav- container her er henvist til de forskellige sider som f.eks. indhold1.html Vi har valgt at den valgte side skulle have fed skrift og være større end de andre, dette reguleres via CSS. Vi har derudover også valgt at den valgte skulle være markeret, dette bestemmes ved at sætte current/ active 9 Bjarne Slipsager, Underviser på MMD uddannelsen 10 http://www.republicofcode.com/tutorials/flash/as3link/ 13

rund om henvisningen i menuen. Vi har valgt at den valgte skal være grøn og at den der ikke er valgt skal være hvid, dette reguleres og i CSS. Dette er gjort med de nedenstående koder. #navlist a#current { color: #1fea15; } og koden for den ikke valgte der er hvid: #navlist li a { letter- spacing: 3.5px; text- decoration: None; color:#fff; font- size: 0.7em; padding: 0 2px; border- top: none; } og når man kører musen henover bliver den grøn dette vises ved denne kode i CSS #navlist li a:hover, #navlist a#current { color: #1fea15; border- top: none; font- size: 0.9em; }. Størrelserne reguleres og i form med at man kører henover eller vælger den. Denne ses under font- size der også findes i de ovenstående koder. Vores content har vi valgt at gøre gennemsigtig, så derfor valgt vi at sætte et intern CSS ind i HTML dokumentet, i form af textfield og textcontent. Og koden til at gøre contenten gennemsigtig er denne { - moz- opacity:.70; opacity:.50; position:absolute; }. 14

Footer har vi valgt at gøre transparent, så man kan se baggrundsbilledet, dette gøres under background- color hvor vi i stedet for at vælge en farve bare skrev transparent. Det frie site: Siden indeholder head og body. I mellem header og body har vi lagt baggrundsbilledet. Det frie site er opbygget klassisk med header, content, footer og sidebar. I vores header, har vi igen lagt vores logo i form af et jpg- billede. Vores content har vi valgt at gøre gennemsigtig, ved hjælp et intern CSS der er placeret ind i HTML dokumentet, i form af textfield og textcontent. Og koden til at gøre content gennemsigtig er som før nævnt; { - moz- opacity:.70; opacity:.50; position:absolute; }. Content er placeret til højre da der skal være plads til sidebar. Det har vi gjort ved at indsætte float:right; i CSS. Vi har placeret vores menu i sidebaren, den er også gennemsigtig, så det matchede content. Nederst i koden er opacity, det er denne der bestemmer gennemsigtighed. #navcontainer { background: #000; width: 100%; margin: 0 auto; padding: 1em 0; font- family: "adobe hebrew"; font- size: 14px; text- align: center; text- transform:none; 15

filter:alpha(opacity=50 ); - moz- opacity:.70; opacity:.70; } Når man kører musen henover og vælger bliver det grønt. Dette gøres med henholdsvis ul#navlist li a:hover, ul#navlist li#active a:hover { color: #1fea15; background: transparent; border- color: #aaab9c #fff #fff #000; } og ul#navlist li#active a { background: transperant; color: #1fea15; }. Her er footer også blevet gjort gennemsigtig dette vælges ved background- color hvor vi i stedet for at vælge en farve bare skrev transparent. Mens vi har bibeholdt tekstfarven som hvis (#fff). Konklusion Vores løsning på denne opgave har været at lave et nyt site for uddannelsen Pba. i Eksport og teknologi, som var mere imødekommende og brugbar. Samtidig giver den svar på de mest stillede spørgsmål, som handler om valgfag, uddannelsens opbygning og merit. Vi har fundet ud af, at målgruppen ikke er bundet af nogen alder, men uddannelsen er henvendt til folk der er meget udadvendte, og ikke har noget i mod at rejse væk. Det kan fx være folk der vil være eksportsælger. Udlændinge er også en potential målgruppe, da man kan tage uddannelsen på engelsk. Vi har dog valgt, ikke at lave sitet på engelsk, da uddannelsen som tidligere nævnt er lukket ned. Hvis uddannelsen starter op igen, vil der selvfølgelig skulle laves et site på engelsk også. Vi har fundet frem til, at det er seriøse og meget professionelle folk der vil søge ind på uddannelsen, og mener derfor at den rigtige stilart er modernisme. Hjemmesiden skal være et sted hvor interesserede kan 16

finde alle de spørgsmål de går og tænker på, store som små. Hvis de mangler svar, skal de nemt kunne finde en kontaktperson. Uddannelsen lukkede ikke fordi at den ikke var god, men fordi at der ikke var nok ansøgende. Derfor er den blevet en del af markedsføringsøkonom uddannelsen. Derfor vil den senere hen blive en overbygning til markedsføringsøkonomuddannelsen. Læringsstil Jancy: Teoretikere sætter sig grundigt ind i de opgaver de for stillet og tager tingene meget seriøst. Teoretikeren bliver hurtigt irriteret hvis der ikke er styr på tingene eller er fejl i det materiale der bliver udleveret. Hvis der forekommer diskussioner, skal de altid argumenteres videnskabelige og diskussionen skal tages seriøst. Når der skal læres noget nyt, skal alle teorier helst sættes i bokse og systemer. Arbejdet er meget struktureret og gerne skemalagt. Teoretikeren arbejder gerne alene for at være sikker på at tingene bliver gjort ordentligt Reflektorer: Jancy er teoretiker som passer meget godt til hendes rolle, da hun er den som sætter gruppen i gang og laver de opgaver hun bliver stillet over for med stor tilfredshed. Hun er god til at besvare diverse problemstillinger med positiv kampånd. Sascha : Teoretikere sætter sig grundigt ind i de opgaver de for stillet og tager tingene meget seriøst. Teoretikeren bliver hurtigt irriteret hvis der ikke er styr på tingene eller er fejl i det materiale der bliver udleveret. Hvis der forekommer diskussioner, skal de altid argumenteres videnskabelige og diskussionen skal tages seriøst. Når der skal læres noget nyt, skal alle teorier helst sættes i bokse og systemer. Arbejdet er meget struktureret og gerne skemalagt. Teoretikeren arbejder gerne alene for at være sikker på at tingene bliver gjort ordentligt 17

Reflektorer: Sascha passer meget godt til rollen teoretiker, da hun er den der skaber overblik over processens forløb og er god til at dele opgaver ud. Sascha er målrettet og stræber efter at blive færdig i god tid, som har været yderst nyttigt for vores gruppe projekt. Katja: Aktivister tager hurtigt fat i nye opgaver uden at tænke videre over det og kan godt lide at være der hvor der sker noget. De researcher kun efter de ting der er relevante, og vil derfor aldrig sætte sig og læse en bog helt, men blot skimme den. Dette gør også, at aktivisten hurtigt bliver utålmodig, da de arbejder målrettet og spontant. De ser ikke ting som problemer, men en udfordring, de har ikke noget imod at styre flere ting på en gang. Dette medfører også at de kan have for mange opgaver i gang, så de ikke når at afslutte dem alle. De har ikke noget imod at arbejde under pres. Reflektorer: Katja passer godt som aktivist da hun har siddet med det kreative og det underholdende af opgavens forløb kodning. Sammen med Sascha og Jancy som begge er teoretiker har det været yderst nyttigt at arbejde med en aktivist for at skabe et mere åbent syn på projektet som er ideer m.m. til projektets forløb. Louise: Aktivister tager hurtigt fat i nye opgaver uden at tænke videre over det og kan godt lide at være der hvor der sker noget. De researcher kun efter de ting der er relevante, og vil derfor aldrig sætte sig og læse en bog helt, men blot skimme den. Dette gør også, at aktivisten hurtigt bliver utålmodig, da de arbejder målrettet og spontant. De ser ikke ting som problemer, men en udfordring, de har ikke noget imod at styre flere ting på en gang. Dette medfører også at de kan have for mange opgaver i gang, så de ikke når at afslutte dem alle. De har ikke noget imod at arbejde under pres. Reflektorer: Louise er aktivist ligesom Katja og det afspejler sig i hende, da hun har lavet det kreative del af opgaven som flashdelen på hjemmesiden og forsiden opsætning på vores opgave. Louise har lavet de mere kreative del af projektet. Derudover har hun også tegn på teoretiker som afspejler sig i hendes målretning med opgavens forløb. 18

Litteraturliste Bøger: Bates, Bert, Freeman, Elisabeth og Freeman, Eric, (2005), Head First Html with CSS and XHTML, Oreilly & Associates Inc Hjemmesider: W3schools, http://www.w3schools.com/css/css_image_gallery.asp, 05-30- 2012 Republicofcode, http://www.republicofcode.com/tutorials/flash/as3link/ 05-30- 2012 Erhversakademiet Lillebælt, www.eal.dk, 05-28- 2012-06- 01-2012 Gantt Chart, https://www.teamgantt.com/, 06-01- 2012 Illustrationsliste: Big think, http://bigthink.com/ideas/42016, 05-29- 2012 Travelforum, http://www.travelforum.dk/fly, 05-29- 2012 Australia feriesider, http://australia.feriesider.dk/vishjemmeside_privat.asp?mode=top_frame&side=&id=1248589, 05-29- 2012 Neglenymfer, http://neglenymfer.blogspot.dk/2012/01/guide- til- neglelak- shopping- new- york.html, 05-29- 2012 19

Bilag Interview med Lars, bilag nr. 1 Interview med Lars Høst- Madsen Studievejleder på EAL Fortæl lidt om uddannelsen: Man kan sige det er en ny version af en gammel uddannelse som hedder eksport teknikker uddannelsen, som varede 4 år. Der var de studerende 4 gange ½ år i skole og 4 ½ halv år i praktik. Den blev så nedlagt, da den ikke opfyldte de krav i den nye reform. Derefter prøvede man så at lave en ny uddannelse, som er en kombination af handelsfag og teknisk viden. Så den personson der bliver færdig her, skulle gerne være en handelsperson med en teknisk viden. Dvs. de har en viden om bestemte materialer om nogen produktions processor og arbejdstegninger, så de kan eksportere og importere tekniske produkter. Dette medfører at de ikke behøver at have en teknikker med når der skal lave kontrakter. Hvilken målgruppe henvender uddannelsen sig til? Hvem forventer i søger ind? Den henvender sig til alle der kunne tænke sig en udadvendt job som f.eks. en eksport sælger med mange rejsedage. Et job hvor man skal arbejde meget med udenlandske kunder og leverandøre. Uddannelsen udbydes både på dansk og på engelsk, så den henvender sig også til udlændinge. Hvad kigger de studerende på hjemmesiden? Hjemmesiden skulle gerne give svar på stort set alle spørgsmål omkring opbygning, indhold, eksamen osv. om uddannelsen. Den skal være bygget op på den måde, så de studerende kan gå dybere og dybere ned i det de gerne vil have af vide om. Så er det også vigtigt at der er en kontaktperson, så de kommende studerende kan ringe eller komme forbi hvis du har spørgsmålet. Hvorfor har i lukket uddannelsen ned? Det her er 4. år vi udbyder uddannelsen. Vi har optaget 2 meget små hold. Sidste år kunne vi ikke optage hold, pga for lidt søgende. Det vi har gjort i år er at vi også udbyder den på engelsk, og så laver vi kun 1 hold, og så kører den på engelsk, men vi har simpelthen ikke haft så mange ansøgninger. Derfor har vi valgt at vi ikke opretter hold i år. Den er jo som i nok kan se ikke fjernet fra hjemmesiden. Der står bar at der ikke optages studerende lige foreløbig. Grunden til vi ikke har fjernet den, er at vi tænker i alternative løsninger, 20

for det er en rigtig god uddannelse. Så derfor arbejder vi på at få den som linje på markedsføringsøkonom. Den uddannelse har nemlig samme adgangskrav som denne. Så derfor arbejder vi arbejder vi hårdt at få den ind som linje på markedsføringsøkonom, og så håber jeg at der er flere der vælger det der, men den kommer højst sandsynligt til at være på engelsk. 21

CSS, bilag. Nr. 2 <style type="text/css"> div.img { margin:2px; border:1px solid #0000ff; height:auto; width:auto; float:left; text- align:center; } div.img img { display:inline; margin:3px; border:1px solid #ffffff; } div.img a:hover img { border:1px solid #0000ff; } #textcontent a{ font- size:20px; color: #1fea15; text- decoration:0; } div.desc { text- align:center; font- weight:normal; width:120px; margin:2px; } </style> 22

Ghantt chart, bilag 3 23

Idegenerering, bilag 4 Idegenerering Hovedhjemmesiden: modernisme. Firkanter, blå, grøn, hvid og sort baggrund Underhjemmesiden, frie side: kører samme stil som forsiden Check point: Starter med forsiden surrealisme, herefter kan man klikke ind på vores frie side og derfra komme ind på vores stilart. Farverne skal være neutrale såsom blå.. Sekunder farver rød, grøn, blå, gul, sort og hvid. Trekanter, firkanter, cirkler Forside, gågade i en storby, høje bygninger i hver side, gågade i midten hvor der står et bord med en computer, her kommer flyvemaskinen ud. Flyvemaskinen flyver ud af skærmen, herefter bliver siden sort/hvid. LOGO og derefter vores hjemmeside. 24