zoo.dk - redesign webdesign og webkommunikation forår 2012 underviser: Sigurd Trolle Gronemann

Størrelse: px
Starte visningen fra side:

Download "zoo.dk - redesign webdesign og webkommunikation forår 2012 underviser: Sigurd Trolle Gronemann"

Transkript

1 webdesign og webkommunikation forår 2012 underviser: Sigurd Trolle Gronemann zoo.dk - redesign Signe Gry Braad Anette Meldgaard Andersen Mette Kragh Wismann Mette Solgaard Frøst 1

2 Indholdsfortegnelse 1 Indledning (mkwi) side 3 2 Problemformulering/problemstilling (msol) side 3 3 Metode (amel) side 3 4 Desk Research (sgpe) side Analyse af Zoo-hjemmesider (sgpe) side Web-inspiration (mkwi) side Kontakt til Zoo København (msol) side 7 5 Usability 6 (amel) side 7 6 Målgruppe 9 (sgpe) side 9 7 Personaer 10 (mkwi) side 10 8 Card sorting 13 (msol) side 12 9 Wireframes 16 (amel) side Responsive design 18 (sgpe) side Visuelt udtryk (mkwi) side HTML og CSS 20 (msol) side Arbejdsmetode (msol) side Generel opbygning (amel) side Media querias (sgpe) side Dynamiske elementer (mkwi) side Slidere (msol) side Konklusion (amel) side Perspektivering (sgpe) side Litteraturliste side Bilag side 26 mkwi: Mette Kragh Wismann msol: Mette Solgaard Frøst amel: Anette Melgaard Andersen sgpe: Signe Gry Braad Pedersen 2

3 1 Indledning 2 Problemformulering/problemstilling Zoo København er en populær og traditionsrig attraktion med et stærkt brand. Hvert år har haven mere end en million gæster, og i 2011 blev besøgt af personer 1. Desværre mener vi ikke, at haven udnytter sit potentiale på nettet godt nok. Siden fremstår uoverskuelig, teksttung og de samme oplysninger optræder flere gange. Derfor har vi valgt at arbejde med redesign af Vores ambition er at lave en enkel hjemmeside, som også fungerer på mobile platforme som tablets og smartphones. I vores øjne er zoo.dk oplagt til det formål, fordi hjemmesiden på den måde også kan fungere som en slags guide, når gæsterne bevæger sig rundt i haven. Zoo København er et sted, man kommer for at få en oplevelse - et dynamisk og levende sted. Det vil vi gerne have afspejler sig i vores design, og vi synes, det er en spændende designmæssig udfordring, både hvad angår indhold, teknik og visuelt udtryk. Vi har prioriteret, at arbejde med den del af siden, som henvender sig til besøgende, da det i vores øjne er den mest vigtige målgruppe. 1 Zoo Københavns årsrapport 2011 Hvordan kan vi skabe en hjemmeside for Zoo København, som på en nytænkende og intuitiv måde både understøtter brandet og sikrer brugerne den nødvendige information, og som også kan bruges på varierende skærmstørrelser? 3 Metode Den nuværende zoo.dk er teksttung og præget af intern og specialiseret information, som vi ikke mener, den almindelige bruger har behov for at se. Derfor stod det hurtigt klart for os, at en stor del af vores arbejde ville handle om at sætte målgruppen i højsædet og forenkle siden. Derfor har vi udviklet to personaer, som har fungeret som ledesnore i opgaven. Fordi zoo.dk er så fyldt med informationer - og kan virke en smule uoverskuelig - lavede vi en omfattende card sorting af hele siden. Det skabte overblik og hjalp os med at prioritere indholdet på den nye side. Da vi har arbejdet med mobile first (Wroblewski, 2011), udvik- 3

4 lede vi først wireframes til smartphones, derefter tablets og bærbare. Vores wireframes har gennem hele forløbet fungeret som en rød tråd, som vi flere gange vendte tilbage til. Vi har desuden besøgt flere hjemmesider for zoologiske haver - både i Danmark og i udlandet. Det har vi primært gjort for at få inspiration til gode løsninger men også for at få et indblik i, hvilke tendenser der går igen. Vi har en iterativ arbejdsproces, hvilket er naturligt i de fleste designopgaver, man vil oftest i processen opnå indsigt, som betyder, at man tilretter projektet. Det vil sige, at vi i hver fase af opgaven gennemløber en form for miniudgave af vandfaldsmodellen 2. I den traditionelle vandfaldsmodel afsluttes hver fase, før man påbegynder den næste. I slutforløbet har vi lavet en tænke-højt-test af det nye site til Zoo København. 4 Desk Research Indledende skrivebords-research. 4.1 Analyse af zoo-hjemmesider Da ingen af os har stor viden om hvilke elementer, der skal være på en hjemmeside for zoologiske haver, besøgte vi et hav af hjemmesider fra ind- og udland i startfasen af vores arbejde. Vi var interesserede i at finde ud af, om der er en form for konsensus omkring, hvordan en hjemmeside skal se ud: Hvad er traditionelt og hvad er avanceret? Den amerikanske designer, Raymond Loewy, er ophavsmand til de såkaldte MAYA-principper 3 (Most Advanced Yet Acceptable) der går ud på, at der er grænser for, hvor nyskabende man kan være, hvis man også skal have brugerne med sig. Den viden havde vi i baghovedet, når vi så nærmere på siderne. I researchen fokuserede vi desuden på, hvilke virkemidler der er brugt som eksempelvis hierarki, dynamik, farver, informationsmængde og valgmuligheder. Vi valgte nogle specifikke zoo-forsider fra ind- og udland ud, som vi gik mere i dybden med:

5 Knuthenborg Safaripark Zoo Barcelona Los Angeles Zoo Zoo Berlin Zoo Praha Zoo København Alle seks sider er baserede på et layout med en fast bredde på cirka 900px. Baggrunden i hele skærmens bredde er udnyttet i varierende grad; fra ingenting eller svag farve, til tung farve eller et visuelt fængende billede. Tre af siderne kan ses i deres fulde længde på en normal skærm - på resten skal man scrolle for at komme til bunden. De fleste sider benytter farver indenfor samme farvetone/hue, og der er ikke store kontraster. Los Angeles Zoo 4 har de klareste farver, som bliver fremhævet yderligere af at stå på en hvid baggrund. Zoo Berlin 5 har en meget dominerende grøn farve. Der er en del dynamik på siderne: To Zoo s har lyd, Knuthenborg 6 har tre korte film, som kører i ring, to har billeder, der skifter i en boks og Zoo Praha 7 har små, grafiske elementer som bevæger sig hen over skærmen. 4 Se bilag 3 5 Se bilag 6 6 Se bilag 2 7 Se bilag 7 Zoo København 8 har den mest informationstunge forside. Brugeren kan træffe 35 valg mod mellem på de andre sider. Siden bærer præg af at være bygget op efter deres egen virksomhedsstruktur, hvor de løbende har tilføjet punkter efter behov. Hierarkierne på de seks sider er generelt tydelige: en topbar med pulldown menuer, en primær boks og en undergruppe med sekundære bokse. Desuden benyttes gestaltloven om forbindelse, og en masse mindre vigtige punkter er knyttet sammen i en grafisk svag boks (typisk grå) i bunden af siden. Der var en del kategorier, som gik igen på siderne: information til skoleklasser, fremhævelse af sponsorer, fremhævelse af tiltag for naturbeskyttelse og så selvfølgelig de åbenlyse som information om billetter, åbningstider osv. Fotos optræder hyppigt, og specielt Los Angeles Zoo gør sig bemærket ved at have en fotografisk høj kvalitet. Generelt har siderne horror vacui 9, og der er ikke meget luft omkring elementerne. Zoo Praha og Zoo København er mest pakkede, mens Los Angeles Zoo har den mest hvide/tomme baggrund. På baggrund af vores analyse konkluderede vi, at der hersker konsensus om, hvilke elementer, der skal være til stede på en 8 Se bilag

