REDESIGN AF SØREN K S WEBSITE SKREVET AF KARINA MAHMUD OLE SERGIO CLAUS

Størrelse: px
Starte visningen fra side:

Download "REDESIGN AF SØREN K S WEBSITE SKREVET AF KARINA MAHMUD OLE SERGIO CLAUS"

Transkript

1 REDESIGN AF SØREN K S WEBSITE SKREVET AF KARINA MAHMUD OLE SERGIO CLAUS

2 WEBSITE - PROJEKT 3 Cphbusiness Lyngby Multimediedesigner MUL- A 1. semester, 2012 PROJEKT URL LÆRERE Ditlev Skanderborg (DSK) Morten Rold (MORO) Merete Lindemann (MLI) Ian Wisler- -Poulsen (IWPO) UDARBEJDET AF: Claus Buus Ole Hansen Mahmud Sahan Karina Rossing Kjær Hansen Sergio Calero

3 INDHOLD INDLEDNING 4 PROJEKTPLANLÆGNING 4 WBS 4 Gannt-diagram 4 Risikoanalyse 4 EKSPERTVURDERING 4 DESIGNBRIEF 4 KOMMUNIKATIONSANALYSE 5 FLOWCHART 6 KODEEKSEMPLER 7 HTML 7 CSS 8 JavaScript 8 DESIGN DOKUMENTATION 13 BRUGERTEST 13 PROCESBESKRIVELSE & EVALUERING 13 LITTERATURLISTE 13 BILAG 1 - WBS 14 BILAG 2 - Gannt-diagram 15 BILAG 3 - Risikoanalyse 16 BILAG 4 - Ekspertvurdering 17 3

4 INDLEDNING Gruppen har fået til opgave at re-designe websitet for restauranten søren k s hjemmeside. Opgavens fokusområde er funktionalitet, da restaurantens kunder har oplyst, at det er et problem at navigere og finde nødvendige oplysninger på websitet. Re-designet af websitet skal være et nykodet website efter gældende normer indenfor internationale regler og standarder. PROJEKTPLANLÆGNING WBS Ved hjælp af WBS (Work Breakdown Structure) har vi lavet en agenda for de forskellige arbejdsområder i projektet. Vi har fastsat milepæle med ønsket om at arbejde struktureret med henblik på at sikre os det bedst mulige overblik igennem projektforløbet. (Se bilag 1) GANTT-DIAGRAM Vi har planlagt vores tid vha. et Gannt-diagram og nedbrudt projektet i relevante arbejdsopgaver. Et Gantt-diagram er et vigtigt værktøj til at skabe overblik over et projekt. (Se bilag 2) RISIKOANALYSE For at imødekomme eventuelle risici er det nødvendigt at lave en risikoanalyse. Allerede i begyndelsesfasen af et projekt opstilles en tabel, der har til formål at skabe overblik over mulige risici (Se bilag 3). Tabellen indeholder de forskellige risici samt graden af disse. Derudover forklares konsekvensen af de opstillede risici og til sidst en løsning på at imødekomme dem. EKSPERTVURDERING Som led i gruppens researchproces har vi lavet en ekspertvurdering på det oprindelige website for restauranten søren k. En ekspertvurdering har til formål at finde fejl og mangler, der påvirker websitets kvalitet i brugen. For at løse sitets usabilityproblemer udførte gruppens fem medlemmer alle testen individuelt, for derefter, i fælleskab, at sammenligne, diskutere og vurdere fejlene. Testen er lavet med udgangspunkt i 10 af usabilityeksperten Jakob Nielsens mest anerkendte heuristikker. Dokumentation af testens resultat har vi noteret i et log-skema (Se bilag 4). DESIGNBRIEF Ved fælles gennemgang af søren k s eksisterende website, blev vi hurtigt enige om fem simple krav til vores redesign: enkelthed, relevans, overskuelighed, troværdighed og tilpasset sprogbrug. Det nye design bør være simpelt og enkelt. De vigtige elementer skal fange brugerens opmærksomhed, samtidig skal designet være relevant for websitets formål og budskab. Overskuelighed på det nye website er afgørende for brugervenligheden, mens sprog og mængden deraf skal tilpasses målgruppen. 4

5 På det eksisterende website er der fundet mange gode og designmæssige flotte elementer. Disse elementer kan genbruges i hel- eller delvis oprindelse. På baggrund af en ekspertvurdering har vi fundet en del elementer, som ikke virker eller virker i mindre grad, samt nogle uhensigtsmæssige funktioner eller funktioner som ikke virker overhovedet. Et restaurantbesøg kan ofte være en pludselig indskydelse. Valg af restaurant kan træffes på baggrund af en søgning på internettet. Det må påregnes at denne søgning kan foretages i bil, tog, bus osv. - Websitet skal altså fungere på alle typer mobile enheder og må derfor ikke indeholde flashelementer. Websitet skal afspejle den kvalitet, som det gamle indeholdt, men i en nyere og bedre fungerende stil. Det er vigtigt at vise tilbudene på en sådan måde, at kunderne vil blive fristet til at købe flere retter efter trin for trin metoden. Det er vigtigt at vise diverse retter med indbydende fotos. Præsentationen af varerne og virksomhedens betjening og service skal gå hånd i hånd og ledsage brugeren i tiden efter besøget. Af større ændringer skal der laves nye farver, som gør sitet mere lyst og porøst uden at miste værdien af præsentationen. Der bør flyttes og ændres på emner i hovedmenuem, så navigation bliver bedre. Der må ikke være et eneste dødt link på sitet. Der skal flyttes og sorteres i fotomaterialet og de grafiske elementer, som ikke lever op til resten af kvaliteten på sitet skal rentegnes og reproduceres. KOMMUNIKATIONSANALYSE Følgende afsnit er en kommunikationsanalyse af restauranten søren k s website. Analysen er baseret på en kommunikationsmodel med udgangspunkt i forskeren Harald Dwight Lasswells formel; Hvem siger hvad til hvem i hvilken kanal med hvilken effekt. Støj Afsender Budskab Modtager Formål Medie Effekt For at en kommunikationsproces kan finde sted, er afsender og modtager en nødvendighed. I dette projekt skelnes der mellem primær og sekundær afsender. Førstnævnte er restauranten søren k, da det er den part, der tager initiativ til, at kommunikationen skal finde sted. Den sekundære afsender er projektgruppen, der udarbejder websitet. Budskabet er afgørende for restaurantens mening med websitet. Websitets budskab er helt enkelt at restauranten er værd at besøge. Hvis kommunikationsprocessen lykkes succesfuldt, vil modtager konkludere samme. Den ønskede effekt med budskabet er at tiltrække nye kunder samt bibeholde nuværende kunder, mens formålet med denne effekt er at restauranten tjener penge og opnår popularitet. Den overordnede målgruppe for restauranten søren k er unge, voksne- og ældre mennesker. En analyse af målgruppen for restauranten, som produkt, afgrænser målgruppen yderligere. Restauranten er placeret i Den Sorte Diamant Det Kongelige Biblioteks tilbygning - med udsigt til vandet i hjertet af København. 5

6 Derudover leverer restauranten alle cateringopgaver i Den Sorte Diamant, hvor større arrangementer, såsom festarrangementer, konferencer og receptioner, afholdes. Beliggenhed, kvalitet og pris hænger ofte sammen og sorterer i målgruppen. Målgruppen for restauranten kan derfor defineres som kunder, både private og firmaer, med interesse for kvalitet. I en analyse af restaurantens website kan det dog forsvares at karakterisere modtager som et publikum. Publikummet kunderne - vælger selv på et bredt marked og bruger websitet til at søge information om restauranten. Der er ikke tale om tydelig målrettet kommunikation på websitet, dog påvirker designmæssige virkemidler formidlingen af sitets budskab positivt. Støj, såsom dårlig omtale og tekniske problemer, kan derimod påvirke formidlingen negativt. Websites for forskellige restauranter giver kunder mulighed for at undersøge markedet online og blive informeret om forskellige spisesteder. Dette giver kunderne mulighed for at finde præcis den restaurant, de ønsker. Websitets optimerede brugervenlighed og informationsarkitektur samt design giver kunden mulighed for problemfrit at søge information om restauranten, mad, priser, beliggenhed samt online bordbestilling. Udfaldet af den optimale kommunikationsproces er, at kunden via websitet finder restaurant søren k et besøg værd. FLOWCHART Vi har udarbejdet et flowchart, der giver en oversigt over navigationen. Det indikerer hvilke sider websitet består af, og hvordan de er placeret i forhold til hinanden. 6