6 hjemmeside for zoologiske haver uanset hvor i verden, haven befinder sig. Det betyder, at der er visse bærende elementer, som brugerne forventer at finde på siden. Det drejer sig eksempelvis om billetpriser, åbningstider, kalender og billeder af dyr. Ingen af siderne udstråler derfor det, vi går efter i vores design. De er kompakte, relativt fastlåste, og det traditionelle boks-layout hersker. Derfor gik vi andre veje i vores jagt på inspiration. 4.2 Web-inspiration Desuden var vi alle meget begejstrede for det slideshow, som kører horisontalt på siden, og vi blev inspireret til at forsøge at lave noget lignende. er hjemmeside for Volkswagens beetle. Det er en utroligt sej side, som udnytter skærmen fuldt ud, og den har blandt andet inspireret os i forhold til at forstå, hvordan en lang side også kan se ud. er en hjemmeside lavet i anledningen af et jubilæum og vi synes, at siden er et godt eksempel på, hvor- Vi har gennem hele forløbet brugt meget tid på at besøge inspirerende hjemmesider. Det har specielt været brugbart i forhold til vores arbejde med responsive design og mobile first, hvor vi er stødt på utroligt mange gode løsninger. Et udvalg af de sider, som inspirerede os mest - og som vi løbende vendte tilbage til er: der ejes af et finsk webbureau. Det er, i vores øjne, en super side, som indeholder mange elementer, vi har forsøgt at indarbejde i vores projekt. Eksempelvis er den bygget op som én lang side, og man kommer hurtigt tilbage til toppen ved hjælp af en lille knap i højre side. er hjemmeside for et canadisk webbureau. Her er billede til kant og velfungerene responsive design. 6

7 dan man kan udnytte hele skærmen og undgår at bruge bokse og menuer. Vi har desuden brugt til at teste sidernes layout på forskellige skærmstørrelser. 4.3 Kontakt til Zoo København Vi forsøgte tidligt i forløbet at komme i kontakt med Zoo København, da vi var interesserede i at få svar på forskellige praktiske oplysninger: Hvor mange sidevisninger har de, hvad er resultatet af de brugerundersøgelser, de har fået lavet, hvad er tankerne bag opbygningen af hjemmesiden osv. Vi forsøgte både lykken hos en PR-medarbejder, hos en medarbejder i Skoletjenesten og en administrativ medarbejder. Desværre gav det ikke pote, og vi baserer i stedet vores viden på årsrapporterne fra 2010 og Usability Den anerkendte definition på usability er: I hvilken grad et produkt kan anvendes af en specifik bruger til at opnå specifikke mål funktionelt, effektivt og tilfredsstilende i en specifik brugskontekst. (Gregersen og Wisler-Poulsen, 2009) I vores problemformulering skriver vi, at vi gerne vil lave en intuitiv side, som både er tilfredsstillende og funktionel. Det betyder, at vi har haft fokus på usability gennem hele forløbet, og vi har prøvet at definere, hvad en tilfredsstillende web-oplevelse ville være for vores to personaer og prioriteret indholdet ud fra det. Det grundlæggende mål i arbejdet med usability er, at brugerne skal kunne finde den information, de søger, så hurtigt som muligt. (Gregersen og Wisler-Poulsen, 2009) Derudover kan man ønske sig, at siden f.eks. er æstetisk flot, at den signalerer et givent brand og at brugerne inspireres til at gå på opdagelse. Via privat netværk til Zoo København fandt vi ud af, at brugerne oftest søger efter ordene billetter og åbningstider på zoo.dk. Derfor har vi prioriteret, at netop disse praktiske oplysninger er tydelige på siden. 7

8 I virkeligheden kan man designe hjemmesider, som man vil. Men hvis hvis man har som mål, at brugerne rent faktisk skal læse, forstå og bruge siden, så er opbygningen altafgørende. Hvis de ikke finder det, de leder efter, går brugerne hurtigt videre til et andet sted, (Gregersen og Wisler-Poulsen, 2009) hvilket ikke umiddelbart er muligt for besøgende på Forfatteren og usability-konsulenten, Steve Krug, opfordrer webdesignere til at lave enkle og fokuserede hjemmesider. Det er altså ikke nok at kunne sætte et flueben ud for hvert af punkterne på en af de mange usability-tjeklister, som florerer på nettet, og så tro, at den er hjemme. (Krug, 2006) Hans hovedpointe er, at siden skal være selvfølgelig/self-evident. Det vil sige, at en gennemsnitsbruger, alene ved at kigge på siden, skal kunne regne ud, hvor man finder hvad. Hvis siden indeholder store informationsmængder, som betyder, at det ikke er muligt at lave den self-evident, skal man i stedet forsøge at gøre den selv-forklarende/self-explanatory. Det vil sige, at der ikke må være elementer på siden, som giver anledning til tvivl og sekundære valg hos brugeren. For at leve op til de pointer har sidens visuelle hierarki stor betydning. Steve Krug definerer tre virkemidler, beslægtede med gestalt-lovene: 1. Fremhævelse: Jo vigtigere elementet er, jo mere skal det fremhæves. 2. Gruppering: Emner, der er relaterede visuelt, er også indholdsrelaterede. 3. Underdeling: Emner der visuelt er under et andet. Med udgangspunkt i ovenstående har vi valgt at give de informationer, som besøgende oftest søger efter (priser og åbningstider) en central placering øverst på siden. Desuden har vi placeret en nyhedsboble centralt på siden. Det er tanken, at denne nyhed ofte skiftes ud, så indholdet skifter, hvis en bruger med jævne mellemrum besøger zoo.dk. Nyheden skal være af en sådan art, at brugeren får lyst til at læse mere og på sigt besøge haven. Syv steder har vi valgt at skære siden over ved at sætte en meget tynd, prikket streg. Det har vi gjort for at gruppere indholdet på siden og give den en visuel struktur, så sammenhængen bliver tydeligere. Vi har afprøvet forskellige stregfarver og tykkelser for at finde det rigtige udtryk, så stregen grupperer indholdet, uden den bliver dominerende og ødelægger fornemmelsen af, at det er én lang side. En andet vigtigt element i usability handler om at gøre klik nemme. (Krug, 2006) 8