7 KODEEKSEMPLER På websitet er der anvendt kodning i HTML-5 og CSS-3 externt stylesheet, samt javascript. HTML HTML koderne i ovenstående eksempel genererer en kasse <div> med listet indhold. Kassen skal i dette tilfælde fungere som en menu. Liniernes tekst i listerne skal optræde som link, som sender brugeren videre til andet indhold, når der klikkes på dem. Listerne <ul> består at liste-elementer eller linier <li> og endvidere er der indsat endnu en liste <ul> under et liste-element for at danne undermenupunkter i menuen. Linkene i HTML skrives som <a href= > hvor der imellem anfører hvor hen brugeren ska sendes. I linkene herover er indsat et # som bruges i testfasen inden det rigtige link isættes. Dette gøres for at se om linkteksten opfører sig som et link uden at sende brugeren videre. Hvis disse koder vises i en browser, ser det sådan ud: Rene HTML koder danner dette indtryk. For at forandre dette indtryk skal der tilsættes styling i form af CSS-kodning. Stort set alt HTML kan pyntes og styles med CSS og vise hvad der ønskes, bl.a. former, farver, kanter, margin, typografi, streger, kasser mv. 7

8 CSS Hvis der tages udgangspunkt i ovenstående eksempel, med den anvendte HTML-kodning, ønskes en styling af typografi og baggrund mv. Fra basic er link stylet med en streg under og er blå og liste-elementer er basic stylet med udfyldte eller åbne prikker mv. Baggrunden skal i dette tilfælde indeholde en farve og teksten skal ikke have prikker og linjer under. Endvidere ønsker man at overholde visse indryk, marginer og afstande. Dette kom tl at se sådan ud i CSS: Som det fremgår af koderne, er de vidt forskellige fra HTML kodningen i dokumentet. CSS kodning kan enten foretages hvor det skal anvendes eller kodes i et ark ved siden af dokumentet og derefter linkes ind. Disse metoder kaldes hhv. for in-line styling eller styling ved hjælp af eksternt style-sheet. Når man kobler ovenstående koder til de før beskrevne HTML-koder, ser det ud som til højre. JAVASCRIPT Udover HTML og CSS kodning er der i sitet også anvendt javascript kodning. Denne kodning er en helt anden form for kodning og er særlig idet det er Objekt Orienteret kodning. Denne type kodning anvendes især på meget store sites og grundlaget er Microsoft programmet: Visuel Basic. På denne site er javascript-kodningen hentet på internettet og tilrettet til vores brug. Dette er gjort, fordi det ikke, uden meget indgående kendskab til for- og backgroundkodning, er muligt at kode selv. Scriptet i vores tilfælde befinder sig på forsiden, og gør at bannerbillederne slider ind fra højre og skifter hele tiden. Javascriptet er et gratis kodekompleks, som alle kan få del i på Da selve scriptet er et meget stort kodekompleks, har vi fravalgt at vise det her. 8

9 DESIGN DOKUMENTATION REDESIGN AF Et af vores vigtigste krav til redesignet var, at det skulle være enkelt og vi ønskede ikke at gå helt væk fra det oprindelige design og stilen. Derfor er nogle af elementerne forblevet, som de var før. OPSÆTNING I det oprindelige site er der kasser (nogle baggrundskasser, footeren og en kasse under menuen), som går helt ud til kanten af skærmen. Dette skaber tomrum imellem dem, hvor man som bruger forventer indhold. I starten af vores redesignproces fik vi hele indholdet samlet i en kasse, sådan at det hele var lukket inde i en kasse, men det gjorde, at det hele blev pakket sammen, og sitet blev tungt at se på. For at undgå dette har vi i stedet klippet de lange kasser fra det oprindelige site, så siden af menuen og footeren flugter med indholdet imellem dem. På den måde har vi stadigvæk samlet det hele sammen, men alligevel givet luft imellem objekterne, så det ikke bliver tungt at se på. Grundet den sorte kasse med indhold nederst på forsiden og introsiderne fremstår det oprindelige site som delt i to. Dette er løst ved at sætte alt indholdet imellem menulinjen og footeren i én kasse - i tilfælde af at der skal flere kasser til, får de alle samme farve. Menulinjen og footeren har fået samme farve og danner en åben ramme omkring indholdet. Kassen bag indholdet i undersiderne fader ud jo længere man scroller ned og forsvinder helt til sidst. Dette er gjort, fordi der ellers, i tilfælde af, at der er meget tekst, er en tom kasse i venstre side (underside-menu-kassen). 9

10 GRIDS Det redesignede site er sat op i grids. På den måde har vi prøvet at organisere det rum, vi havde at arbejde med. Grids er med til at skabe komfort for øjnene, så det var vigtigt for os at udnytte det - især fordi det oprindelige site er så rodet, som det er. Man kan i det oprindelige site ikke finde ud af, hvor man skal kigge for at finde det, man søger. GESTALTLOVE Vi har prøvet at sætte objekter, som hører sammen, i kasser, linjer, ens farver og tæt på hinanden, så brugeren ikke er i tvivl om, hvad der er hvad, og hvad der hører sammen. Forskellige gestaltlove er taget i brug og overholdt - heriblandt loven om lukkethed, lighed, ensartethed og nærhed. Dette ses bl.a. ved menulinjen og footeren. SCROLLING Brugerne er ikke så glade for at scrolle - især når det gælder forsiden på et site. På forsiden på det oprindelige site er vigtigt indhold placeret nederst og brugeren bliver derfor tvunget til at scrolle for at se det. Vi har derfor prøvet at få alt information samlet øverst, så dette ikke er nødvendigt. Billedet til venstre er et screenshot af søren k s forside med 5 vigtige klikbare billeder, som man kun kan se toppen af. FARVEVALG Med farvevalget har vi valgt ikke at gå helt væk fra de farver, som allerede er i det oprindelige site. Vi har dog prøvet at give sitet et mere imødekommende og varmt udtryk. Dette er for at give de varme billeder af restaurantens varme sager lidt mere liv, så hele designet i en helhed fungerer, samt få brugeren til at føle sig velkommen, tryk og tilpas på siden. BAGGRUNDSFARVEN En af de ting, som vi i det oprindelige site synes er et problem, er den kedelige og lidt kolde grå baggrundsfarve sitet har, som i helheden gør, at billederne også bliver lidt kolde og man føler ikke man er velkommen. Vi har givet den en tilpas gylden farve, som vi mener hjælper med at gøre siden varmere og som smelter sammen med billederne, så det hele fungerer i en helhed. Den gamle grå farve har den fordel, at billederne bliver fremhævet lige en tand mere. Det er selvfølgelig også vigtigt, men vi mener, at helhedsfunktionen lige netop på et restaurant-site, som søren k s, er vigtigst, da søren k på siden har meget information (både tekst og billeder), som kræver at man bliver på siden lige en stund ekstra i forhold til andre sites. 10

11 BESTIL BORD -KNAPPEN Bestil bord -knappen på det eksisterende site er blå og har runde hjørner, hvilket gør, at man let overser den. De runde hjørner har den ulempe her, at knappen ikke får øjet til at stoppe op og kigge, men i stedet bare kører videre. Derfor har vi valgt at designe en stor og kantet firkant. Farven er grøn, fordi det er den mest dominerende farve, hvis man kniber øjnene og kigger på forsiden. Der er ingen grund til at have en ekstra farve på siden, da vi som tidligere nævnt går efter en helhedsfunktion, der virker. Den grønne farve symbolerer bl.a. sundhed. FOOTEREN Designet af footeren er den samme som i det oprindelige site. Dog er bankoplysningerne fjernet, da vi mener at bankoplysninerkan udvæksles på anden måde i tilfælde af bord-bestilling eller andre situationer. MENUEN Menupunkter er fjernet og tilføjet. Første menupunkt er omdøbt fra at hedde Restauranten til at hedde Menukort. Når man læser Restauranten tænker man, at knappen fører til information om stedet - lidt ligesom menupunktet Om os. Da knappen fører til undersider, der alle handler om menukort, har vi valgt at kalde den det. Ydermere mener vi ikke, at cafe øieblikket hører til i menulinjen, da den ikke har så meget at gøre med selve siden og er derfor misvisende for nye kunder. Menulinjen bør kun bestå af overordnede emner, som siger noget om søren k. For at tydeliggøre forskellen på restauranten og cafeen har vi fjernet den fra menuen og i stedet sat den på forsiden i form af et reklamebillede. Som det sidste har vi tilføjet menupunktet Kontakt. Næsten alle brugere vil søge efter kontaktinformationer på sitet. Det er derfor vigtigt, at knappen fremtæder tydeligt. Menuknapperne er redesignet. Fra at være løse tekstknapper uden rammer omkring, har vi lukket dem inde i en lang sort kasse/ramme. Når man holder musen over knapperne, bliver teksten markeret med samme farve som sitets baggrundsfarve. Den lille detalje med markeringen viser brugeren, at sitet rent faktisk virker. Teksten forbliver markeret, når man klikker sig ind på en knap. Menuteksterne er lavet korte og præcise, så brugeren ikke er i tvivl om navigationen. Det er også meget vigtigt at man altid kan klikke sig tilbage på den forrige side man var i, så man ikke lige pludselig ender på en side uden at kunne komme videre. Dette skaber ro på siden og troværdighed hos brugeren. Derfor har vi en underside-menu i venstre side, når man klikker sig ind på en underside. Denne underside-menu fungerer som en brødkrummesti og har en You are here -indikation. Alle de hovedsider og undersider, brugeren har klikket sig ind på, bliver i underside-menuen markeret med den farve, sitet har som baggrundsfarve. 11