9 Et nemt klik kræver (næsten) ikke bevidsthed, og man har en fornemmelse af at være på rette spor. Hvis man efterlever disse krav, vil man ende op med en dyb side med få valg på forsiden i modsætning til en bred side med mange valg. en rigtig god øvelse. Vi har dog udarbejdet en plan for, hvordan en mulig usability test kunne se ud 11. Forsiden på det originale zoo.dk er fyldt med links og indgange til forskellige undersider. Det vil vi gerne ændre på, og vi har derfor arbejdet med at begrænse de klikbare elementer på vores nye side. Det er afgørende for forståelsen af usability, at man også har kendskab til, hvordan mennesker generelt interagerer med digitale produkter. (Gregersen og Wisler-Poulsen, 2009) Eksempelvis skal man være opmærksom på, at vi ikke læser websider på samme måde, som vi læser printet tekst. Den kendte usability ekspert, Jakob Nielsen, har udført flere eyetrackingstudier 10, der viser, at testpersonerne skimmer fra venstre til højre, dernæst ned over siden i et F-mønster, mest mod højre i toppen, næsten kun i venstre side i bunden. Generelt skimmer vi på nettet, det vil sige, at elementer, som fremstår tydeligere end andre, eksempelvis overskrifter, linktekst, bold-tekst og bullet-lister, bliver brugt som pejlemærker. 6 Målgruppe Den franske sociolog Pierre Bourdieu mente, at individers kulturelle præferencer, har betydning for, hvordan de forstår et budskab, de bliver præsenteret for. (Rasmussen og Fischer 2008) Og det er netop én af grundene til, at man ikke må glemme målgruppen, når man arbejder med hjemmesiden. Teksten og opbygningen på siden vil nemlig blive opfattet forskelligt afhængigt af, hvem man er. Det betyder, at hvis man ønsker at ramme en bestemt målgruppe, så skal man bruge kræfter på at sætte sig ind i, hvad der er vigtigt for det pågældende segment. Vi ved fra Københavns Zoo s årsberetning, at havens primære målgruppe er børnefamilier i hovedstadsområdet samt turister fra Danmark og Norden. På baggrund af den (noget begrænsede) viden har vi skabt to personaer, som repræsenterer begge grupper. Vi har, af tidsmæssige årsager, ikke udført en usability test af vores hjemmeside, men der er ingen tvivl om, at det ville være Se bilag 9 9

10 7 Personaer En persona er en brugermodel, som kan hjælpe os med at sætte os ind målgruppens tanker og handlinger, og på den måde guide os på rette vej i arbejdet med hjemmesiden. I en ideel verden er personaer skabt på baggrund af eksempelvis etnografiske studier, interviews eller observationer af potentielle brugers ageren adfærd. Disse data danner derpå grundlag for en fiktiv person med personlighed og empati. I vores tilfælde - hvor tiden var knap - benyttede vi de oplysninger, vi kunne få fra Zoo København til at skabe to provisional personas også kaldet ad hoc personaer. (Cooper, A et al. 2007) Ad hoc personaer er ikke optimale, men vi er enige med Allan Cooper i følgende betragtning: Using provisional personas is better, than no user model at all. Vi har udformet vores personaer med både demografiske, socioøkonomiske og kulturelle baggrundsvariabler, for at danne et så dækkende billede, som det aktuelt er muligt at lave. (Rasmussen og Fischer 2008) Persona 1 Kathrine er 32 år, hun bor på Vesterbro i en andelslejlighed, som hun har købt sammen med sin kæreste, Andreas. Sammen har de børnene Sally på seks år og Otto på fire år. Kathrine læser dansk og er i gang med at skrive speciale. Andreas arbejder med byplanlægning i Københavns kommune. I sin fritid kan Kathrine godt lide at fotografere, og hun har tidligere været meget aktiv sportsdykker. Hun bruger ofte nettet til informationssøgning og følger med i en del blogs. Hele familien har årskort og besøger Zoo København ca. seks til syv gange om året og både i weekender, ferier og på hverdage uafhængigt af årstiden. Kathrine bruger zoo.dk før hvert besøg. Hun kigger eksempelvis efter spændende arrangementer og nye dyreunger, som de skal se på deres tur rundt i haven. Familien kender haven så godt, at de langt fra kommer rundt til alle dyr hver gang. I stedet udvælger de nogle enkelte favoritsteder, hvor de til gengæld tilbringer længere tid. Kathrine tilhører det moderne fællesskabsorienterede segment i Kompas-modellen. Et segment, som blandt andet er kendetegnet af personer med en akademisk uddannelse, der bor i storbyen og er hyppige brugere af computere og internet. (Rasmussen og Fischer 2008) Persona 2 Peter er 67 år og pensioneret tømrermester. Han bor i Kolding sammen med sin kone, skolelæreren Kirsten, som han har været gift med i 42 år. 10

11 Peter abonnerer på Jydske Vestkysten og lytter dagligt til P4 syd. Han holder meget af at gå på jagt og lave god mad serveret sammen med franske rødvine. Ferierne tilbringer Peter helst i Frankrig, hvor han kører ned sammen med Kirsten. De har to børn; Lars på 41 år og Henrik på 38 år. Lars bor stadig i Kolding og har overtaget tømrervirksomheden. Henrik bor i Virum med sin kone og de to døtre; Laura på syv år og Asta på 10 år. Han er tandlæge og har egen praksis. Peter kommer ca. hver 2. måned for at hjælpe med at passe de to piger, og ca. én gang om året tager han pigerne med på til Zoologisk Have. Når de er i haven, vil Peter gerne se det hele, så han føler, han får noget for pengene. Hvis han skulle vælge, er det dog de afrikanske savannedyr, som står ham nærmest. Han bruger ikke nettet ofte, og hvis han endelig gør, synes han hurtigt, at det er uoverskueligt og mister tålmodigheden. Han har besøgt zoo.dk for at lede efter information om parkering og åbningstider. Peter tilhører det individorienterede segment i Kompas-modellen, som er kendetegnet af personer, som bor vest for Storebælt, har en erhvervsuddannelse og læser lokalaviser. (Rasmussen og Fischer 2008) På vegne af Kathrine og Peter har vi udarbejdet nogle specifikke ønsker til, hvordan zoo.dk kan fungere bedre. Kathrine ønsker sig: Inspiration til nye opdagelser i den velkendte have med hjælp fra mobilen. Let tilgang til nyheder og dagens begivenheder Forslag til ruter, f.eks. Dyreunger eller Polarrute At kunne få fakta om zoo på sin smartphone, mens hun går i haven. Peter ønsker sig: En let og overskuelig side Oversigt over parkeringsforhold og åbningstider Et kort over haven, som han kan printe hjemmefra Søger specifikt på emner og vil gerne læse i detaljer om f.eks. byggeriet af den arktiske ring eller fakta om forskellige dyr Da det ikke var muligt at teste vores dummy-side på testpersoner, har vi i stedet udtænkt nogle scenarier med vores to personaer. Vi har diskuteret, hvordan Kathrine og Peter vil bruge Zoo Københavns hjemmeside før, under og efter deres besøg i Zoo. Vi fandt frem til, at Katrine vil bruge sin mobil hjemmefra til at læse nyheder og se dagens program. Derudover vil hun f.eks. bruge mobilen i Zoo til at prøve en interaktiv rute sammen med børnene og til at finde hurtige oplysninger om de enkelte dyr, 11