12 LOGOET Vores redesign giver ikke brugeren valget mellem sprogene dansk og engelsk og knapperne er derfor fjernet. Dette har medført, at der er skabt en unødvendig stor luft mellem logoet og toppen af sitet, som visuelt ikke så så godt ud i en helhed med resten af siden. Derfor er logoet gjort lidt større, mens det er flyttet længere op. Til venstre ses udviklingen af logoets størrelse og placering, samt farveændringen af baggrunden og den nye placering, som menupunktet Kontakt hat fået. BILLEDER OG TEKST I alle undersider er der øverst placeret et billede, som siger noget om emnet. Man siger, at billeder siger mere end 1000 ord. Hvis kun der stod tekst, ville det se tungt og kedeligt ud. Undersider som Frokostkort har to hovedtitler. For at tydeliggøre dette, har vi adskilt dem ved at sætte et billede ind imellem. Alle billederne er taget, redigeret og brugt fra søren k s oprindelige site. Linjelængden på teksten i undersiderne var alt for lange og gjorde teksten tung at kigge på. Da søren k har meget vigtig information, som de udformer i form af tekst, er dette et stort problem. Derfor har vi forkortet linjelængden - yderligere er alle tekster i det oprindelige site læst igennem og rettet for stavefejl og unødvendige gentagelser. YDERLIGERE ÆNDRINGER Vigtige klikbare billeder såsom Menukort og Hold fest på søren k er i det oprindelige site skubbet ned i bunden af forsiden pga. et stort banner med billeder og tekst, som ligger lige under menuen. Dette ville vi finde en løsning på og startede med at fjerne banneret helt og flyttede de klikbare billeder øverst. Efter at have afprøvet det, blev vi i gruppen enige om, at banneret ikke kunne undgås, da der på forsiden ellers ville mangle information om restauranten. Godt nok var der billeder, men lidt tekst er altid godt for at få brugeren til at blive interreseret og søge på et site, som kun er et klik væk. Derfor blev vi nødt til at finde en løsning på det. Vi fik løst problemet ved at sætte banneret og knapperne ved siden af hinanden i grid øverst på siden. Afstanden mellem knapperne og banneret er lidt større end den afstand, der er imellem selve knapperne - dette for at overholde loven om nærhed. Ovenover ses et eksempel ud af flere forsøg på at løse problemet med de klikbare billeder. 12

13 BRUGERTEST På ethvert projekt, der berører optimering af usability, vil det være ideelt at lave en afsluttende test. I dette tilfælde en brugertest/brugervenlighedstest. I en brugertest kan det afprøves, om brugeren kan navigere på sitet og finde de nødvendige informationer, samt give indblik i, hvad brugeren tænker i brugen på sitet. Formålet med denne test er, for gruppen, at forstå hvor brugeren oplever eventuelle problemer på websitet, for efterfølgende at rette op på disse. Brugertesten er ressourcekrævende, fordi der er en del forberedelse. Testen kræver både forberedelse af spørgsmål og testopgaver samt udførelse. Grundet tidsog ressourcemangel har vi ikke udført en usabilitytest på det redesignede website. PROCESBESKRIVELSE & EVALUERING Gruppen har som udgangspunkt forsøgt at arbejde kollaborativt og effektivt. Vi har fordelt de enkelte arbejdsopgaver imellem gruppens medlemmer. Efterfølgende har vi arrangeret et møde, hvor vi har gennemgået og evalueret de stillede delopgaver. Derefter har vi fordelt arbejdsopgaver igen, afholdt endnu et gruppemøde, gennemgået og evalueret og aftalt nyt mødetidspunkt. Gruppen har enkeltvis og i fælleskab arbejdet intensivt med arbejdsopgaverne og tidsplanen er blevet overholdt. Som sidste led i projektet har vi i fælleskab sammenfattet en rapport. Alt i alt har gruppearbejdet fungeret optimalt, og vi er endt ud med et tilfredsstillende produkt. Det redesignede site er til sidst HTML5 og CSS valideret uden fejl. LITTERATURLISTE Jacobsen, J. K. (2011). 29 spørgsmål (2. udgave). Samfundslitteratur Gregersen, O. & Wislet-Poulsen, I. (2009). Usability (1. udgave). Grafisk Litteratur Wisler-Poulsen, I. (2012). 20 Designprincipper (1. udgave). Grafisk Litteratur Fischer, L. H. (2010). Digital Media Management (3. udgave). Nyt Teknisk Forlag Materiale fra fronter 13

14 BILAG 1 - WBS 14

15 BILAG 2 - Gannt-diagram 15

16 BILAG 3 - Risikoanalyse HÆNDELSE SANDSYNLIGHED KONSEKVENS BESLUTNING Tidsplanen holder ikke Dårligt kommunikation i gruppen Manglende viden til at løse opgaven For meget tidspilde ved gruppemøder Pludseligt tabt af information/ opgaven Forkert designudvikling Useriøst indsats til løsning af opgaven Lille Lille Lille Lille Mellem Vi får ikke leveret produktet til kunden Usammenhængende opgave Svært at danne belæg for anvendte teorier Ikke bruger tiden konstruktivt Projektet går i stå. Risiko for for sen aflevering Vi starter i god tid og holder gruppens aftaler og møder Via gruppemøder og Drop Box kan vi alle følge opgavens udvikling Vi sætter os ind i de emner, teorier og tekniske krav der kræves for at løse opgaven Vi er seriøse og målrettede når vi arbejder sammen og har gruppemøder Vi har alle opgaven liggende på vore computer og i gruppens Dropbox Stor Redesign Vi har et konstant interndialog og overblik i forhold til designudvikling af opgaven Mellem Manglefuld opgave. Vi aftaler i gruppen at vi alle arbejder målrettet. Der kan muligvis skrives et gruppekontrakt 16

17 BILAG 4 - Ekspertvurdering HEURISTIK/ DESIGNPRINCIP: Navn og nummer LOKATION: URL PROBLEM: Beskrivelse af brugerens problem KATEGORI: 1-4 LØSNING: Forslag til løsning på problemet #8 Æstetisk og minimalistisk design Restaurantens_ frokostkort.html For meget og rodet info på websitet. 4 Løsning: Færre menupunkter og information prioritering og reducering. #8 Æstetisk og minimalistisk design Websitet fremstår som delt i to grundet den sorte boks med indhold nederst på intro -siderne. 3 Nyt design ingen visuel opdeling af sitet. #3 Brugerkontrol ogfrihed intro-om-os.html Brømkrummesti er ikke gennemgående logisk. I nogle tilfælde er titlen på undersiden det samme som undersidens navn i menuen - andre gange ikke. 3 Navngivning konsekventgøres. Undersidens titel i brødkrummestien bør være det samme som i menuen og kun stå en gang. Tilbageknap på samtlige sider vil optimere navigationen yderligere. #8 Æstetisk og minimalistisk design Restaurantens_ frokostkort.html Gennemgående tekst/ informationer Det samme tekst står alt for mange gange. 3 Fordel oplysning på siderne. Gentagelser sker kun, hvis det er nødvendigt. #4 Konsistens og standarder vinkort.html Døde links, døde links til billeder, billeder der åbner i ny fane, en vin i vinkort uden pris osv. 3 Alt skal virke og være optimalt. #8 Æstetisk og minimalistisk design Restaurantens_ frokostkort.html Teksten på undersiderne forekommer uoverskuelig at læse. 3 Forkortet linjelængden. #2 Sammenhæng mellem website og den virkelig verden Menupunktet Cafe Øieblikket er misvisende for nye kunder. Kunder registrerer ikke nødvendigvis at det er en helt ny restaurant/café. 2 Tydeliggør forskellen på restauranten og cafeen skal ikke ligge som menupunkt. Vises evt. på startsiden i form af reklamebillede. #4 Konsistens og standarder Links er ikke visuelt ens, nogle understreges andre markeres med farve. 2 Konsekvent styling af links. #2 Sammenhæng mellem website og den virkelig verden Ulogisk placering af menuer. Ulogisk navngivning 2 Optimering af informationsarkitekturen #4 Konsistens og standarder vinkort.html Opsætning af navne og priser på vinkortet er ikke ensartet medfører et rodet indtryk. 1 Konsekvent 17

Hjemmeside redesign af Dansk Jagt- og Skovbrugsmuseum

Hjemmeside redesign af Dansk Jagt- og Skovbrugsmuseum Hjemmeside redesign af Dansk Jagt- og Skovbrugsmuseum Usability dokumentation Lavet af Sarina, Maria og René MulB-13 22.11.2013 I forbindelse med ekspertvurderingstests udarbejdes som hovedregel altid

Læs mere

Headeren er for stor når man kommer ind på siden. Det virker irriterende at man skal scrolle for at få indholdet vist.

Headeren er for stor når man kommer ind på siden. Det virker irriterende at man skal scrolle for at få indholdet vist. Ekspertvurdering Antal af eksperter: 1 Tid brugt til evaluere website: 2 timer. Konklusion: Da jeg gennemgik sitet for fejl, mangler og problemer fandt jeg hurtigt ud af, at det største issue var tekst,

Læs mere

Portfolio redesign. Kia Dahlen! cph-kd51@cphbusiness.dk! 1. semester eksamen! MUL-A 2013! !!! www.mul17.itkn.dk/portfolio/index.html!

Portfolio redesign. Kia Dahlen! cph-kd51@cphbusiness.dk! 1. semester eksamen! MUL-A 2013! !!! www.mul17.itkn.dk/portfolio/index.html! Portfolio redesign Kia Dahlen cph-kd51@cphbusiness.dk 1. semester eksamen MUL-A 2013 www.mul17.itkn.dk/portfolio/index.html Underviserer: Ditlev Skanderby Frederik Tang Ian Wisler-Poulsen Jesper Hinchely

Læs mere

Portfolio Redesign Kamilla Klein 1. Semester eksamen

Portfolio Redesign Kamilla Klein 1. Semester eksamen 2014 Portfolio Redesign Kamilla Klein 1. Semester eksamen Lærene: Ditlev Skanderby Frederik Tang Ian Wisler- Poulsen Jesper Hinchely Merete Geidemann Lützen Morten Rold Thomas Hartmann Erhvervsakademiet

Læs mere

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

Et krav til portfolien var at det skulle udvikles fra bunden uden brug af CSS-frameworks, samt HTML og CSS skulle valideres uden fejl. Indledning Mit sidste projekt her på 1.semester gik ud på at jeg skulle lave et redesign af mit første portfolio, som jeg lavede i starten af semesteret. Formålet var at vise hvad jeg havde lært siden

Læs mere

Portfolie Redesign. www.gaardbodesign.dk. Multimediedesigner CPH Business 1. sem. eksamensprojekt - Clmul-b12e Januar 2013. Jens Jákup E.

Portfolie Redesign. www.gaardbodesign.dk. Multimediedesigner CPH Business 1. sem. eksamensprojekt - Clmul-b12e Januar 2013. Jens Jákup E. Portfolie Redesign www.gaardbodesign.dk Multimediedesigner CPH Business 1. sem. eksamensprojekt - Clmul-b12e Januar 2013 Jens Jákup E. Gaardbo indholdsfortegnelse design... gestaltlove... opbygning...

Læs mere

FAKTA 3 INDLEDNING 4 KREATIV PROCES 4 INDLEDENDE FASE 4 DESIGNVALG 6 TYPOGRAFI 6 FARVER 6 LOGO 6 BRUGERGRÆNSEFLADE 6 BAGVEDLIGGENDE KODE 7

FAKTA 3 INDLEDNING 4 KREATIV PROCES 4 INDLEDENDE FASE 4 DESIGNVALG 6 TYPOGRAFI 6 FARVER 6 LOGO 6 BRUGERGRÆNSEFLADE 6 BAGVEDLIGGENDE KODE 7 FAKTA 3 INDLEDNING 4 KREATIV PROCES 4 INDLEDENDE FASE 4 DESIGNVALG 6 TYPOGRAFI 6 FARVER 6 LOGO 6 BRUGERGRÆNSEFLADE 6 BAGVEDLIGGENDE KODE 7 EKSPERTVURDERING 10 REDESIGN AF PROJEKTER 12 BANNERPROJEKT 12

Læs mere

Portfolioudvikling. Line la Fontaine. Multimediedesigner

Portfolioudvikling. Line la Fontaine. Multimediedesigner Portfolioudvikling Line la Fontaine Multimediedesigner Indholdsfortegnelse - Designvalg s. 1-9 - Målgruppe s. 1 - Wireframes/skitser s. 1-5 - Informationsarkitektur s. 6-7 - Farver s. 8 - Typografi s.

Læs mere

T o b i a s W e x i ø S o n n e MultiMedieDesigner CPH-Business 1/26

T o b i a s W e x i ø S o n n e MultiMedieDesigner CPH-Business 1/26 T o b i a s W e x i ø S o n n e MultiMedieDesigner CPH-Business 1/26 Indholdsfortegnelse - Intro - Mindmap - Designvalg - Farvevalg - Logo - Ensartethed - Farver - Det gyldne snit - Fleksibilitet & brugbarhed

Læs mere

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

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 WORKFLOW Indhold Grafisk workflow Procesbeskrivelse Inspiration 5 Skitser 6 Flowchart Typografi og farver 8 Skelet 9 Storyboard 2 Html, css og seo 6 Grafisk workflow Opgaven At skabe et nyt og

Læs mere

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å

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å Grafisk design Design af hjemmeside til indretningsarkitekt med firma navn enrico indret, som jeg tidligere har designet logo for. Firmaet laver udelukkende erhvervsindretning og målgruppen for sitet er

Læs mere

REDESIGN AF PORTFOLIO 16. jan. 2015

REDESIGN AF PORTFOLIO 16. jan. 2015 REDESIGN AF PORTFOLIO 16. jan. 2015 Christoffer Møller Jarolics CPH Business Lyngby Multimediedesign Udviklingsprocessen af tilblivelsen af dette projekt redesign af portfolio, vil på de følgende sider

Læs mere

Stine Dorry Meulengracht Madsen Rapport Multimedie og kommunikation

Stine Dorry Meulengracht Madsen Rapport Multimedie og kommunikation Portfolioudvikling I denne rapport vil du kunne læse om mit porfolios tilblivelse. Det skal give læseren indblik i mine designvalg og hele processen bag projektet. Hjemmesiden er kodet fra bunden i HTML

Læs mere

Carlas cupcakes. Projekt. http://bysileha.com/2.semester/cupcake/remake/index.html

Carlas cupcakes. Projekt. http://bysileha.com/2.semester/cupcake/remake/index.html Projekt 3 http://bysileha.com/2.semester/cupcake/remake/index.html Carlas cupcakes Amanda Hüttel Lindschouw Michelle Denise Andersen Simone Lenander Hansen Indholdsfortegnelse PROJEKTFORMULERING 1.0 3

Læs mere

GRAFISK PRODUKTION & WORKFLOW. Endotest website

GRAFISK PRODUKTION & WORKFLOW. Endotest website GRAFISK PRODUKTION & WORKFLOW Endotest website DOKUMENTATION OPGAVEN: Endotest ApS ønskede at redesigne deres hjemmeside, så den fremstår mere professionel og enkel. Derudover skal det nye site præsentere

Læs mere

Grafisk design. Ide. Designprocess. Målgruppe

Grafisk design. Ide. Designprocess. Målgruppe Ide Designprocess I denne opgave har jeg udviklet et website for et feriehus. Kunden ønsker et site, som både fungere privat, men også som offentlig hjemmeside. Hele site skal være på dansk, tysk og engelsk.

Læs mere

Projekt 2, Banner. Project 02 - Banners. Gruppenummer: 8

Projekt 2, Banner. Project 02 - Banners. Gruppenummer: 8 Projekt 2, Banner Project 02 - Banners Gruppenummer: 8 Navne/mail: Kasper Nick Thomasen(k.n.thomasen@gmail.com), Christian Lund (christianlund_667@hotmail.com), Alexander Kofoed (laemse@hotmail.dk) Hold:

Læs mere

Kend dine brugere. Om brugertest. 2 sem., feb. 2010 Multimediedesigner, København nord

Kend dine brugere. Om brugertest. 2 sem., feb. 2010 Multimediedesigner, København nord Kend dine brugere Om brugertest 2 sem., feb. 2010 Multimediedesigner, København nord Andreas Frandsen, Ninette Nielsen Agnete Gnistrup, Senia Lundberg Side 1 af 7 Indholdsfortegnelse Indledning s. 2 Valg

Læs mere