12 hvis børnene spørger om noget, hun ikke kan svare på. Peter vil besøge zoo.dk fra sin stationære computer, før han tager hjemmefra. Han har hverken smartphone eller tablet. Han vil kigge på åbningstider og parkeringsforhold. Det, som har fanget hans interesse under besøget i haven, tjekker han op på, når han kommer hjem. han/hun synes giver mening. I en lukket card sorting er kategorierne navngivet og fastlagte på forhånd, og det er testpersonens opgave at fordele sideindholdet i disse kategorier( Spencer & Warfel 2007). Vi startede med at foretage en åben card sorting, hvor vi selv udgjorde testpersonerne. Vi er godt klar over, at dette ikke er ideelt, men vi mener alligevel, at øvelsen kan bruges. 8 Card sorting Card Sorting er en organiseringsøvelse, som blandt andet kan hjælpe informations arkitekter samt personer i lignende stillinger med at få styr på den hjemmeside, de arbejder med. En veludført card sorting kan eksempelvis besvare spørgsmål som: Hvilke informationer skal prioriteres højest, og hvor giver det mest mening, at de pågældende informationer bliver placeret (Spencer & Warfel, 2007). Card sorting er særligt nyttigt i forbindelse med design og redesign af hjemmesider, og det er derfor et oplagt værktøj for os. I en åben card sorting bliver en eller flere testpersoner præsenteret for kort med sideindhold, som de skal inddele i kategorier Det nuværende zoo.dk er, som tidligere nævnt, meget tungt og omfangsrigt 12, og vores ambition om at gøre siden mere enkel og ligetil virkede næsten uoverskuelig i vores indledende arbejde. Vores håb var, at en card sorting-øvelse ville skabe det nødvendige overblik og hjælpe os med at målrette informationerne på siden bedre. Efter vi havde noteret ALLE elementer på zoo.dk ned på hvide papirslapper, begyndte vi sorteringsarbejdet 13. Undervejs diskuterede vi frem og tilbage, og vi havde især fokus på, hvilke elementer, der skal placeres på forsiden. Samtalen drejer sig meget om, hvilke placeringer, der virker logiske, og hvor vi selv ville lede. Efter en frasortering af gengangere fordelte vi kortene på seks 12 Site map Zoo.dk:http://www.zoo.dk/sitemap.aspx 13 Bilag 11 billede fra card sorting 12

13 grupper: Om Zoo: 56 punkter som eks. direktion, job i zoo, osv. Forside: 16 punkter som eks. nyheder, dagens program osv. Praktisk info: 13 punkter som eks. parkering, billeter osv. Dyr og hus: 29 punkter som eks. abegrotten, hyppige spørgsmål om dyr osv. Oplev Zoo: 16 punkter som eks. rundvisninger, rid på en pony osv. Skoletjenesten: 23 punkter som eks. biologisk værksted, undervisningsmateriale osv. Oven på vores åbne card sorting foretog vi en mindre lukketcard sorting med to testpersoner. Testpersonerne var enige i vores kategorisering i cirka 70 procent af tilfældene. Der var dog lidt forvirring i forhold til kategorien Om Zoo, hvor rigtigt mange elementer blev placeret. Hvis man fulgte denne tankegang ville Om Zoo hurtigt blive proppet til randen, og vi ville få brug for en masse underkategorier. I stedet har vi lavet en kategori med navnet Virksomheden Zoo. Så bliver det forhåbentligt mere tydeligt, at det er her, man finder information som jobmuligheder, årsberetninger og pressekontakt - og ikke et sted, man som besøgende nødvendigvis behøver at bevæge sig hen. De syv vigtigste punkter vi kom frem til på baggrund af vores card sorting: Det skal være muligt at vælge mellem tre hovedsider: Virksomheden Zoo, For Besøgende og Skoletjenesten. Vi vil udelukkende fokusere på siden For BesøgendeVi vil samle en masse forskellige informationer i kortet over Zoo København. Nyheder fra sidst år hører ikke hjemme på siden. Reklamér for Facebook-siden frem for tilmelding til nyhedsbrev. Drop zoo-tv og link til kanal på youtube. Generelt samle information, hvor det hører til - i stedet for at det ligger spredt ud over hele siden som nu. Alt i alt er card sorting en virkeligt god og, bogstaveligt talt, håndgribelig metode til at skabe overblik. Og mange vigtige beslutninger blev truffet i løbet af processen. 13

14 Billed 1: Wireframe Billed 2: Wireframe 14

15 9 Wireframes Wireframes er en simplificeret oversigt over, hvad der skal være på den endelige hjemmeside, og de fungerer som en ledestjerne i arbejdet. Ordet wireframe kan oversættes til trådramme. Det dækker over, at man arbejder med simple illustrationer, der opridser, hvad der skal være hvor på siden - uden at gå for meget i detaljer med det visuelle udtryk. Der findes en del wireframe-værktøjer på nettet, og man kan også bruge et simpelt program som PowerPoint. Vi har valgt at arbejde med pen og papir, hvilket giver en meget levende og demokratisk proces, hvor alle kunne deltage og en ny tegning hurtigt kunne ridses op. Vi arbejdede med low-fidelity, hvilket vil sige, at vi koncentrerede os om, hvor tingene skulle placeres på siden og ikke diskuterede ting som farver, typografi osv. Vi lavede desuden kun en enkelt wireframe til hver skærmstørrelse, da vi netop arbejder med én lang side. Da vi er meget inspirerede af tankerne om mobile first 14, startede vi med at lave en wireframe til smartphones med en skærmstørrelse svarende til en iphone. Vi lavede flere forskellige wireframes, indtil vi nåede frem til en endelig model, som vi alle var tilfredse med. Derefter gik vi videre til at lave en wireframe til bærbare/tablets. De wireframes, vi lavede, blev hevet frem flere gange i vores videre arbejde, hvis der opstod tvivlsspørgsmål i forhold til specifikke elementers placering. Hvis vi skulle overlevere vores wireframes til andre, som derefter skulle arbejde videre med dem, ville vi på baggrund af skitserne lave en digital version, så de blev mere forståelige og entydige. Ifølge vores problemformulering er vores mål, at zoo.dk skal være nyskabende og intuitiv og kun give brugerne den information, de rent faktisk har behov for. Det forsøgte vi at opnå ved at tage udgangspunkt i vores card sorting og den efterfølgende mini-bruger-test under udarbejdelsen af vores wireframes. 14 Se afsnit 10 15