Projekt 3: User friendly website Soerenk.dk re-design

Projekt 3: User friendly website Soerenk.dk re-design Projekt 3: User friendly website Soerenk.dk re-design Mul-A, Gruppe 3, URL: http://bruhn-design.dk/index.aspx Annemette Bruhn cph41.webkn.dk Caroline Vikke Lundhild Madsen cph57.webkn.dk Julia Brøndum

Læs mere

4. DEC 5. DEC 8. DEC 2014

4. DEC 5. DEC 8. DEC 2014 1. DEC I dag fik jeg opgavebeskrivelsen og fik et overblik over, hvad der skal laves, ved at gennemgå opgavebeskrivelsen, samt lave en brainstorm og PBS. Jeg er i gang med at finde et alternativ til programmet

Læs mere

1 Robbins, Jennifer N.: Learning Web Design, s. 41

1 Robbins, Jennifer N.: Learning Web Design, s. 41 I designarbejdet forbundet med at udvikle en hjemmeside, er det vigtigt at gøre sig nogle overvejelser over hvilken optimale skærmstørrelse man designer til, da dette har konsekvens for den efterfølgende

Læs mere

Projekt 5 - Porfolio Redesign

Projekt 5 - Porfolio Redesign Projekt 5 - Porfolio Redesign 1 semester - Copenhagen Business School Business School. 1/20 Indholdsfortegnelse Projektbeskrivelse...side 3 Mindmap...side 4 Project Breakdown Structure...side 5 Work Breakdown

Læs mere

Grafisk workflow. Hjemmeside til Bærkompagniet

Grafisk workflow. Hjemmeside til Bærkompagniet Grafisk workflow Hjemmeside til Bærkompagniet Dokumentation Opgaven Bærkompagniet skulle have designet og programmeret et website, hvor de kunne præsentere deres produkter samt mulige forhandlere kunne

Læs mere

HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside

HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside Webdesign og webkommunikation, formiddagshold (hold 1), IT Universitetet, forår 2012. Øvelse 2, individuel øvelse HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside 1. Lidt om hvad du

Læs mere

IDENTIFON. Emil Hauberg, Jakob Christoffersen, Ninette Nielsen og Senia Lundberg

IDENTIFON. Emil Hauberg, Jakob Christoffersen, Ninette Nielsen og Senia Lundberg Emil Hauberg, Jakob Christoffersen, Ninette Nielsen og Senia Lundberg 1 Indholdsfortegnelse side nr. 1. Forside. 2. Indholdsfortegnelse og indledning. 3. Problemformulering og afgræsning. 4. Tidsplan projektplan

Læs mere

Grafisk Design 70% Skitser

Grafisk Design 70% Skitser Grafisk design Grafisk 2 PRODUKT Som et led i den online markedsføring af BBQ Wing it, har jeg valgt at lave et website, med fokus på information. Det er et website, der er baseret ud fra lærte funktioner

Læs mere

WBS. Inledning. Afsluttende projekt 1. sem

WBS. Inledning. Afsluttende projekt 1. sem MARK KRISTENSEN.DK Afsluttende projekt 1. sem Inledning I denne rapport kan du læse om den udviklingsproces, der ligger til grund for min nye portfolio, de metoder jeg har brugt, mine designvalg og designprincipper.

Læs mere

Projekt: Kend dine brugere. Tr09mul02 Andreas Münter Jesper Hansen Tommy Pedersen Robin Hansen

Projekt: Kend dine brugere. Tr09mul02 Andreas Münter Jesper Hansen Tommy Pedersen Robin Hansen Projekt: Kend dine brugere Tr09mul02 Andreas Münter Jesper Hansen Tommy Pedersen Robin Hansen Indholdsfortegnelse Introduktion: 3 Marketing: 3 Usability test: 4 Mockup design 6 Opsumering 7 Konklusion

Læs mere

Produkt. Index side GRAFISK DESIGN

Produkt. Index side GRAFISK DESIGN Grafisk design Produkt Index side Produkt Underside - kontakt Redegørelse OPGAVEN I forbindelse med valgfag, som jeg tog i København, havde vi lært forskellige nye funktioner, som vi skulle implementere

Læs mere

Dokumentation. Karen-Louise Fejerskov

Dokumentation. Karen-Louise Fejerskov Dokumentation Grafisk Workflow Et af produkterne, jeg skulle lave, var et redesign af FreQuence s info hjemmeside. A B Punkt 1 Ansvar: Jeg har selv stået for opsætningen af hjemmeside og selv bestemt,

Læs mere

Bilag 2. Noter. Alternativ: Skriv pakkelabel i søgefeltet Klik på linket ved teksten øverst: pakke labels

Bilag 2. Noter. Alternativ: Skriv pakkelabel i søgefeltet Klik på linket ved teksten øverst: pakke labels Bilag 1 Bilag 2 Projekt 1 - usability test og marketing Gruppe: Senia, Agnete, Andreas, Ninette Website: postdanmark.dk Undersøgelsesområde: navigation og funktionalitet Tests: Brugertest (funktionalitet)

Læs mere

srum Fritidsaktiviteter 04-12-2008: 1. Semester. Multimediedesigner Projektstart: 17/11-2008 Aflevering: 4/12-2008

srum Fritidsaktiviteter 04-12-2008: 1. Semester. Multimediedesigner Projektstart: 17/11-2008 Aflevering: 4/12-2008 Gruppe 9: Besir Redzepi, Jacob Pedersen, Garwun Jeffrey Lai og Sean Rørgren srum Fritidsaktiviteter 04-12-2008: 1. Semester. Multimediedesigner Projektstart: 17/11-2008 Aflevering: 4/12-2008 Indholdsfortegenelse

Læs mere

GRAFISK DESIGN SVENDEPRØVE Dorte Damsgaard Larsen

GRAFISK DESIGN SVENDEPRØVE Dorte Damsgaard Larsen GRAFISK DESIGN SVENDEPRØVE Dorte Damsgaard Larsen OPGAVE Designforslag til hjemmeside til motorcykelklubben Mc Chaufførerne GRAFISK DESIGN / Dorte Damsgaard Larsen 1/15 DESIGNPROCES Indledende møde med

Læs mere

kollegiekokkenet.tmpdesign.dk Side 1

kollegiekokkenet.tmpdesign.dk Side 1 kollegiekokkenet.tmpdesign.dk Side 1 Indholdsfortegnelse Forord 3 Problemformulering 4 Udviklingsmetode 5 Tidsplan 6 Målgruppe 7 Design brief 8 Logo 10 Typografi og farve 11 Navigationsdiagram 12 Usecase

Læs mere

Silkeborg Review Mine sider

Silkeborg Review Mine sider Silkeborg Review Mine sider Datagrundlag Det er vigtigt, at de informationer man viser kan hentes let (hurtigt) fra bibliotekssystemet eller Brønden. Det vil betyde rigtig meget for hastighed i præsentationen

Læs mere

Indhold. 1. Adgang og afslutning

Indhold. 1. Adgang og afslutning 1 Indhold 1. Adgang og afslutning 2. Menupunkter 3. Tekst 4. Billeder 5. Video 6. Lyd 7. Bannere 8. Bokse 9. Dokumenter 10. Links 11. Iframe 12. Markedspladsen 13. Nyheder 14. Job 15. Kalender 16. Selvbetjeningsbjælken

Læs mere

GRAFISK DESIGN. Diner no. 34 Hjemmeside + Visuel identitet

GRAFISK DESIGN. Diner no. 34 Hjemmeside + Visuel identitet GRAFISK DESIGN Diner no. 34 Hjemmeside + Visuel identitet Diner no. 34 9 Opgavebeskrivelse Fiktive opgave. Redesign af visuel identitet og design af ny hjemmeside. Materialet skal skabe et genkendeligt

Læs mere

Relevant skærmdump fra det evaluerede materiale indsættes her BRUGERTESTANALYSE M. 5 TESTBRUGERE

Relevant skærmdump fra det evaluerede materiale indsættes her BRUGERTESTANALYSE M. 5 TESTBRUGERE 1 Relevant skærmdump fra det evaluerede materiale indsættes her BRUGERTESTANALYSE M. 5 TESTBRUGERE 2 Alle testpersonerne giver udtryk for at sitet er forholdsvis nemt at anvende til at finde den information

Læs mere

WORKFLOW & GRAFISK PRODUKTION

WORKFLOW & GRAFISK PRODUKTION Opgavebeskrivelse Kunde: Gorm Larsen & Zornig (GLZ) Websitet Social media cheat sheet er en oversigt over forskellige sociale mediers opsætning. Formålet er altså at gøre det nemt at finde de mål, der

Læs mere

Afsluttende opgave - Kommunikation/IT C Klasse 1.1