16 10 Responsive design Take advantage of the enormous growth in mobile internet usage and find new ways for people to use our websites and applications. (Wroblewski, 2011) Sådan lyder opfordringen fra forfatteren og webudvikleren Luke Wroblewski i hans bog, Mobile First. Og det er netop det, som er et af målene med denne opgave. I vores problemformulering skriver vi, at det nye zoo.dk skal tilpasse sig alle skærmtyper og størrelser automatisk. Dette kaldes også responsive webdesign. Responsive webdesign er i kraftig fremgang i takt med at antallet af smartphones og tablets vokser 15, og nye tal viser, at selv inden for hjemmets fire vægge, hvor computeren ellers er inden for rækkevidde, sker en stigende andel af vores internetbesøg via en mobiltelefon. (Wroblewski, 2011) Vi ønsker at udnytte de muligheder, som denne udvikling lægger op til og vi er inspireret af det følgende citat fra den grafiske designer, Mark Boulton: 15 January_2012_U.S._Mobile_Subscriber We need to shed the notion that we create layouts from a canvas in. We need to flip it on its head, and create layouts from the content out. 16 Mark Boultons pointe er, at vi indtil nu har opfattet internettet som et fast medie, hvor man har udviklet layouts, som passede til rammen på en standard computerskærm. Men hvis vi vil følge med udviklingen, må vi ændre vores traditionelle opfattelse og begynde at tænke i fleksibelt design, der passer til den moderne internetbruger, som både går på nettet fra mobilen, tv et og ipad en. Vi synes, det er meget interessant at redesigne Zoo Københavns hjemmeside med udgangspunkt i brugeren, indholdet og den lille skærmstørrelse. Vi kan forestille os flere oplagte muligheder, hvor man eksempelvis kan søge informationer om dyr, begivenheder, guidede ture og så videre fra sin telefon, mens man fysisk befinder sig i haven eller er i færd med at planlægge et besøg. I mobiludgaven har vi valgt at nedprioritere virksomheden zoo og skoletjenesten, da vi vurderer, at det primært er besøgende der vil tilgå zoo.dk fra mobilen. Vi er desuden meget opmærksomme på, at der skal være nem adgang til oplysninger som åbningstider, dagens program, 16 http//wwwmarkboulton.co.uk/journal/comments/a-richer-canvas 16

17 nyheder, spisesteder, parkeringsforhold og så videre. I mobiludgaven har vi dog fjenet cirklerne og dermed åbningstider og billetpriser fra toppen af siden. Knappen med praktisk info har nu fået så central en placering, at vi mener, at brugerne intuitivt vil trykke her for at fi nde åbningstider og priser. Der er dog også udfordringer ved mobile fi rst -udviklingen. En af dem går ud på, at folk typisk kun har den halve opmærksomhed på telefonen, og dermed altid er klar til at vende opmærksomheden mod noget andet. Wroblewski beskriver det på følgende måde: One eyeball - one thumb (Wroblewski, 2011) Det betyder, at vi skal simplifi cere designet af siden både i forhold til indholdet og det visuelle aspekt. Med hjælp fra vores card sorting og vores personaer har vi forsøgt at skære helt ind til benet og hele tiden stillet spørgsmålet: hvad er vigtigt for brugerne? Når man arbejder med sidens visuelle udtryk på en mobil, er det desuden vigtigt at huske på, at folk ofte manøvrerer med højre tommel- eller pegefi nger. Derfor skal felterne være forholdsvis store, så de er nemme at markere. Eksempelvis skal menu-baren være foroven, så der ikke er for Figur 1: Det mørkegrønne felt er nemt at nå, det lysegrønne er ok og det gule felt kan let nås ved at strække fi ngeren. (Wroblewski, 2011) mange menupunkter på den lille skærm. Figur 1: Det mørkegrønne felt er nemt at nå, det lysegrønne er ok og det gule felt kan let nås ved at strække fi ngeren. (Wroblewski, 2011) Som nævnt tidligere vil en webside opbygget efter principperne bag mobile fi rst, som den vi arbejder med, altid være forholdsvis lang. En af forklaringerne på det er, at det giver en bedre brugeroplevelse, hvis siden kun skal loade én gang. På den måde tager vi også hensyn til, at det mobile net kan 17

18 være både langsomt og kostbart. En måde at undgå for meget tekst på siden er ved at vise indholdet i stedet for at skrive det. (Wroblewski, 2011) Det har vi forsøgt at gøre ved at samle mange forskellige informationer, som man tidligere kunne finde spredt på mange sider, i en visuel genstand: Et oversigtskort over Zoo København. På denne måde får vi præsenteret en masse praktisk information på en overskuelig og visuel måde, der både appellerer til at blive brugt fra den stationære computer såvel som mobilen. På oversigtskortet kan brugeren blandt andet få vist spisesteder, toiletter og så videre. 17 I forbindelse med vores æstetiske overvejelser har vi ladet os inspirere af Lektor og studieleder ved Kommunikation på RUC, Lisbeth Thorlacius. Hun har opstillet fire vigtige punkter, som man ikke må glemme, når man laver webdesign: Æstetikken skal understøtte de indholdsmæssige og funktionelle aspekter Æstetikken skal tilpasses den websitegenre, som vi opererer indenfor. Æstetikken skal tilpasses målgruppen De æstetiske aspekter er udarbejdet i forhold til funktion, websitegenre, målgruppe og afsenderprofil. (Thorlacius, 2005) 11 Visuelt udtryk Farvevalget har stor betydning for brugerens opfattelse af en hjemmeside, og de forkerte farver kan være med til at ændre opfattelsen af en virksomhed. 18 Desuden kan farver hjælpe sidens usability på vej. 17 se bilag Vi har valgt vores farver med udgangspunkt i det farveunivers, som allerede er på Zoo Københavns hjemmeside i dag, og det er vores mål, at farverne signalerer liv og appellerer til både voksne og børn. Rent praktisk brugte vi hjemmesiden Kuler 19 til at sammensætte vores egen farvepalet 20. Vi har fundet de grafiske tegninger af zebraerne i årsberetnin Se bilag 12 18

19 gen fra 2010, og aben under menuen fandt vi et magasin. Da de ikke var tilgængelige i høj opløsning, har vi bearbejdet dem i Photoshop, tegnet ovenpå og gemt dem i gif-format og pngformat, der hvor vi havde brug for gennemsigtighed. De skal signalere bevægelse og give siden liv på en anderledes måde. Vi har bevidst forsøgt at undgå illustrationer, der bliver skåret over i bunden, og derfor skærer siden over. Vi har prioriteret at holde en gennemgående linje i det grafiske udtryk, og vi har arbejdet med organiske former og runde hjørner på bokse og menuer. Vores ambition har hele tiden været at bevæge os væk fra den traditionelle boks-model, som ellers huserer på zoo-hjemmesider 21. Det har blandt andet betydet, at vi har beskåret indholdet på siden, så det nærmest er på vej ud over kanterne og sprænger rammerne. Vi vil gerne have, at forsiden har en robust, grafisk identitet, som giver presseafdelingen mulighed for selv at opdatere indholdet i form af eksempelvis nyheder ellertilføje og fjerne de runde bobler. Desuden er det vigtigt, at siden er fremtidssikret, så man kan skifte den grafiske illustration ud om et halvt år og stadig gen- 21 Se afsnit 4.1 i opgaven kende Zoo København. 12 HTML og CSS 12.1 Arbejdsmetode I det indledende kodningsarbejde koncentrerede vi os om hvert vores element, og efterfølgende satte vi dem sammen i ét dokument. Der skulle løses en del større og mindre problematikker undervejs, så det virkede som en god løsning. Det gav dog lidt udfordringer, når vi sammenføjede koderne. På et tidspunkt krævede det eksempelvis et større opklaringsarbejde at finde ud af, hvorfor dele af siden pludseligt fungerede som ét stort link. Omvendt har vi svært ved at se, hvordan vi skulle have arbejdet sammen på én computer eller i det samme dokument. Vi har mødt en del tekniske udfordringer i forbindelse med designet af den nye hjemmeside. Eksempelvis kortet, der skulle vise forskellige ikoner, de horisontale slidere og kalenderen med pop up tekst. Vi har brugt nettet til at finde mulige løsninger og analyseret an- 19