Afsluttende opgave - Kommunikation/IT C Klasse 1.1 11-05-2015 Affaldshåndtering Afsluttende opgave - Kommunikation/IT C Klasse 1.1 Hans Rasmussen & Kevin Kumar ROSKILDE TEKNISKE GYMNASIUM Indhold Affaldshåndtering i Grønsted kommune... 2 Krav... 2 Design...

Læs mere

Re-design af Bøssehusets hjemmeside Webdesign og webkommunikation, F2012 Iben Kold Thomsen (hold 1) & Morten Mechlenborg Nørulf (hold 2)

Re-design af Bøssehusets hjemmeside Webdesign og webkommunikation, F2012 Iben Kold Thomsen (hold 1) & Morten Mechlenborg Nørulf (hold 2) Introduktion Vores eksamensprojekt er et re-design af Bøssehusets hjemmeside. Bøssehusets er et kulturhus for bøsser, lesbiske og transseksuelle personer beliggende på Christiania. Huset skaber rammerne

Læs mere

3 usability-tests. med udgangspunkt i Køge Boldklubs web site. Gangstertest. Ekspertvurdering. Kortsortering. Side 1

3 usability-tests. med udgangspunkt i Køge Boldklubs web site. Gangstertest. Ekspertvurdering. Kortsortering. Side 1 3 usability-tests Gangstertest Ekspertvurdering Kortsortering med udgangspunkt i Køge Boldklubs web site Side 1 Køge Boldklubs web site Side 2 Gangstertest I gangstertesten har testpersonen fået stillet

Læs mere

Produktbeskrivelse - Grafisk workflow

Produktbeskrivelse - Grafisk workflow Produktbeskrivelse - Grafisk workflow Opgavebeskrivelse Det er en nyhedsmail. De er en ny opsætning Ansvar for opgaveløsning Webadministratoren står for opgavefordeling. Tekst kommer fra salgs og butikslederen.

Læs mere

GRAFISK WORKFLOW H1 MARIA SCHELDE

GRAFISK WORKFLOW H1 MARIA SCHELDE GRAFISK WORKFLOW H1 MARIA SCHELDE DOKUMENTATION Opgaven Arkitekt Mette Schelde skulle have designet og programmeret et website, hvorpå hun kunne præsentere hendes produkter. Designkrav Sitet skal være

Læs mere

PORTFOLIO SEBASTIAN NYHOLM. Eksamensprojekt. 1. Semester

PORTFOLIO SEBASTIAN NYHOLM. Eksamensprojekt. 1. Semester PORTFOLIO SEBASTIAN NYHOLM Eksamensprojekt 1. Semester Indledning Dette projekt gik ud på at designe og udvikle sit eget portfolio, hvor indhold fra tidligere projekter, læring, brugerteste og begrundelse

Læs mere

LEDIG JOURNALIST? Gruppe 9 2 semester 1 projekt: Website Janni, Jens, Morten & Mikael

LEDIG JOURNALIST? Gruppe 9 2 semester 1 projekt: Website Janni, Jens, Morten & Mikael LEDIG JOURNALIST? Gruppe 9 2 semester 1 projekt: Website Janni, Jens, Morten & Mikael Indholdsfortegnelse Problemformulering Problemformulering... s. 1 Kommunikation... s. 2 Model... s. 2 Analyse... s.

Læs mere

Brugervejledning til Design Manager Version 1.02

Brugervejledning til Design Manager Version 1.02 Brugervejledning til Design Manager Version 1.02 Indholdsfortegnelse 1. Introduktion... 3 1.1 Det kan du med HostedShop Design Manager... 3 1.2 Feature list... 3 2. Design... 4 3. Filer og CSS... 4 3.1

Læs mere

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

HHBR. Design. Kvalitets vurdering. Opgaven. Målgruppe og Budskab. De Grafiske valg Opgaven Der skal designes en hjemmeside til en pensioneret revisor, som ønsker at starte en fritids beskæftigelse op, som privat revisor. Han Ønsker en hjemmeside der skal kort fortælle om hans forretning.

Læs mere

VELKOMMEN 3. KOM GODT I GANG 4 Log ind 5 Kontrolpanel 6 Tilpas profil 7 Tilknyt hold 8 Tilknyt fag 9

VELKOMMEN 3. KOM GODT I GANG 4 Log ind 5 Kontrolpanel 6 Tilpas profil 7 Tilknyt hold 8 Tilknyt fag 9 VEJLEDNING 1.0 Indhold VELKOMMEN 3 KOM GODT I GANG 4 Log ind 5 Kontrolpanel 6 Tilpas profil 7 Tilknyt hold 8 Tilknyt fag 9 SÅDAN OPRETTER DU EN QUIZ 10 Quiz info 11 Tilføj spørgsmål 12 Tilføj formel til

Læs mere

det færdige resultat

det færdige resultat grafisk design Under dette fagområde har jeg valgt at præsentere jer for en opgave, jeg har udarbejdet for virksomheden Breinholt. Breinholt er en nyopstartet virksomhed i Odense, der tilbyder spirituel

Læs mere

GRAFISK PRODUKTION PORTFOLIO DAN KLESSEN BOOSTING BUSINESS MEDIEGRAFIKER SVENDEPRØVE

GRAFISK PRODUKTION PORTFOLIO DAN KLESSEN BOOSTING BUSINESS MEDIEGRAFIKER SVENDEPRØVE GRAFISK PRODUKTION OG WORKFLOW PORTFOLIO DAN KLESSEN BOOSTING BUSINESS MEDIEGRAFIKER SVENDEPRØVE PORTFOLIO DAN KLESSEN BOOSTING BUSINESS MEDIEGRAFIKER SVENDEPRØVE 04 INDHOLDSFORTEGNELSE Dokumentation 05

Læs mere

Introducering af Flip MinoHD: http://celikshadow.dk/flip/

Introducering af Flip MinoHD: http://celikshadow.dk/flip/ Introducering af Flip MinoHD: http://celikshadow.dk/flip/ Ahmad Hahmoud Besir Redzepi Jeffrey Lai 04/05-2009 2.semester 3. projekt Indholdsfortegnelse: 1.0 Forord 3 2.0 Kommunikationsplan 4 3.0 Navigationsdiagram

Læs mere

GRAFISK DESIGN SVENDEPRØVE 2013. Redesign & kodning af website PETER HOLM SVENDEPRØVE 2013 / 5

GRAFISK DESIGN SVENDEPRØVE 2013. Redesign & kodning af website PETER HOLM SVENDEPRØVE 2013 / 5 NAVN PÅ OPGAVEN KERNEOMRÅDE SVENDEPRØVE 2013 Redesign & kodning af website PETER HOLM SVENDEPRØVE 2013 / 5 Beskrivelse af opgaven I min fritid modtog jeg en opgave, som bestod i, at redesigne og kode et

Læs mere

Grafisk Design. fra idé til visuelt udtryk Benett

Grafisk Design. fra idé til visuelt udtryk Benett fra idé til visuelt udtryk Benett Indholdsfortegnelse Brief...5 Idé og skitsering....6 Værktøjer....6 Farvevalg....7 Flowchart eksisterende site...7 Design i Photoshop....9 Ikoner i Illustrator...11 Setup

Læs mere

2. SEMESTER PROJEKT 3 INTERAKTIONSUDVIKLING

2. SEMESTER PROJEKT 3 INTERAKTIONSUDVIKLING 2. SEMESTER PROJEKT 3 INTERAKTIONSUDVIKLING Baggrund Udgangspunktet er projekt 2, dvs. en blog om cupcakes, hvor målgruppe, afsender og modtager allerede er defineret. Du bliver nu bedt om at udvikle et

Læs mere

Silkeborg Review Mine sider

Silkeborg Review Mine sider Silkeborg Review Mine sider Med tilføjelse af lister er der nu review af denne side også. Kommentarerne for lister dækker dermed også den visning, der er på forsiden af lister og interesser, ligesom visning

Læs mere

Roskilde Tekniske Gymnasium. Eksamensprojekt. Programmering C niveau

Roskilde Tekniske Gymnasium. Eksamensprojekt. Programmering C niveau Roskilde Tekniske Gymnasium Eksamensprojekt Programmering C niveau Andreas Sode 09-05-2014 Indhold Eksamensprojekt Programmering C niveau... 2 Forord... 2 Indledning... 2 Problemformulering... 2 Krav til

Læs mere

grafisk design Se webappen på din mobil

grafisk design Se webappen på din mobil ideudvikling Jeg har valgt at bruge kulturbegivenheden Aarhus Festuge, som udgangspunktet i min svendeprøve. Jeg vil redesigne deres marketingsmateriale såsom logo, magasin, plakater m.m. Derudover vil

Læs mere