20 dre siders kildekoder for at blive inspireret til, hvordan vi eventuelt kunne løses vores egne problemer Generel opbygning Siden er optimeret til at blive vist i browserne Mozilla Firefox og Chrome. Vi har opbygget siden i procenter og em s, så den tilpasser sig forskellige skærmstørrelser med responsive design. Vi har designet siden som en lang side, som kan scrolles ned, eller man kan via menuens punkter komme til bestemte dele. Menuen har af samme grund position: fixed, så den følger med hele vejen. Headeren og elementerne på toppen af siden har en bredde på 100 %, og menuen har en bredde på 12% procent. Resten af indholdet er i en article med width sat til 82% og en margin til venstre på 13% for at holde den fri fra menuen. Derefter er hver del i henhold til menuen i en særskilt article som har position: relative for at kunne placere elementer med position:absolute. På baggrund af vores overordnede designstrategi har vi valgt ikke at have en fast bredde på 900 pixels, og i stedet udnytte den relevante skærm 100 procent. Vi har justeret elementerne med media querias til størrelse < 1200px, 960px, 700px, 480px og 320px. I den givne opgave har vi fokuseret på media query for <480px og 320px. Vi har i vid udstrækning benyttet pseudoselectors og z-index til at udforme de dynamiske elementer. Kompositionen og placeringen af cirklerne øverst på siden er vigtig for helhedsindtrykket af siden. Det viste sig at blive for ukontrollabelt med procenter, derfor er de defineret med højde, bredde og border-radius i pixels og justeret med media query. I koden er hele remsen -moz-border-radius og -webkit-borderradius med for at borderradius understøttes i andre browsere, det validerer dog ikke som CSS3. I forbindelse med media queries har vi desuden haft brug for at udelukke nogle elementer, det er gjort med display: none; herved optager elementet ikke stadig sin plads, men resten af indholdet flytter sig respektivt Media querias 12.4 Dynamiske elementer 20

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

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

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

NY IDENTITET TIL SCHWARZ

NY IDENTITET TIL SCHWARZ GRAFISK DESIGN NY IDENTITET TIL SCHWARZ Redskaber: Photoshop Illustrator Kundeprofil: Schwarz er en eksklusiv forhandler af senge og tilbehør i topklavlitet. Med deres store sortiment af kvalitetsmærker

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

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

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

Grafisk workflow. bl.udbudsnet.dk

Grafisk workflow. bl.udbudsnet.dk Grafisk workflow. bl.udbudsnet.dk Hvad går opgaven ud på? Opgaven gik ud på at lavet et præsentations website for Udbudsnet. Hjemmesiden skulle bruges til at sælge Udbudsnet, på en messe som hedder BL.

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

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

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

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

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 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

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

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

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

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

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

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

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

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

WorkFlow. Svendeprøve Emil Momsen. BeskrivelseN ****** BeskrivelseN ******

WorkFlow. Svendeprøve Emil Momsen. BeskrivelseN ****** BeskrivelseN ****** Workflow Svendeprøve Emil Momsen BeskrivelseN WorkFlow BeskrivelseN Side - 2 / 8 Arktis Brief Fra kunde Opgave / Indhold Kunden var WWF og opgaven gik ud på at få folk til at blive klar over, hvor alvorligt

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

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

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

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

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

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

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

WORKFLOW. RESPONSIV HJEMMESIDE MED ET FARVETWIST Hjemmesidedesign og udvikling. www.mads-pj.dk/clothesly

WORKFLOW. RESPONSIV HJEMMESIDE MED ET FARVETWIST Hjemmesidedesign og udvikling. www.mads-pj.dk/clothesly WORKFLOW RESPONSIV HJEMMESIDE MED ET FARVETWIST Hjemmesidedesign og udvikling www.mads-pj.dk/clothesly DOKUMENTATION OPGAVE Opgaven jeg stillede mig selv, var at designe og kode et koncept til en webshop

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

8 tips og tricks der sender din webshop i superligaen

8 tips og tricks der sender din webshop i superligaen 8 tips og tricks der sender din webshop i superligaen Indhold Intro Kend dine besøgende Gør valget simpelt og vind kunder Sådan får du en optimeret kategoriside Eksempler på to gode kategorisider Brug

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

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

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

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

Grafisk Workflow. Endeligt layout. Om mig. Forside. Portfolio Endeligt layout Forside Om mig Portfolio 1 Hjemmeside Opgaven I dette design projekt skulle jeg gennemføre en designproces, hvor jeg enten skulle redesigne eller designe et produkt. Jeg valgte at designe

Læs mere

Karens vejledning til WordPress, september 2014 1

Karens vejledning til WordPress, september 2014 1 Karens vejledning til WordPress, september 2014 1 Karens WordPress vejledning september 2014 INDHOLD Hvad er WordPress 1 Generelt om WordPress 2 Frontend og backend 2 Skrive en blog-tekst (indlæg/post)

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

Trin for trin guide til Google Analytics

Trin for trin guide til Google Analytics Trin for trin guide til Google Analytics Introduktion #1 Opret bruger #2 Link Google Analytics til din side #3 Opret konto #4 Udfyld informationer #5 Gem sporings id #6 Download WordPress plugin #7 Vent

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

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

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

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

GRAFISK WORKFLOW WEBSITE - CHOCOADDICT

GRAFISK WORKFLOW WEBSITE - CHOCOADDICT GRAFISK WORKFLOW WEBSITE - CHOCOADDICT DOKUMENTATION OPGAVEBESKRIVELSE Opskriftsbogen Chocoaddict skulle have et website, hvor alle opskrifter samt skabelon til print selv opskriften er tilgængelig. Der

Læs mere

Indholdsfortegnelse Idéen bag logo Idéen bag website Farveversioner af logo Webdesign Videoen: Visuelle tanker Stil Speciel effects Motion Design

Indholdsfortegnelse Idéen bag logo Idéen bag website Farveversioner af logo Webdesign Videoen: Visuelle tanker Stil Speciel effects Motion Design 1 Indholdsfortegnelse Idéen bag logo 3 Idéen bag website 4 Farveversioner af logo 5 Webdesign 6 Videoen: 7 Visuelle tanker 7 Stil 7 Speciel effects 8 3D 8 Motion Design 9-10 2 Introduktion Hoved idéen

Læs mere

Pixlr - vejledning Udarbejdet februar 2014

Pixlr - vejledning Udarbejdet februar 2014 Pixlr - vejledning Udarbejdet februar 2014 www.skive.dk 2.1 Billedbehandlingsprogrammet Pixlr.com Til redigering af et billede kan du med fordel benytte webtjenesten Pixlr, som du kan tilgå fra hvilken

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

Dynamisk Webdesign. Stefan Grage

Dynamisk Webdesign. Stefan Grage Dynamisk Webdesign Stefan Grage Brugen af web Hvilke sites besøger i oftest? Og hvorfor? Snak med sidemanden i 3 min. Kategorisering Utility sites Sociale sites Webshops Indholdstunge sites Utilities Google

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

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

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

Vejledning for LOF s afdelingshjemmeside

Vejledning for LOF s afdelingshjemmeside Vejledning for LOF s afdelingshjemmeside - redigeret i Umbraco Marts 2012 Adresse: http://dinafdeling.lof.dk/ Rediger hjemmeside i Umbraco: http://dinafdeling.lof.dk/umbraco/ Mobilside: Der er lavet en

Læs mere

MANUAL - Joomla! Version 1

MANUAL - Joomla! Version 1 MANUAL - Joomla! Version 1 Indhold Retningslinjer for hjemmesiden... 3 Log ind... 3 Ret i en artikel, der allerede er oprettet... 4 Opret ny artikel... 8 a) Skriv direkte i tekstfelt... 9 b) Indsæt tekst

Læs mere

Delaflevering FUA.4 Betina Korsbro, Mi Louise Hansen, Jesper Led Lauridsen og Knud Back

Delaflevering FUA.4 Betina Korsbro, Mi Louise Hansen, Jesper Led Lauridsen og Knud Back Delaflevering FUA.4 Betina Korsbro, Mi Louise Hansen, Jesper Led Lauridsen og Knud Back 1 Indhold 1.1 Generelt i forhold til projektet 1.1.1 Problemformulering Kalundborg kommune har gennem de senere år

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

Kommunikation/IT C - Afsluttende opgave 2011

Kommunikation/IT C - Afsluttende opgave 2011 Kommunikation/IT C - Afsluttende opgave 2011 Roskilde Tekniske Gymnasie Martin Fabricius & Simon Dein, 1.3 Side 1 af 11 Indholdsfortegnelse: Indledning... s3 Målgruppe (diskussion)... s4 indledende kravfangst...

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

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

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

Yosef Saleh, Ilyas Tulumcu Oguzhan Polat, Mohammad Kaddoura Kom/IT C Kl. 1.2

Yosef Saleh, Ilyas Tulumcu Oguzhan Polat, Mohammad Kaddoura Kom/IT C Kl. 1.2 1/ Indholdsfortegnelse Indledning... 3 Dokumentation... 4 Hjemmeside og logo design... 14 Valg af skrifttype... 15 AIDA... 16 Arbejdsroller og opgaver... 17 Logbog for vores proces (Ugevis)... 19 Konklusion...

Læs mere

GRAFISK DESIGN RESPONSIV WEBSHOP MED ET FARVETWIST

GRAFISK DESIGN RESPONSIV WEBSHOP MED ET FARVETWIST GRAFISK DESIGN RESPONSIV WEBSHOP MED ET FARVETWIST Hjemmesidedesign og udvikling www.mads-pj.dk/clothesly MADS PADKÆR JØRGENSEN - GRAFISK DESIGN Side 1 af 13 DOKUMENTATION OPGAVE Opgaven jeg stillede mig

Læs mere

Cindie Mortensen, Merete Koudahl, Pernille Tramp Webdesign, gruppeprojekt exercise 7. Menu A/S

Cindie Mortensen, Merete Koudahl, Pernille Tramp Webdesign, gruppeprojekt exercise 7. Menu A/S Menu A/S Problemfelt MENU A/S (MENU) er en dansk design virksomhed og producent. MENU har specialiseret sig indenfor skandinavisk design samt deres evige stræben efter at lave noget originalt. De repræsenterer

Læs mere

Vejledning i upload af serier til Danske tegneseriskaberes app.

Vejledning i upload af serier til Danske tegneseriskaberes app. Vejledning i upload af serier til Danske tegneseriskaberes app. En kort intro Version 1.2 22/11/2012 Danske Tegneserieskabere har lavet appen for at give medlemmer og andre en nem adgang til at publicere

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

Projekt Kom/it A Semester 6

Projekt Kom/it A Semester 6 Jeanette Bengtsen og Isabel Odder Projekt Kom/it A Semester 6 Applikation - Virette Klasse 3.5k 05-04-2011 Indholdsfortegnelse: Indledning:... 2 Bollemodel:... 3 Formål og præmis:... 3 Indhold:... 3 Målgruppe:...

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

Når du har logget dig ind, ser du Randers Kommunes byvåben midt på siden. I venstre side er der en række mapper:

Når du har logget dig ind, ser du Randers Kommunes byvåben midt på siden. I venstre side er der en række mapper: DXP vejledning Generelt: DXP er et værktøj til at fremstille præsentationsmaterialer (foldere, brochurer, løbesedler mv.) DXP egner sig kun til mindre brochurer og lign., da den største skabelon kan rumme

Læs mere

foto // billeder fra hjemmesiden Websiden // feriebolig-i-toscana.dk

foto // billeder fra hjemmesiden Websiden // feriebolig-i-toscana.dk GRAFISK DESIGn Webdesign Min chef ville gerne have lavet en webside til firmaets udlejningshus i Italien. Huset på 200 m² er et traditionelt toskansk landhus i tre etager og ligger i gåafstand fra middelalderlandsbyen

Læs mere

- opgave 3, Semester 2. Gruppe xx - The Cook Club Project/2. Claus Buus Christensen claus.buus@hotmail.com http://cbuus.dk

- opgave 3, Semester 2. Gruppe xx - The Cook Club Project/2. Claus Buus Christensen claus.buus@hotmail.com http://cbuus.dk Responsive Design Mul-a 2013 RAPPORT - opgave 3, Semester 2 Gruppe xx - The Cook Club Project/2 Claus Buus Christensen claus.buus@hotmail.com http://cbuus.dk Ole Jørgen Hansen ohan@post.tele.dk www.gribskovweb.dk

Læs mere

Designmanual for websider

Designmanual for websider Designmanual for websider 31. marts 2009 Version 1.1. Denne manual beskriver de gældende retningslinjer for Aalborg Universitets websider. Det vil sige websider der benytter aau.dk i domænenavnet er omfattet

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

Introduktion til billeddatabasen

Introduktion til billeddatabasen Introduktion til billeddatabasen Colourbox.dk Colourbox.dk er den billeddatabase som Odense Kommune har købt licens til. Det er vigtigt at bemærke, at der ikke er ubegrænset download af billeder. I materialet

Læs mere

Wordpress 2.7. Manual for redaktør/blogger Webwoman.dk. Denne version er fra 9. marts 2009. Må frit kopieres og distribueres i original version

Wordpress 2.7. Manual for redaktør/blogger Webwoman.dk. Denne version er fra 9. marts 2009. Må frit kopieres og distribueres i original version Wordpress 2.7 Manual for redaktør/blogger Webwoman.dk Denne version er fra Må frit kopieres og distribueres i original version 2 Indhold Gennemgående udtryk, du bør kende... 4 Log ind på din hjemmeside/blog...

Læs mere

10-trins raket til logo-design

10-trins raket til logo-design 10-trins raket til logo-design Stjerne-modellen Dette notat er udarbejdet i forbindelse med foredrag og kurser som supplement til bogen Virksomhedens logo. Ideen er, at det skal fungere sammen med bogen,

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

RAPPORT Projekt 4: Website design 10-28.11.2014 Gruppe A3: Anastasia Keller, Jakob Plenge, Rasmus Bernhard, Benjamin Vinje, Raquel Hesdorf

RAPPORT Projekt 4: Website design 10-28.11.2014 Gruppe A3: Anastasia Keller, Jakob Plenge, Rasmus Bernhard, Benjamin Vinje, Raquel Hesdorf RAPPORT Projekt 4: Website design 10-28.11.2014 Gruppe A3: Anastasia Keller, Jakob Plenge, Rasmus Bernhard, Benjamin Vinje, Raquel Hesdorf 1 Web-agency Den første del af opgaven var at skabe en web-agency

Læs mere