Sundhedsguiden. Børn og unges sundhed. Jozef Indruszewski & Marc Ringsing. Kommunikation/IT C Afsluttende opgave 2010

Sundhedsguiden. Børn og unges sundhed. Jozef Indruszewski & Marc Ringsing. Kommunikation/IT C Afsluttende opgave 2010 Sundhedsguiden Børn og unges sundhed Kommunikation/IT C Afsluttende opgave 2010 Jozef Indruszewski & Marc Ringsing Problemformulering Vi vil lave en hjemmeside, der oplyser børn og unge om sundhed. Vi

Læs mere

Afsluttende opgave 2009 Kommunikation/IT

Afsluttende opgave 2009 Kommunikation/IT Afsluttende opgave 2009 Kommunikation/IT Tema: Kulløse Miljømesse Rapport af: Jacob Almann Tinnesen, Oliver Mørk og Oscar Helmersen Roskilde Tekniske Gymnasium Klasse 1.1 Afleveret: 24-04-2009 Side 1 af

Læs mere

GRAFISK DESIGN GRAFISK PRODUKTION & WORKFLOW

GRAFISK DESIGN GRAFISK PRODUKTION & WORKFLOW GRAFISK PRODUKTION & WORKFLOW 2 RE-DESIGN AF BOARDASSURE.DK Jeg har et enkeltmandsfirma, hvor jeg laver opgaver uden for mit arbejde i Presidents Institute. En af de opgaver jeg har løst, var en opdatering

Læs mere

MARIA SKAU MADSEN SVENDEPRØVE 2015 WWW.BY-M.DK

MARIA SKAU MADSEN SVENDEPRØVE 2015 WWW.BY-M.DK DOKUMENTATION MARIA SKAU MADSEN WWW.BY-M.DK INDHOLDSFORTEGNELSE OPGAVE BESKRIVELSE.... 5 RESEARCH.... 5 DESIGN.... 5 SPECIFIKATIONER DET TRYKTE MEDIE.... 5 NUVÆRENDE IDENTITET... 6 PRIMÆR OG SEKUNDÆR MÅLGRUPPE....................6

Læs mere

MANUAL TIL FS PÅ NETTET

MANUAL TIL FS PÅ NETTET MANUAL TIL FS PÅ NETTET Sådan opretter du nyheder og artikler (side 4) Sådan laver du links (side 14) Om tjek ind/ud og publicer (side 20) Sådan uploader du billeder og dokumenter (side 25) Sådan redigerer

Læs mere

Multimediedesign på CPH-Business URL: www.gracet.dk. Eksamensopgave. Redesign af Portefølje. Grace Grigoria Tsatsaris

Multimediedesign på CPH-Business URL: www.gracet.dk. Eksamensopgave. Redesign af Portefølje. Grace Grigoria Tsatsaris Multimediedesign på CPH-Business URL: www.gracet.dk Eksamensopgave Redesign af Portefølje Grace Grigoria Tsatsaris 14 1 Brainstorm og ideudvikling: Jeg startede med at danne mig et overblik over projektet

Læs mere

GRAFISK WORKFLOW. Kasper Staal - Portfolio - H2

GRAFISK WORKFLOW. Kasper Staal - Portfolio - H2 GRAFISK WORKFLOW Kasper Staal - Portfolio - H2 Opgaven Denne opgave bestod i at design et website til min egen virksomed 3DService.dk. Websitet skulle være responsivt, og indeholde de mest gængse informationer

Læs mere

WOODKID. The Golden Age. Banner Projekt - 1 Semester, CPH Business, MUL-A13E. Casper Birch Buchberg, Natahlie Heiden & Sebastian Nyholm

WOODKID. The Golden Age. Banner Projekt - 1 Semester, CPH Business, MUL-A13E. Casper Birch Buchberg, Natahlie Heiden & Sebastian Nyholm WOODKID The Golden Age Banner Projekt - 1 Semester, CPH Business, MUL-A13E Casper Birch Buchberg, Natahlie Heiden & Sebastian Nyholm Projektbeskrivelse Vi har designet og animeret tre forskellige bannere

Læs mere

MANUAL. Siteloom CMS

MANUAL. Siteloom CMS MANUAL Siteloom CMS www.hjerteforeningen.dk/cms Brugernavn: Password: 3. september, 2012 BASIS FUNKTIONER 1. Kalender... 4 1.a. Opret... 5 1.b. Rediger eller slet... 8 2. Sider... 10 2.a Opret side...

Læs mere

Mit grafiske workflow inkluderer:

Mit grafiske workflow inkluderer: GRAFISK WORKFLOW Opgave: Opgaven var at producere en bog og et website med temaet stilhistorie. Jeg har valgt at beskrive mit grafiske workflow i produktionen af websitet. Kravene var, at der skulle være

Læs mere

3 OPRETTELSE AF SIDER

3 OPRETTELSE AF SIDER 3 OPRETTELSE AF SIDER En af VuptiWebs styrker er muligheden for at oprette forskellige sidetyper og - ikke mindst - sider, som automatisk henter data fra vores administrationsprogram (DOFPro). I første

Læs mere

Fredag d. 20. februar 2015 2. semester MUL-B CSR CAMPAIGN

Fredag d. 20. februar 2015 2. semester MUL-B CSR CAMPAIGN CSR CAMPAIGN 1 Corporate Social Responsibility http://b-design.nu/2sem-projekt1/csr.html Kathrine Harder kathrineharder@gmail.com Simone Blachman blachman94@hotmail.com Pernille Sjøgreen - pernille.sjoegreen@gmail.com

Læs mere

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

Dokumentation. Workflow. Grafisk produktion. Trine Alexandersen 1. hovedforløb Dokumentation Workflow Grafisk produktion Trine Alexandersen 1. hovedforløb Jeg har valgt at vise min egen hjemmeside som workflow. Siden er min e-portfolio som skal vise hvad jeg lærer under min uddannelse

Læs mere

Peter Kragh Hansen. Microsoft PowerPoint 2013 DK. ISBN nr.: 978-87-93212-07-7

Peter Kragh Hansen. Microsoft PowerPoint 2013 DK. ISBN nr.: 978-87-93212-07-7 Peter Kragh Hansen Microsoft PowerPoint 2013 DK ISBN nr.: 978-87-93212-07-7 I n d h o l d s f o r t e g n e l s e PowerPoint 2013... 3 Præsentation... 4 Oprettelsen af præsentationer... 5 Skabeloner og

Læs mere

JEG GIVER SELLS.DK NYT LIV MED ET MODERNE RE-DESIGN.

JEG GIVER SELLS.DK NYT LIV MED ET MODERNE RE-DESIGN. JEG GIVER SELLS.DK NYT LIV MED ET MODERNE RE-DESIGN. Grafisk design Grafisk design Opgaven Jeg har fået til opgave at re-designe Sells.dk. Sitet skal benytte elementer fra en kampagne, der tidligere er

Læs mere

Delaflevering: Webdesign og webkommunikation. Organisation: Københavns Erhvervsakademi. Af Silke Brewster Rosendahl (hold 1) og Marie Anne Svendsen

Delaflevering: Webdesign og webkommunikation. Organisation: Københavns Erhvervsakademi. Af Silke Brewster Rosendahl (hold 1) og Marie Anne Svendsen Delaflevering: Webdesign og webkommunikation Af Silke Brewster Rosendahl (hold 1) og Marie Anne Svendsen Vi har valgt at lave et redesign af KEA s online videnscenter/bibliotek. Organisation: Københavns

Læs mere

MANUAL. Siteloom CMS

MANUAL. Siteloom CMS MANUAL Siteloom CMS www.hjerteforeningen.dk/cms Brugernavn: Password: 3. oktober, 2013 BASIS FUNKTIONER 1. Kalender... 4 1.a. Opret... 5 1.b. Rediger eller slet... 9 2. Sider...12 2.a. Opret side...13

Læs mere

ANALYSE AF WEBSTEDET WWW.BILFORHANDLER.DK

ANALYSE AF WEBSTEDET WWW.BILFORHANDLER.DK ANALYSE AF WEBSTEDET WWW.BILFORHANDLER.DK Denne rapport indeholder en primær analyse af webstedet www.bilforhandler.dk. Vi har kigget på: Det vigtige førstehåndsindtryk af webstedet Brugervenlighed Anvendte

Læs mere

Skærmlayout på websiden

Skærmlayout på websiden Skærmlayout på websiden Af Kaj Søndergaard En bog i et flot layout er dejlig at få i hånden. Man får lyst til at bladre i bogen for at finde ud af om indholdet ser ud til at være værd at ofre tid på. Hvis

Læs mere

Annemette Søgaard Hansen/www.dinwebvejleder.dk