Personlig branding i webdesign

Personlig branding i webdesign Personlig branding i webdesign I forhold til vejledning vil jeg spørge, om opgaven i sin helhed ser fornuftig ud. Er min problemformulering skarp nok? Er min metode i orden? Er det ok at gøre brug af min

Læs mere

GRAFISK DESIGN. Kenneth Friis Petersen

GRAFISK DESIGN. Kenneth Friis Petersen GRAFISK DESIGN Kenneth Friis Petersen Kenneth Friis Petersen - Svendeprøve 2015 Opgavebeskrivelse Total redesign af hjemmeside til Trademark Textiles A/S, både layout og kodning af side. Trademark textiles

Læs mere

S&E Bazar Fyn. Mads, Asger, Lærke og Alexander WEB-A 11-12-2012

S&E Bazar Fyn. Mads, Asger, Lærke og Alexander WEB-A 11-12-2012 2012 S&E Bazar Fyn Mads, Asger, Lærke og Alexander WEB-A 11-12-2012 Indhold Indledning... 2 Problemformulering:... 2 Problemstillinger:... 2 Kommunikation:... 3 Hvilken målgruppe ønsker vi at henvende

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

Eksamensopgave 2012. Aarhusportalen. Melissa Emilie

Eksamensopgave 2012. Aarhusportalen. Melissa Emilie Eksamensopgave 2012 Aarhusportalen Melissa Emilie Indhold Indhold... 1 Aarhusportalen... 2 Projektbeskrivelse... 2 Hvem er kunden... 2 Målgruppe... 2 Hvad ønsker vi at opnå... 2 Temaer... 2 Tidsplan...

Læs mere

Kunsten på Silkeborg Højskole - en online kunstregistrant

Kunsten på Silkeborg Højskole - en online kunstregistrant GRAFISK DESIGN Design af responsiv hjemmeside til Silkeborg Højskoles nye kunstregistrant. Oprettelse af ny side på Silkeborg Højskoles primære hjemmeside. Kunsten på Silkeborg Højskole - en online kunstregistrant

Læs mere

Grafisk design. Produkt: Responsiv hjemmeside Klient: EUC Nordvestsjælland

Grafisk design. Produkt: Responsiv hjemmeside Klient: EUC Nordvestsjælland Grafisk design Produkt: Responsiv hjemmeside Klient: EUC Nordvestsjælland 06// Opgave EUC Nordvestsjælland ønskede at få en mere tidssvarende og simpel hjemmeside. Jeg fik til opgave at lave en prototype.

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

Hassansalem.dk/delpin User: admin Pass: admin INTERFACE DESIGN

Hassansalem.dk/delpin User: admin Pass: admin INTERFACE DESIGN Hassansalem.dk/delpin User: admin Pass: admin INTERFACE DESIGN 1/20 Indledning Dette projekt er den afsluttende del af webudvikling-studiet på Erhvervs Lillebælt 1. semester. Projektet er udarbejdet med

Læs mere

Indhold Formål:... 3 De 6 faser:... 3 Fase 1: Problemanalyse... 3 Fase 2: K-strategi... 3 Fase 3: Idéudvikling... 4 Fase 4: Medieproduktion...

Indhold Formål:... 3 De 6 faser:... 3 Fase 1: Problemanalyse... 3 Fase 2: K-strategi... 3 Fase 3: Idéudvikling... 4 Fase 4: Medieproduktion... Indhold Formål:... 3 De 6 faser:... 3 Fase 1: Problemanalyse... 3 Fase 2: K-strategi... 3 Fase 3: Idéudvikling... 4 Fase 4: Medieproduktion... 4 Fase 5: Test... 5 Fase 6: Offentliggørelse... 5 Kanyle-modellen:...

Læs mere

Manual til hjemmeside i Typo3

Manual til hjemmeside i Typo3 Manual til hjemmeside i Typo3 Gode tips og genvejstaster Ét linieskift Ctrl + A Ctrl + C Ctrl + X Ctrl + V shift + enter (tasten du normalt bruger til linieskift) Markér alt Kopier Klip Sæt ind Oprettelse

Læs mere

Computerundervisning

Computerundervisning Frederiksberg Seminarium Computerundervisning Koordinatsystemer og Funktioner Lærervejledning 12-02-2009 Udarbejdet af: Pernille Suhr Poulsen Christina Klitlyng Julie Nielsen Indhold Introduktion... 3

Læs mere

Vejledning for LOF s afdelingshjemmeside - redigeret i Umbraco

Vejledning for LOF s afdelingshjemmeside - redigeret i Umbraco Vejledning for LOF s afdelingshjemmeside - redigeret i Umbraco Adresse: http://dinafdeling.lof.dk/ Rediger hjemmeside i Umbraco: http://dinafdeling.lof.dk/umbraco/ HUSK ingen www i adressen, skriv blot

Læs mere

Outlook 2010 opsætning

Outlook 2010 opsætning Outlook 2010 opsætning Personlig Workflow Nå mere og arbejd mindre Personlig Workflow www.personligworkflow.com kontakt@personligworkflow.com Introduktion til Outlook 2010 guide Microsoft Outlook 2010

Læs mere

Sundhedsapp.dk. - I hvor høj grad, skal vi have fokus på de potentielle brugere af websitet?

Sundhedsapp.dk. - I hvor høj grad, skal vi have fokus på de potentielle brugere af websitet? Oplæg til vejledning Sundhedsapp.dk - I hvor høj grad, skal vi have fokus på de potentielle brugere af websitet? - Kan man overhovedet forestille sig at udarbejde en prototype uden nogle former for feedback?

Læs mere

Rapport. Udarbejdet af: Mayianne Nøks Pedersen. Skole login: knmape68. E-mail: mypedersen@gmail.com

Rapport. Udarbejdet af: Mayianne Nøks Pedersen. Skole login: knmape68. E-mail: mypedersen@gmail.com Rapport Udarbejdet af: Mayianne Nøks Pedersen Skole login: knmape68 E-mail: mypedersen@gmail.com URL til brugerundersøgelsen: http://web328.webkn.dk/hjemmeside/image/laering/sem2brugerundersogelse/brugerundersogelse/

Læs mere

Drejebog til tractorpulling.dk

Drejebog til tractorpulling.dk Drejebog til tractorpulling.dk Generelt På hjemmesiden benyttes følgende som standard: - Skrifttype: Verdana - Skriftstørrelse: 12px / 9pt. 4. oktober 2011 Moskjær Marketing Falkevej 4 DK-6920 Videbæk

Læs mere

Dokumentation. Inspiration S34 S35. Opgavens art Fiktiv opgave af opbygning af en hjemmeside.

Dokumentation. Inspiration S34 S35. Opgavens art Fiktiv opgave af opbygning af en hjemmeside. Grafisk Design Dokumentation Inspiration Opgavens art Fiktiv opgave af opbygning af en hjemmeside. Kort om opgaven Hjemmesiden, skulle være oplysende om produkter og virksomheden, den skulle være enkel

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

Hold kontakten med dit netværk!

Hold kontakten med dit netværk! Hold kontakten med dit netværk! - Outlook er dit netværksprogram Outlook er mere end blot et mailprogram Du kan bruge Outlook til meget mere end blot at sende og modtage mails med. Eksempelvis, så er Outlook

Læs mere