Annemette Søgaard Hansen/www.dinwebvejleder.dk Google Docs Dokumenter Indholdsfortegnelse Værktøjer... Side 3 Menuer... Side 5 Opgave... Side 8 Få adgang til filerne fra din computer... Side 16 Vejledende løsning... Side 17 GoogleDocs Dokumenter 2

Læs mere

Diagrammer visualiser dine tal

Diagrammer visualiser dine tal Diagrammer visualiser dine tal Indledning På de efterfølgende sider vil du blive præsenteret for nye måder at arbejde med Diagrammer på i Excel. Vejledningen herunder er vist i Excel 2007 versionen, og

Læs mere

MANUAL. Siteloom CMS

MANUAL. Siteloom CMS MANUAL Siteloom CMS www.hjerteforeningen.dk/cms Brugernavn: Password: 13. marts, 2014 BASIS FUNKTIONER 1. Kalender... 4 1.a. Opret... 5 1.b. Rediger eller slet... 9 2. Sider...12 2.a. Opret side...13 2.b.

Læs mere

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

GRAFISK PRODUKTION WORK- FLOW DREAMWEAVER CS5 DESIGN & KODNING AF LANDING PAGE. a.link, a.hover, a.visited. Wrapper. paragraph CSS. h1 h2. GRAFISK PRODUKTION OG WORK- FLOW CSS Wrapper paragraph h1 h2 DREAMWEAVER CS5 Class Tags Kodning Design a.link, a.hover, a.visited HTML Kundekontakt Komposition og modulopbygning Skelet Pixels Layout Usabillity

Læs mere

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

MÅLGRUPPE Alle typer af boligselskaber, ejer- og andelsforeninger samt div. institutioner (store som små) på Sjælland. Ikke private kunder. GRAFISK DESIGN KUNDEN PA Vaskeriteknik er en enkeltmandsvirksomhed som startede i 2008. Manden bag er Preben, som gennem 14 års brancheerfaring startede sit eget firma op da han føler at han med sit partnerskab

Læs mere

Multimediedesigner. Vedvarende. energi

Multimediedesigner. Vedvarende. energi Multimediedesigner Vedvarende energi Eksamensprojekt 2. sem. maj. 2014 - jun. 2014 Problemstilling Vedvarende energi er en samlebetegnelse for bioenergi, vindenergi, solenergi og andre teknologier, der

Læs mere

Projekt 5 Eksamens opgave Re-design af portfolio Af Jonas Lunding

Projekt 5 Eksamens opgave Re-design af portfolio Af Jonas Lunding Projekt 5 Eksamens opgave Re-design af portfolio Af Jonas Lunding BRAINSTORM Tema: Vinter, alaska, bjerge, blå & hvide farver. Farver: Colourlovers eksempler: http://www.colourlovers.com/palette/605421/crystal_ice_palace

Læs mere

Stilen skulle gerne være feminin og primærfarven rosa.

Stilen skulle gerne være feminin og primærfarven rosa. Grafisk design // Grafisk Design Hjemmesideløsning for syerske Sorami er et enmands-firma med mere end 25 års erfaring, som tilbyder omforandring af tøj og tøj syet efter eget design, samt håndlavede smykker.

Læs mere

PHP kode til hjemmeside menu.

PHP kode til hjemmeside menu. PHP kode til hjemmeside menu. Home Hovedmenu 1 Hovedmenu 2 Hovedmenu 3 Hovedmenu 4 Undermenu 1 Breadcrumb Her vises indholdet af den valgte side Undermenu 2 Undermenu 3 Undermenu 4 Evt. en mulighed for

Læs mere

PowerPoint 2003. Kursusmateriale til FHF s kursister

PowerPoint 2003. Kursusmateriale til FHF s kursister PowerPoint 2003 Kursusmateriale til FHF s kursister Indholdsfortegnelse: Opgave 1 Hvad er en Præsentation?... 2 Opgave 2 vælg emne + opret dias... 3 Opgave 3 Indsæt objekter / billeder... 4 Opgave 4 Brugerdefineret

Læs mere

5 måder at reducere dine Powerpoint tekster

5 måder at reducere dine Powerpoint tekster 1 Slides og præsentationer med alt for meget tekst er kedelige og kan ikke holde dit publikum fanget. Hvordan reducerer du mængden af tekst på dine slides? Hvordan får du gjort dem simple? // www.facebook.com/slidemarkting

Læs mere

Grundforløbsprøve Projektbeskrivelse

Grundforløbsprøve Projektbeskrivelse Grundforløbsprøve Projektbeskrivelse Webintegrator Thomas á Rógvi 221191-2505 Indholdsfortegnelse Opgaven... 3 Tidsplan... 4 Målgruppe... 5 Layout... 6 Design... 7 Fonte... 7 Browser... 7 Bilag... 8 Det

Læs mere

Tjek dine miljøvalg på nettet - når det gælder en tryksag. www.miljonet.org

Tjek dine miljøvalg på nettet - når det gælder en tryksag. www.miljonet.org Tjek dine miljøvalg på nettet - når det gælder en tryksag Kære læser, Du sidder med en brochure, der beskriver et nyt websted,. Det er et websted med rigtig mange oplysninger om de miljøpåvirkninger, der

Læs mere

Manual til Den Elektroniske Portefølje i Almen Medicin Tutorlægens udgave

Manual til Den Elektroniske Portefølje i Almen Medicin Tutorlægens udgave Manual til Den Elektroniske Portefølje i Almen Medicin Tutorlægens udgave Til Tutorlægen Velkommen til den elektroniske portefølje. Den er blevet til i dialog mellem Dansk selskab for almen medicin og

Læs mere

portfolio GRAFISK WORKFLOW

portfolio GRAFISK WORKFLOW Grafisk Workflow Opgaven Der skal laves hjemmeside til et lille privat bageri. Kunden ønsker et overskueligt site. Hjemmesiden skal kort og godt fortælle om Skejby Centrets Bageri og deres produkter og

Læs mere

Responsiv hjemmeside

Responsiv hjemmeside Kom/it niv.a 3.år Responsiv hjemmeside Hospidana Carina Aa Hansen, Mathias Larsen, Peter Lærke 2014 Forord I vores rapport vil man kunne gå ind og læse omkring hvorfor vi har valgt at opbygge vores hjemmeside

Læs mere

Rapport Undervisningsmateriale.

Rapport Undervisningsmateriale. Skrevet af Morten & Jacob A. 1.5 HTX Roskilde 2011 Side 1 Rapport Undervisningsmateriale. Arbejdsgruppen bestod af: Morten, Jacob A. fra 1.5. Dato: 6. maj 2011 Skrevet af: Morten & Jacob A. Fag: Kom/IT.

Læs mere

1 // Grafisk design. Hjemmesiden før. Kunde. Produkt. Opgave. Målgruppe. Bogforlaget Frydenlund A/S. www.his2rie.dk

1 // Grafisk design. Hjemmesiden før. Kunde. Produkt. Opgave. Målgruppe. Bogforlaget Frydenlund A/S. www.his2rie.dk Kunde Bogforlaget Frydenlund A/S Produkt www.his2rie.dk Opgave Hjemmesiden før Redesign af hjemmesiden www.his2rie.dk, som ejes af forlaget. Min opgave lød på, at udforme et nyt design til hjemmesiden,

Læs mere

PROJEKTET LAYOUT IDEUDVIKLING - PROCESS FRA IDÉ TIL PRODUKT

PROJEKTET LAYOUT IDEUDVIKLING - PROCESS FRA IDÉ TIL PRODUKT PROJEKTET Udarbejdelse og idéudvikling af en fiktiv grafisk identitet til Puls Fitness. I denne kernefaglighed fremhæver jeg designet til websitet samt lidt merchandise. Derudover ses et udkast til bl.a.

Læs mere

7DVWHYHMOHGQLQJ#²#,QWHUQHW#([SORUHU

7DVWHYHMOHGQLQJ#²#,QWHUQHW#([SORUHU 7DVWHYHMOHGQLQJ#²#,QWHUQHW#([SORUHU,QGKROGVIRUWHJQHOVH BROWSEREN - DE VIGTIGSTE FUNKTIONER OG BEGREBER.... 2 TILPAS BROWSEREN... 3 GÅ DIREKTE TIL EN KENDT ADRESSE... 5 LAV ET BOGMÆRKE... 6 ORGANISÉR DINE

Læs mere

Grafisk design. Svendeprøve Juni 2015 - Pia Søgaard

Grafisk design. Svendeprøve Juni 2015 - Pia Søgaard Grafisk design Dokumentation Svendeprøve Juni 2015 - Pia Søgaard Kunde: Sognegaarden - Hedensted Opgave: ny grafisk identitet og hjemmeside Programmer: Indesign, illustrator og photoshop Farverum: CMYK

Læs mere