Indholdsfortegnelse UNG & SUND

Størrelse: px
Starte visningen fra side:

Download "Indholdsfortegnelse UNG & SUND"

Transkript

1 Rapport Web site mad og livsstil Lavet af Michael Vinzent Dalgaard Peter Michael Schindler Stefan Skjerning Renata Tautavice Sara Vang Erhvervsakademiet København Nord MULTIMEDIEDESIGNER 2. SEM. 12. FEBRUAR - 3. MARTS 2009 UNG

2 Indholdsfortegnelse Indledning... side 2 Problemformulering... side 3 Udviklingsmetode... side 4 Profil af målgruppe... side 5 Segmenteringsanalyse... side 6 Interessentanalyse... side 6 Informationsdesign, interaktionsdesign og præsentationsdesign... side 7 Designbrief... side 8 Logo til Ung og sund... side 8 Gestaltlove... side 9 Use case-model og -beskrivelse... side 10 Site map og beskrivelse... side Navigationsdiagram... side 13 Søgemaskineoptimering... side 14 Konklusion... side Evaluering af produkt og proces... side 17 Bilag: Behandling og resultat af spørgeskema... bilag 1 Relevante screen dumps fra websiderne og centrale dele af koden... bilag 2 Tidsplan (gantt-diagram)... bilag 3 1

3 Indledning Mad og livsstil er emnet på dette projekt, som vi har fået stillet i 2. semesters første projekt. Formålet med projektet er at lave et web site omhandlende mad - i form af opskrifter, kostråd og artikler - som både indholdsmæssigt som designmæssigt er attraktivt at besøge for studerende mellem 19 og 24. Kollegie-venligt De studerendes forholdsvis dårlige økonomi har en afgørende betydning for web sites udvalg af opskrifter. Da selve målgruppen tager udgangspunkt i kollegiesegmentet, vil der også blive taget hensyn til en gennemsnitlig begrænset erfaring med madlavning samt en begrænset adgang til tilberedningsudstyr. Endelig skal indholdet også komme med konkrete råd og anbefalinger om en sund kost. Derfor vil indholdet på vores web site dels være præget af billige madretter, der er nemt tilgængelig for studerende, dels af madretter, der kan tilberedes med få kogeplader og en lille ovn, og dels et indhold, der værner om ernæringsrigtige opskrifter og kommer med brugbare råd og artikler. disse resultater har vi kunnet vurdere, om vores egne ideer omkring web sites indhold og design harmonerer med den virkelige verden. Opgaveløsning I vores gruppe har vi lagt vægt på et kollaborativt samarbejde, hvor vi snakker sammen om forestående opgaver og hver især bidrager til vores fælles opgave. Som en hjælp hertil har vi lagt en tidsplan gældende for den tid, projektet er sat til (jf. bilag 3). På den måde har vi kunnet danne os et godt overblik over projektets indhold og de stillede krav. Selv om der har været mange navneforslag til web sitet oppe at vende, er vi i gruppen blevet enige om ét navn, der beskriver vores web site ganske godt: Ung og sund. Indramning af målgruppen For at kunne tilpasse web sitets indhold og design til målgruppen, har vi udarbejdet et spørgeskema omhandlende studerendes kost og madvaner samt foretrukken web site-type og skrifttype, som vi har givet en række unge studerende i kollegiesegmentet. Ud fra 2

4 Problemformulering Hvordan kan vi konstruere et web site, der appellerer til studerende i aldersgruppen år om en sund og varieret kost? Hvordan udvælger vi web sitets retter, så de tiltaler målgruppen prismæssigt, sundhedsmæssigt og kvalitetsmæssigt, samtidig med at web sitet bliver overskueligt? Hvordan får vi afstemt indhold til målgruppen, så det skaber interesse og nysgerrighed? Hvad vil vi sætte specielt fokus på, så sundheden bliver afspejlet i web sitets indhold? Hvordan sikrer vi, at designet er attraktivt, nemt at navigere i, konsistent og målrettet til målgruppen? 3

5 Udviklingsmetode HOME Da HOME er en meget åben udviklingsmetode, er den forholdsvis nem at tilpasse forskellige projekter. Dette er den primære grund til vores valg om at arbejde ud fra denne metode. HOME er dog meget omfattende, hvilket gør at vi ikke vil have tid til at udføre projektet i HOMEs fulde version. Derfor skærer vi det ned til en light version, hvor vi bruger de væsentligste dele fra hvert trin. Derved får vi sikret os den bedste gennemgang til præcist dette projekt, samt sikret at vi får mest mulig af den relevante læring til netop dette projekt. Adskillelsen som HOME giver mellem aktiviteterne vil gøre arbejdet lettere, og mere målrettet, da vi får lettere ved at holde tingene adskilt, og bevare overblikket. Udviklingsmetoden HOME Prototyping Vi har valgt at opstille vores HOME light med inspiration fra prototyping-metoden, da denne metode søger at teste produktet hos målgruppen. Derved kan vi teste, hvad målgruppen vil have med hensyn til design og indhold, og forholde os til dette i vores arbejde. På denne måde kan vi sikre os, at designet og indholdet henvender sig til vores målgruppe. 4

6 Profil af målgruppe Generel profil af målgruppen med udgangspunkt i Oscar, som er en af målgruppens typer. Studerende med begrænset økonomi Oscar er 21 år og studerer medicin på Københavns Universitet. Han er lige fløjet fra reden og har fundet sig til rette i et kollegium på det ydre Nørrebro. To gange om ugen spiller Oscar fodbold. Derudover bruger han sin tid på lektier, familie og venner. Oscars eneste indkomst er SU, som udgør 5200 kr. pr. måned før skat. Oscar har udregnet, at efter alle hans udgifter er betalt, har han et rådighedsbeløb på 50 kr. til mad pr. dag. Hjælp at hente Oscar savner sin mors gode madlavning, men der er langt til et besøg på den anden side af sundet. Oscar søger varieret og lækker kost for få penge. Det skal være nemt at tilberede i deres fælles kollegiekøkken. Køkkenet har kun en lille ovn og to små kogeblus. Selv kender Oscar ikke meget til madlavning og opskrifter på mad. Derfor spiser han meget ensformig og kedelig mad så som pasta, run osv. Oscar savner ideer til lækre retter, der er nemme at tilberede. Han kunne godt tænke sig, at der var et sted at søge inspiration om madlavning for studerende. 5

7 Segmenteringsanalyse Interessentanalyse I vores segmentering har vi målrettet og afgrænset vores produkt til en konkret målgruppe, hvilket allerede er defineret i opgavebeskrivelsen. Projektets formål er at lave et web site, som skal hjælpe unge studerende til at få en sundere og mere næringsrig hverdag for et forholdsvis lille beløb. Vi har segmenteret efter. Web sitets interessenter er: Alder: år Beskæftigelse: Studerende Bopæl Kollegium / udeboende Derudover skal de studerende have adgang til max. 2 blus og en lille elektrisk ovn, gerne en mikrobølgeovn. Idet vores produkt er et web site, har vi antaget, at de har adgang dertil (igennem internettet). Vi skal selvfølgelig ikke udelukke, at alle folk i alle aldre kan benytte vores kostplaner og bud på indkøb, da dette er billige løsninger og sund mad for alle. Lærerne (styregruppe): Har bl.a. lagt rammer for hvad et kollegiekøkken indeholder og givet retningslinier for web siden, derfor vil det få indflydelse på vores endelige resultat, da disse forhold skal tages i betragtning. Udvalgte studerende (referencegruppe): Vi har i gruppen til dette projekt været ude på et kollegium og rundt på skolen, for at indsamle meningsmålinger til hvordan de helst vil se projektets webside opbygget. Disse er selv følgelig vores elementære interessenter, da de er den afgø rende målgruppe i dette projekt. Projektudviklere (projektgruppe) Denne gruppe er os, der udvikler dette web site. Vi er en slags projektmedarbejdere i en fiktiv problemstilling. Vores meninger og indsamlede informationer udgør det endelige resultat. 6

8 Informationsdesign, interaktionsdesign og præsentationsdesign Ud fra den definerede målgruppe, web sitet Ung og sund tager udgangspunkt i, har vi lagt nogle gode strategier for, hvordan vores målgruppe får mest gavn af web sitets information og opbygning. Information Vi har med et web site at gøre, der er informativt. Det er afgørende, at de besøgende får den information, der er nødvendig for at kunne tage web sitet til sig. Derfor har vi som udviklere udvalgt lige præcis den information omkring opskrifter, artikler, gode råd osv., de besøgende finder interessante, og som skal gøre dem til en del af vores målgruppe, hvis ikke de var det i forvejen. Web sitets information har vi designet og struktureret ud fra princippet om enkelthed. Vores unge målgruppe er vant til en vis hastighed i det, de foretager sig, og har derfor ikke lyst til at skulle rode længe rundt efter den information, de har brug for. Interaktion Enkeltheden og brugervenligheden går også igen i den måde, web sitet er i interaktion med den besøgende. Det er vores mål, at alle besøgende, om det er i målgruppen eller ej, føler, at de har nem adgang til de informationer, de har behov for. Den hierarkiske struktur, vores web site anvender, gør det nemt at danne sig et overblik over mulighederne. Selve menutypen er den klart mest foretrukne blandt web sitets målgruppe (som vores undersøgelse har vist) og overskueliggør på en sikker måde de forholdsvis simple interaktionsinput, web sitet tilbyder. Præsentation Det måske vigtigste medieelement, Ung og sund gør brug af, er den tekstmæssige kommunikation. Og her er brugervenlighed også prioriteret højt. Teksten er let læselig og forståelig, og dens ikke alt for lange afsnit gør det let at danne sig et overblik. Web sitet har også et rigt indhold af billeder, der gerne har en illustrativ funktion. Billederne gør indholdet lettere at forstå og bidrager til det rene design, Ung og sund praktiserer. Designet skal med valget af lyse grønne og hvide farver, overskuelig opstilling og ung skrifttype kommunikere information og stemning. Ung og sund imødekommer brugernes krav om et funktionelt site, der er nem at forholde sig til samt en æstetik, der tiltaler dem. 7

9 Designbrief Logo til Ung og sund Herunder er vores design brief til Ung og sund, som resultaterne fra spørgeskemaerne også har haft lidt indflydelse på. Logoet er sammensat af tre ikoner, som hver især er udtryk for: Vores web side skal udstråle en sund, billig og let måde for en ung studerende at lave mad på. Web sitet skal være pænt og i et simpelt design, hvor vi har taget højde for gestaltlovene såvel som interaktions- og præsentationsdesignet. Altså skal siden være lavet med henblik på vores målgruppe i et moderne design. Vi vil prøve at gøre siden så indbydende som mulig, så appetitten vækkes hos modtageren. Man skal få lyst til at lave den mad, vi skilter med, og det skal være let og ligetil...også selvom det er sund og næringsrig mad. Vores opsætning af siden skal være let overskuelig, såden besøgende hurtigt kan finde opskrifter, gode råd og simple kostplaner. Kokkehue: Mad/lækker mad, tilberedning, kogekunst, kokke-/mad-ekspert. Æble: Sund mad, frugt, helse, varieret, anbefalet kost. Bestik: Spise, madsted, få stillet sin sult. Fællestræk for de tre ikoner: Alle 3 ikoner er noget, vi forbinder mad. Tilsammen illustrerer de lækker mad, der er sund og appetitligt. Vi har altså tale om en treenighed, som har at gøre med mad, forberedelse af mad samt spisning af mad. Hvilket vi mener har et fuldkomment udtryk for madkunsten. Farverne på ikonerne er valgt ud fra deres naturlige farver. Dog er bestikket anlagt i sort og er placeret i baggrunden. Den sorte farve skal forstås som en skyggeeffekt, der her ligger i baggrunden for selve mad-processen (altså spisning efter madlavning). Bestikket skal forstås som udstrakte arme, der lægger op til et åbent og glædeligt udtryk, også selvom den besøgende foretrækker information om det eftersøgte hurtigt. 8

10 Gestaltlove Loven om figur og baggrund Som udgangspunkt er det vigtigt at baggrunden på vores hjemmeside ikke har en for kraftig nuance, da dette forvirrer modtageren, om hvorvidt det er baggrund eller forgrund. Derfor vil vi på vores web site tone farven ned på baggrunden, sørge for at skrift og andet visuelt træder frem for baggrunden. Dette hjælper vi også til med ved at vælge en baggrund med rolige farver frem for en skrigende og alt for iøjnefaldende baggrund. Loven om nærhed Det er vigtigt at alle punkter på siden holdes adskilt, hvis tingene skal forstås hver for sig. Derudover er det lige så vigtigt, at elementerne har mindre mellemrum fra hinanden, hvis de skal tolkes som sammenhængende (f.eks. billede og tekst). Der skal her fokuseres på afsnit, margin og luft mellem kolonner for at gøre det så logisk og letlæseligt som muligt. Loven om lighed I dette punkt er det elementært, at vi på siden adskiller ting med f.eks. farver eller i form af afsnit. Hvis de forskellige elementer skal ses i sammenhæng, vil de have samme form eller farve. Der er sågar fokus på, at understregninger er forbudte, da modtageren forbinder dette med et link. Det er vigtigt, at web sitets menuer, skrifttype, opstilling m.m. tager udgangspunkt i samme form eller farve, så der ikke opstår forvirring. Loven om lukkethed Denne lov hænger lidt sammen med loven om lighed, da disse to skal kombineres logisk for at få det rigtige budskab ud til modtageren/brugeren. Ung og sund-web sitet gør brug af rammeafdelinger, der får indholdet til at give den besøgende ro og overblik. Man kan således i mange tilfælde anvende rammer til at omkredse informationsfelter, der normalt ville virke forvirrende, hvis disse stod løst og ikke i fastlagte rammer. Loven om forbundethed Dette er den sidste, men vel også vigtigste lov. Som webdesigner kan man anvende tråde og overlapninger for at linke ting som billeder og tekst sammen, ligesom det også er tilfældet med kroppens anatomi, når bestemte organer er forbundet til et navn. Det essentielle i denne lov er at de forskellige love kan modarbejde hinanden, og det er vigtigt at være opmærksom. Det sker ofte, at folk glemmer enkelte love i et forsøg på at overholde en anden lov. Derfor er det meget vigtigt at have alle lovene med i sin betragtning, når man laver et web site. 9

11 Use case-analyse og beskrivelse Use case Actors Til vores hjemmeside har vi 3 forskellige actors at have med i vores overvejelser: Studerende, webmaster og madudvalg. Kostplaner Studerende De studerende, som ofte har begrænsede midler at gøre godt med og også gerne har mange ting at se til, er Ung og sunds målgruppe og dermed primære besøgende. De har som besøgende abcdef 7-dages kostplan Artikler Madudvalg adgang til web sitets forskellige muligheder. Webmaster Kost sport Webmasteren er ansvarlig og styrer hjemmesiden. Dvs. stå for oprettelse af web sitet, links og som også kan blive kontaktet af Studerende Fødselsdag hjemmesidens brugere. Kontakt Madudvalg Der er dem, som styrer hjemmesidens indhold, skriver artikler, Links vælger opskrifter osv. Webmaster 10

12 Site map Kort beskrivelse af web sitet Kostplaner Varieret kost Mad-pyramide Kostplaner På denne side kan man se veldokumenterede anvisninger om sund og varieret kost til unge. 7-dages-kostplan Om 7-dages kostplan Mandag Tirsdag Onsdag Torsdag Fredag Lørdag Søndag Printervenlig version 7-dages-kostplan På denne side man kan se en kostplan på 7 dage med tre retter mad for en person, en ret fra et fremmed land uden for Europa og en alfabetisk liste med opskrifter til hele ugen. Der er også printvenlige sider. Artikler Profil fra målgruppen Køkkenudstyr for unge. Middag med kæresten Økologiske varer. Kost sport Råd om kost til Maratonløberen og basketballspilleren. Artikler På denne side kan man finde forskellig artikler, der beskriver en profil fra målgruppen (studerende), køkkenudstyr for unge, en middag med kæresten samt økologiske varer. Kost sport På denne side kan man både se en artikel om mad til sportsmanden/kvinden, der træner til en Maraton samt læse om basketballspillers råd om kost og madvaner. 11

13 Site map (fortsat) Kort beskrivelse af web sitet (fortsat) Fødselsdag Artikel og fødselsdagsmiddag for 7 personer. Alfabetisk liste over web sitets opskrifter Fødselsdag På denne side kan man se én artikel og et kostforslag til en fødselsdagsmiddag for 7 personer. Kontakt Mail-adresse til webmaster Mail-adresse til madudvalg Kontakt Via dette link kan man komme i kontakt med webmaster og madudvalget. Links Links Her er der mulighed for at lægge relevante links ud. 12

14 Navigationsdiagram Forside / index Kostplaner 7 dageskostplan Artikler Kost sport Fødselsdag Opskrifter Kontakt Links Varieret kost Om 7-dageskostplan Økologi Maraton Fødselsdagsfest på SU A-E F-J Mail til webmaster Links til andre web sites Mail til madudvalg Madpyramide Mandag Middag til kæresten Basketball Fødselsdagsmiddag K-O Søndag Tirsdag Køkkenudstyr P-T U-Å Lørdag Onsdag Fredag Torsdag Profil fra målgruppen 13

15 Søgemaskineoptimering Et web site, der forsøger at ramme en bestemt målgruppe, bør have gjort sig overvejelser om, hvordan det når ud til målgruppen. Vi har med vores Ung og sund-web site målrettet indholdet og designet efter vores målgruppe. Så er der en stor chance for, at målgruppen bliver hængende på web sitet, når de har fundet det. Men hvis de ikke kan finde vores web site, er selv det bedste indhold nyttesløst. Det er her, søgemaskineoptimeringen kommer ind i billedet, da interesserede så vil være i stand til at finde web sitet, når de søger på Internettets søgemaskiner. Den bedste optimering foregår ved at få andre web sites til at referere til éns eget. På den måde vil éns eget web site opnå en højere søgemaskine-ranking. Det kræver dog, at man har et godt netværk og gerne nogle, der har web sites af samme slags som en selv. Man kan også lave en søgeoptimering, der ikke stiller andre krav end en lille udvidelse af de forskellige HTML-koder. I kodens head-del indskrives to typer meta-tags: Keywords: Det er en fordel at vælge de keywords, folk vil søge på for at finde vores web site. Men det er vigtigt, at hver underside har sine egne søgeord, og at ordene indgår et eller andet sted på siden. Ung og sunds hovedside kunne have følgende keywords: kollegium, kollegiemad, sund mad, billig mad, opskrifter, madartikler. Description: Her skrives en præcis beskrivelse af web sitet, men på højst 160 tegn. Hvis hovedsiden indeholder en beskrivelse, som søgende er tænkt til at søge efter og dernæst klikke sig ind på hovedsiden, skal beskrivelsen også indeholde nogle af de søgeord. Ung og sunds hovedside kunne have følgende description: De studerendes mad-web site med sunde og billige retter. Udførlige opskrifter med fremgangsmåde. Ideelt for den travle studerende. Vi har bevidst undladt at lave denne søgeoptimering på det uploadede Ung og sund-web site, da det nemt kan give os problemer. Det vil helt sikkert se uheldigt ud, at et fiktivt web site får tonsvis af hits 14

16 Konklusion Målrettet website Samlet set prøver vi at præsentere vores web site med et flot og overskueligt design, nyttige informationer samt et godt (og sundt) indhold, hvilket vi efter vores bedste vurderingsevne føler, vi har løst godt. Vi har udviklet et web site, hvor der er blevet taget højde for modtageren, og hvor deres mening har vejet tungt på vægtskålen. Vi har konkluderet ud fra vores undersøgelse af målgruppen, at de medvirkende ønsker at finde den relevante information hurtigt og nemt. Derudover har vi fokuseret på, at indholdet skal have et vis pædagogisk aspekt. Vi har hovedsagelig vægtet nøgleordene hurtig, nem, overskuelighed, forståelig information. Disse ord er vigtige for at kunne holde på vores besøgende. Visuel opsætning Vi har opsat billederne på opskrifterne på venstre side og fremgangsmåden på højre side. Placeringen af menufelterne er der også i høj grad sat fokus på, så den mest relevante information og den antagne mest brugte fremkommer først. Det kom det bag på os, at der blandt de adspurgte kollegianere var 60 %, der foretrak down-menuen, men vi valgte at benytte denne menu som navigationsmenu på web sitet, da det var vores målgruppe vi havde spurgt. Jævnfør evt. bilag 1. Farvevalget er holdt meget konsistent igennem hele websitet. Vi har forsøgt at holde sitet på rene og pæne nuancer uden for meget støj. Den grønne farve går igen på hele web sitet og skaber derved en ro og samhørighed mellem siderne. Menuen går igen på alle sider og gør det nemt at forholde sig til strukturen. Siderne indeholder varierende billeder med sammenholdt tema. Billig og sund Vi har gået ud fra, at de studerende rundt regnet benytter 50 kr. om dagen på mad. Hvis vi tager et hurtigt kig på vores spørgeskema (spørgsmål 2), ser vi forundrende nok, at de fleste at de adspurgte brugte mellem 300 og 400 kr. om måneden. Det giver ca. 50 kr. om dagen, som jo egentlig var vores udgangspunkt for hvor meget, en studerende brugte på mad om dagen. Dette beløb har vi haft meget fokus på ved udvælgelse af retterne. Et vigtigt mål er, at vi får vist, at vi er bevidste om ernæringsrigtig mad, og at vores indhold afspejler det. På denne måde kan man søge den rigtige information og hermed ikke komme i tvivl om vores viden om mad. Vi har hermed igennem vores vejledning om rigtig kost og opskriftvalg mv. gjort det klart, at vi tager sund kost seriøst. Det ses også i kostpyramiden og sundhedsafsnittet, hvor man kan læse en del information om rigtig kost og hvad Sundhedsstyrelsens anbefaler. Ved at lave en kostplan for en uge har vi måttet genbruge mange af ingredienserne/madvarerne de følgende dage. Vi har fundet 15

17 Konklusion (fortsat) meget gode opskrifter, så man spiser varieret og får dækket langt størstedelen af det vitamin- og mineral-behov, en voksen person har brug for. Interesse nysgerrighed I vores forsøg på at skabe interesse og nysgerrighed på vores web site er vores farve- og billedevalg også en yderst fremtræden karakter på web sitet. Det er altså i høj grad ikke kun indholdet og opskrifterne, der er blevet fokuseret på, men i lige så høj grad vores samlet visuelle udtryk (via skrift-, farver- samt billedvalg). Vi har hentet inspiration til vores indhold fra allerede eksisterende mad-websites, men samtidig været opmærksom på at skulle tilpasse det vores web sites udtryk. 16

18 Evaluering af produkt og proces Evaluering af mål Gruppens læringsmål er, at vi vil lære alle de mål, som står beskrevet i opgaven. Dette inkluderer forståelse af gestaltlovene, segmentering og interessentanalyse, søgeoptimering af hjemmesiden, sådan at den er let at finde på fx Google. Udover disse grundlæggende mål har vi haft for øje at gøre hjemmesiden simpelt samt professionelt opbygget, sådan at den er indbydende for unge og studerende. Derudover var vores mål, at vores gruppe skulle fungere godt, og alle skulle have mulighed for at bidrage med deres syn på projektet. Evaluering af arbejdsprocessen Vi har alle været en del af den samlede løsning og alle i gruppen har bidraget hertil. Vores procesforløb og selve udformningen af web sitet er noget, vi alle kan være stolte af. Allerede fra start har vores arbejdsfordeling fungeret godt, og vi har hver især givet vores mening til kende og ud fra disse meninger opnået en samlet konklusion, som har dannet grundlaget og rammen for det færdige resultat. Opgaverne er som nævnt blevet delt jævnt imellem os og er blevet set af alle fra gruppen. Heraf har hver især haft deres præg på alle afskygninger af projektet og web sitet. Samlet set har vi brugt hinanden til at få det bedste resultat. Evaluering af projekt I starten af projektet begyndte vi at planlægge, hvordan selve hjemmesiden kom til at se ud. Alles meninger spillede en rolle. Derfor opdelte vi opgaverne kollaborativt. Vi fandt frem til at benytte prototyping i HOME-udviklingsmetoden - i en light udgave. Herefter begyndte vi at analysere mere konkret omkring, hvordan vi bedst når ud til vores målgruppe. Vi besluttede at finde løsningen gennem undersøgelser på kollegiet ved skolen, hvor vi spurgte studerende om farver, skriftyper og mad, samt hvad de vil forvente at finde på denne hjemmeside, vi kommer til at lave. Navnet på hjemmesiden blev fundet gennem 24 forskellige forslag som vi lavede en afstemning omkring, og den med flest stemmer blev Ung og sund. Ud fra resultaterne af undersøgelsen kunne vi begynde at danne os et mere nuanceret billede af vores design samt fremgangsmåde. Da rammerne hermed var fastsat, kunne vi begynde endnu mere struktureret og intens på tidsplanen designdelen og layoutet og ikke mindst indholdet. Alt i alt har vi nået det, vi har sat os som mål. 17

19 Spørgeskema Bilag 1, side 1 Resultat af spørgeskema til studerende Vi har tilrettelagt et spørgeskema, der tager udgangspunkt i unges madvaner og designsmag, så vi kan danne os et billede af vores målgruppe. Dette er resultatet. Graferne viser i procent de forskellige svar fra vores 15 adspurgte personer, der alle er unge samt i kollegiesegmentet. 1. Er du bevidst om, hvor mange penge du bruger på mad og drikke? Illustrationen (cirkeldiagrammet) viser, hvor mange af de adspurgte der er beviste om deres ugentlige pengeforbrug på mad. Svar: Nej: 3 Ja: Hvor mange penge bruger du på mad om ugen? Søjlediagrammet viser den procentmæssige fordeling med antal personer lodret og beløb i kr. vandret. Svar på beløb: Antal Personer: 1 Beløb: Under 200 Kr Antal Personer: 4 Beløb: Mellem Kr Kr Antal Personer: 5 Beløb: Mellem Kr: Antal Personer: 3 Beløb: Mellem Kr Antal Personer: 2 Beløb: Over 500 Kr

20 Spørgeskema Bilag 1, side 2 3. Har du nogen madvaner? Hvis ja, hvilke? Cirkeldiagrammet illustrerer de madvaner, der er gengangere blandt de adspurgte i spørgeskemaet. Samtidig viser diagrammet, at gengangerne er fordelt rimeligt jævnt blandt frugt og grønt, hjemmelavet mad samt pasta. Svar på madvarer: Pasta: 5 personer Lave maden selv: 4 personer Salat Økologi Frugt og grøntsager: 4 personer Spise sundt Junk food 5 6 måltider om dagen Ris Lidt kød 4. Hvilken slags mad kan du bedst lide (gerne retter)? Søjlediagrammet nedenfor viser de retter (eller andet), der optræder mere end en gang. Diagrammet illustrerer f.eks., at der var 40 procent af de adspurgte, som spiste pasta mindst en gang om ugen. Her er hvad der ellers blev udpeget som ynglingsretter. Stegt mad Frugt Desserter Kanelsnegle Pasta og pastaretter: 6 personer Sund mad: 3 personer Kylling Grøntsager Grøntsagstærter Lasagne: 2 personer Risretter: 2 personer Pizza: 2 personer Kødretter Italiensk Chokolade Crepe (fransk mad) Pesto Tun Kinesisk

21 Spørgeskema Bilag 1, side 3 5. Spiser du varieret? Cirkeldiagrammer viser procentfordelingen blandt de 15 adspurgte. Svar på varieret kost: Ja: 11 Ikke nok, men prøver: 2 Nej: 2 (N.B. Vores henblik var her at undersøge, om varieret kost er noget, vi skulle veje tungt i henhold til vores madudvalg på web sitet.) 6. Går du op i økologi, og er det noget, du vil bruge penge på? Svar på økologi: Ja: 33% Nej: 26,% forsøger: 40% (N.B. Her ville vi undersøge, om økologisk kost er noget, vi skulle inddrage i web sitets madudvalg.) 7. Hvis du fandt en madhjemmeside til studerende, hvad ville du så gerne kunne finde på den? Svar på ideer til madside: (N. B skemaet er ikke angivet i procent men i personer og hvad disse ligger vægt på i et web site om mad). Gode opskrifter x 7 Opskrifter til sund mad som er nemt og billigt x 5 Ernæringsrigtig mad x 2 Sjov Opskrifter med pasta, ris, hvidløg, chili, grøntsager Specielle måltider Uge menu Info og råd om kost x2 KJ, protein, kulhydrat, fedt Mødesteder De studerende ligger hermed hovedsaglig vægt på, at siden skal indeholde gode opskrifter, samt at det skal være sundt, billigt og nemt.

22 Spørgeskema Bilag 1, side 4 Valg af farvekombination: Hvilken farvekombination vil du foretrække på en hjemmeside der omhandler mad til studerende? Svar på farvekombination. Antal stemmer: 4 (i procent 28.5 %) Antal stemmer: 1 (i procent 7,1 %) Antal stemmer: 5 (i procent 35,7 %) Antal stemmer: 1 (i procent 7,1 %) Antal stemmer: 3 (i procent 21,4 %) NB! Den sorte baggrundsfarve har kun den funktion at tydeliggøre farverness fremtræden og er ikke en del af farvevalget på websitet.

23 Spørgeskema Bilag 1, side 5 Valg af skrifttype Hvilken skrifttype vil du foretrække på en hjemmeside, der omhandler mad til studerende? Svar på skrifttype: Antal stemmer: 5 (35,7 %) Antal stemmer: 0 (0,0%) Antal stemmer: 3 (21,4 %) Antal stemmer: 1 (7,1 %) Antal stemmer: 0 (0,0%) Antal stemmer: 3 (21,4 %) Antal stemmer: 0 (0,0%) Antal stemmer: 2 (14,2%) Antal stemmer: 0 (0,0%) Antal stemmer: 0 (0,0%)

24 Spørgeskema Bilag 1, side 6 Valg af menutype Hvilken menustruktur vil du fortrække at navigere rundt i? Diagrammet viser, hvad der blev svaret i procent. Svar på menu: Menu 1 (Folde ud menu): 2 Menu 2 (Drop down menu): 9 Menu 3 (Menu med faneblade): 4 Nedenfor er de menutyper, de adspurgte blev stillet over for. Menu 1 (Folde ud menu): 2 Menu 2 (Drop down menu): 9 Menu 3 (Menu med faneblade): 4

25 Relevante screen dumps fra Bilag 2

26 Kode fra index.html Bilag 2 UNG <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN dtd > <html xmlns= > <head> <meta http-equiv= Content-Type content= text/html; charset=utf-8 /> <title>ung og sund</title> <link href= style.css rel= stylesheet type= text/css /> <script type= text/javascript src= ajax/libs/jquery/1.2.6/jquery.min.js ></script> <script type= text/javascript src= jqueryslidemenu.js ></script> </head> <body class= onecolfixctrhdr > <div id= container ><!-- start#container --> <div id= header ><!-- start#header --> <img src= images/logo.png border= 0 align= left /> <!-- end #header --></div> <div id= maincontent ><!-- start #maincontent --> <!-- startmenulinie --> <div id= myslidemenu class= jqueryslidemenu > <ul> <li><a href= index.html >Forside</a></li> <li><a href= varieret.html >Kostplaner</a> <ul> <li><a href= varieret.html >Varieret kost</a></li> <li><a href= trekant.html >Kost trekant</a></li> </ul> </li> <li><a href= plan.html >7-dages kostplan</a> <ul> <li><a href= plan.html >7-dages kostplan</a></li> <li><a href= 1dag.html >Mandag</a></li> <li><a href= 2dag.html >Tirsdag</a></li> <li><a href= 3dag.html >Onsdag</a></li> <li><a href= 4dag.html >Torsdag</a></li> <li><a href= 5dag.html >Fredag</a></li> <li><a href= 6dag.html >Lørdag</a></li> <li><a href= 7dag.html >Søndag</a></li> </ul> </li> <li><a href= oko.html >Artikler</a> <ul> <li><a href= oko.html >Økologi</a></li> <li><a href= kareste.html >Mad til kæresten</a></li> <li><a href= udstyr.html >Køkkenudstyr</a></li> <li><a href= profil.html >En studerende i køkkenet</a></li> </ul> </li> <li><a href= marathon.html >Kost og sport</a> <ul> <li><a href= marathon.html >Marathon</a></li> <li><a href= basket.html >Basketballspilleren</a></li> </ul> </li> <li><a href= bday.html >Fødselsdag</a> <ul>

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

Martin Møller Web1b Tirsdag den 19 juni 2012

Martin Møller Web1b Tirsdag den 19 juni 2012 Martin Møller Web1b Tirsdag den 19 juni 2012 Projektbeskrivelse 3 Tema valg 3 Budskab 3 Afsender 4 Målgruppe 4 Kommunikations mål 4 Skitser 6 Layout index 7 Layout Kulturliv 8 Layout Gratis glæder 9 Layout

Læs mere

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

Projekt-studieweb. Om kommunikationsteorierne. Morten, Jacob, Kristian og Cihat Projekt-studieweb Om kommunikationsteorierne Morten, Jacob, Kristian og Cihat Gestaltlovene Loven om nærhed Loven om lukkethed Loven om lighed Loven om forbundethed Loven om fortsættelse Loven om figur

Læs mere

5. Billeder og logo til websitet er optimeret til web via Photoshop, så de fylder mindst muligt for at mindske indlæsningstiden for websitet.

5. Billeder og logo til websitet er optimeret til web via Photoshop, så de fylder mindst muligt for at mindske indlæsningstiden for websitet. GRAFISK WORKFLOW Grafisk workflow Beskrivelse Opgaven Design af website til Tipsbladet Fokus, som er noget, jeg selv har fundet på. Det er tænkt som et alternativ til Tipsbladet.dk, hvor der på Tipsbladet

Læs mere

web via Photoshop, så de fylder mindst muligt for at mindske indlæsningstiden for websitet.

web via Photoshop, så de fylder mindst muligt for at mindske indlæsningstiden for websitet. GRAFISK WORKFLOW Grafisk workflow Beskrivelse Opgaven Redesign af website for bilforhandleren PerB. Opgave har jeg stillet mig selv med det formål at lave en simpel men indbydende udgave af PerB s website.

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

Efterlyst! Introduktion HTML & CSS. I dette projekt skal du lære, hvordan du laver din egen plakat. Arbejdsliste. Test dit Projekt.

Efterlyst! Introduktion HTML & CSS. I dette projekt skal du lære, hvordan du laver din egen plakat. Arbejdsliste. Test dit Projekt. HTML & CSS 1 Efterlyst! All Code Clubs must be registered. Registered clubs appear on the map at codeclubworld.org - if your club is not on the map then visit jumpto.cc/ccwreg to register your club. Introduktion

Læs mere

GRAFISK WORKFLOW GRAFISK WORKFLOW DIGITAL KOMMUNIKATION OLEMOGELBY.COM

GRAFISK WORKFLOW GRAFISK WORKFLOW DIGITAL KOMMUNIKATION OLEMOGELBY.COM GRAFISK WORKFLOW DIGITAL KOMMUNIKATION OLEMOGELBY.COM OPGAVEN Redesign af Ole Møgelbys hjemmeside, der efter stor succes med sine værker, gerne vil have frisket udtrykket lidt op. Billedsiderne skal udvides

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

Grafik & Billede weloveorganic.com webshop

Grafik & Billede weloveorganic.com webshop Grafik & Billede weloveorganic.com webshop Opgaven og afsender: Weloveorganic.com er en forholdsvis ny virksomhed, der pånuværende tidspunkt udelukkende sælger økologisk tøj til kvinder. På længere sigt

Læs mere

REDESIGN AF GRAFISK FORUMS HJEMMESIDE. Grafisk Workflow

REDESIGN AF GRAFISK FORUMS HJEMMESIDE. Grafisk Workflow Grafisk Workflow REDESIGN AF GRAFISK FORUMS HJEMMESIDE Før Efter REDEGØRELSE OPGAVEN Da jeg ikke har noget med web at gøre på min elevplads, opfandt jeg en fiktiv opgave - nemlig at redesigne Grafisk Forums

Læs mere

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

Grafisk Redegørelse Opgaven Programvalg Kvalitetsvurdering Målgruppe Arbejdsproces Kvalitet Komposition og layout Brugervenlighed Redegørelse Grafisk Opgaven At redesigne en hjemmeside for AGF fanclub, som har et mere moderne look og et nyhedsarkiv som er let oversskueligt. Hjemmesiden er en opgave jeg selv har stillet mig og kunne

Læs mere

GRAFISK DESIGN. Min personlige e-portfolio

GRAFISK DESIGN. Min personlige e-portfolio GRAFISK DESIGN Min personlige e-portfolio 2 OPGAVEBESKRIVELSE Produkt: E-portfolio Farve: RGB Programmer: Brackets, Photoshop og Illustrator Min personlige e-portfolio er udarbejdet som et led i min uddannelse

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

GRAFISK WORKFLOW GRAFISK WORKFLOW Opgaven At lave en ny hjemmeside til tekniske skolers sportslege. Den gamle var rodet og uoveskuelig. Det vigtigste var at rydde op, samt holde en rød tråd til logo og indbydelsen. Afsender Lærerne på

Læs mere

workflow Programmer: Om opgaven: Kvalitetsvurdering: Afsender: Modtager: Cathrine Laulund Web: Dreamweaver Billedbehandling: Photoshop

workflow Programmer: Om opgaven: Kvalitetsvurdering: Afsender: Modtager: Cathrine Laulund Web: Dreamweaver Billedbehandling: Photoshop Om opgaven: For et halvt år siden overtog nogle bekendte værtshuset Midtskiws i Skive. De havde derfor brug for en ny hjemmeside, som kunne fungere som et online informationssted og visitkort for deres

Læs mere

grafisk workflow Madmagasinet

grafisk workflow Madmagasinet grafisk workflow Madmagasinet Dokumentation Opgaven Madmagasinet skal have et website som er responsive, således deres brugere har en side som er optimeret til de forskellige platformer, hvorpå deres site

Læs mere

OPGAVE: WELOVEORGANIC.COM WEBSHOP

OPGAVE: WELOVEORGANIC.COM WEBSHOP OPGAVE: WELOVEORGANIC.COM WEBSHOP OPGAVEN OG AFSENDER: Weloveorganic.com er en forholdsvis ny virksomhed, der pånuværende tidspunkt udelukkende sælger økologisk tøj til kvinder. På længere sigt ønsker

Læs mere

PROJEKTOPGAVE -Et brugervenligt website af: Michéla, Mathilde, Christian & Andreas

PROJEKTOPGAVE -Et brugervenligt website af: Michéla, Mathilde, Christian & Andreas PROJEKTOPGAVE -Et brugervenligt website af: Michéla, Mathilde, Christian & Andreas INDHOLD GRUPPEMEDLEMMER...3 DESIGNBRIEF...4 KOMMUNIKATIONSANALYSE...4-5 KOMMUNIKATIONSMODEL...5 ARGUMENTATION FOR DESIGNPRINCIPPER...6

Læs mere

Grafisk workflow. website til duckhead music

Grafisk workflow. website til duckhead music Grafisk workflow website til duckhead music Portfolio h1 Side 18 website til duckhead music Selvom jeg er hos et webbureau, så sidder jeg udelukkende med design, og er derfor ikke kommet til at kode endnu.

Læs mere

KT OR LOW PRODUKTION // WORKFLOW

KT OR LOW PRODUKTION // WORKFLOW PR D O U ION KT // W KFKF OR LOW PRODUKTION // WORKFLOW // WORKFLOW HJEMMESIDE / REDEGØRELSE / IDÉ, FARVE, FONT OG GRAFIK / SKITSER OG FLOWCHART / SKELET / STORYBOARD / CSS HVAD? Opgaven er en fiktiv hjemmeside

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

GRAFISK WORKFLOW Hjemmesidedesign

GRAFISK WORKFLOW Hjemmesidedesign GRAFISK WORKFLOW www.mediegrafiker-ats.dk/12gf32med8b/stil/caroline Færdige produkt www.mediegrafiker-ats.dk/12gf32med8b/stil/caroline Færdige produkt www.mediegrafiker-ats.dk/12gf32med8b/stil/caroline

Læs mere

Byg et website med Dreamweaver

Byg et website med Dreamweaver Byg et website med Dreamweaver I denne øvelse skal vi opbygge et website for Hotel Holiday i Dreamweaver. Det færdige site kan ses her: http://www.itu.dk/people/khhp/hotel_holidays/velkommen.html Øvelsen

Læs mere

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

Nu skal vi især se på <font> og <center> samt centrering af hele siden på skærmen. Validering 4 Nu skal vi især se på og samt centrering af hele siden på skærmen. Det er i HTML ikke forbudt at bruge koden , men lad nu være alligevel, du får blot en masse valideringsproblemer.

Læs mere

CSS fortsat: Boksmodel, floating & positionering

CSS fortsat: Boksmodel, floating & positionering Webdesign og webkommunikation, formiddagshold (hold 1), IT Universitetet, forår 2012. Øvelse 4, individuel øvelse CSS fortsat: Boksmodel, floating & positionering 1. Lidt om hvad du har lært Du har i øvelse

Læs mere

Grafisk Workflow. hovedforløb 2

Grafisk Workflow. hovedforløb 2 Grafisk Workflow hovedforløb 2 WORLD OF FURNITURE Forside.wrapper width: 95%; margin: 0 auto; box-shadow: 0px 0px 25px #888888; Image slider carousel 5 sekunder .button span.button span:after.button:hover

Læs mere

FORSTÅELSE FOR GRAFISK PRODUKTION OG WORKFLOW

FORSTÅELSE FOR GRAFISK PRODUKTION OG WORKFLOW Opgaven I AArhus er en fiktiv hjemmeside. Formålet med hjemmesiden, er at Folk som befinder sig i Aarhus kan henvende sig til I AArhus og berette deres synspunkt på Aarhus. Siden henvender sig til unge,

Læs mere

GRAFISK WORKFLOW Hjemmeside - Husk hjelmen. http://mediegrafiker-ats.dk/12gf32med8b/projekt/mette/

GRAFISK WORKFLOW Hjemmeside - Husk hjelmen. http://mediegrafiker-ats.dk/12gf32med8b/projekt/mette/ GRAFISK WORKFLOW Hjemmeside - Husk hjelmen http://mediegrafiker-ats.dk/12gf32med8b/projekt/mette/ Produkt Web sider Index side Underside - Cykelhjelmen - brug den rigtig. Underside - Husk nu cykelhjelmen.

Læs mere

Grafisk. Workflow. Side 1

Grafisk. Workflow. Side 1 Grafisk Workflow Side 1 http://mediegrafiker-ats.dk/15gt33med/freja/hotelinger/ Side 2 Kunde: Inger Marie, Hotel Inger Målgruppe: Aldersgruppe mellem 30-50 år. Hvad har jeg bidraget med? Mit bidrag til

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

Nolde Museet. I gang med Dreamweaver. Opgave. Opgavebeskrivelse. Layout. Mål og CSS

Nolde Museet. I gang med Dreamweaver. Opgave. Opgavebeskrivelse. Layout. Mål og CSS Opgavebeskrivelse Lav en webside om i Sønderjylland. Opgaven fører dig igennem de basale ting, hvad angår opbygningen af en side med CSS. Der er ikke tale om et komplet site, men du kan bruge opgaven som

Læs mere

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

Grafisk Workflow STILHISTORIE. Website lavet i forbindelse med et projekt om stilhistorie. Klik her for at se websitet: STILHISTORIE Website lavet i forbindelse med et projekt om stilhistorie. Klik her for at se websitet: http://www.mediegrafiker-ats.dk/12gf32med8b/stil/maria/ Opgaven I forbindelse med et tema omhandlende

Læs mere

Forståelse for grafisk produktion og workflow

Forståelse for grafisk produktion og workflow Forståelse for grafisk produktion og workflow Fallulah hjemmeside Opgaven: Blev stillet i forbindelse med forløbet avanceret webdesign, jeg har hverken fået karakter eller bedømmelse på den. Opgaven bestod

Læs mere

Roskildes tekniske gymnasium. Kulløse Mijlømesse. Afsluttende kom/it projekt

Roskildes tekniske gymnasium. Kulløse Mijlømesse. Afsluttende kom/it projekt Roskildes tekniske gymnasium Kulløse Mijlømesse Afsluttende kom/it projekt Casper Hansen og Christian Hansen 26-04-2009 Indhold Indledning... 3 Planlægning... 3 Overvejelser... 3 Hvordan man kommer til

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

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

GRAFISK WORKFLOW. Layout Layout af hjemmesiden laves i Photoshop og siderne inddeles i mapper for bedre overblik. GRAFISK WORKFLOW Opgaven Design og skabelse af website til maler og skrotkunstner Ole Møgelby. Websitet skal virke som en oversigt af Oles værker og som en informationsside. Programvalg Af programmer har

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

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

Grafisk produktion og workflow

Grafisk produktion og workflow Grafisk produktion og workflow Helle Nicolaysen svendeprøve juni 2016 Kunde (fiktiv) Bomholt er en virksomhed der laver og sælger plankeborde og som nu ønsker en helhedsorienteret grafisk designlinje,

Læs mere

Denne artikel er til dem der ønsker at vide mere om hvad CSS er og hvad CSS kan bruges til hvad angår WWW.

Denne artikel er til dem der ønsker at vide mere om hvad CSS er og hvad CSS kan bruges til hvad angår WWW. Denne guide er oprindeligt udgivet på Eksperten.dk CSS - en gennemgang Denne artikel er til dem der ønsker at vide mere om hvad CSS er og hvad CSS kan bruges til hvad angår WWW. Der er lidt CSS historie

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

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 workflow. Se siden her: www.cormas.dk

Grafisk workflow. Se siden her: www.cormas.dk Grafisk workflow Se siden her: www.cormas.dk Dokumentation 4 Procesbeskrivelse 5 Inspirationssøgning 6 Skitser 8 Layout i Photoshop 9 Farver 10 Font 11 Flowchart 12 Wireframe 13 Storyboard 14 kontakt.html

Læs mere

Nyhedsbrev april: spørgeskemaundersøgelse

Nyhedsbrev april: spørgeskemaundersøgelse #ChronoContact_Survey { margin-bottom: 10px; margin-left: 0px;.form_element { float: left; font-family: Arial,Helvetica,sans-serif; font-size: 12px; margin-bottom: 8px; margin-left: 0; margin-top: 8px;

Læs mere

Tillykke Med Fødselsdagen

Tillykke Med Fødselsdagen HTML & CSS 1 Tillykke Med Fødselsdagen All Code Clubs must be registered. Registered clubs appear on the map at codeclubworld.org - if your club is not on the map then visit jumpto.cc/ccwreg to register

Læs mere

Oversigt HTML5 nye tags til sideopbygning

Oversigt HTML5 nye tags til sideopbygning HTML5 er udviklet af WHATWG Oversigt HTML5 nye tags til sideopbygning (Web Hypertext Application Technology Working Group) En

Læs mere

GRAFISK WORKFLOW HJEMMESIDE EL FIRMA ANDERSEN EL

GRAFISK WORKFLOW HJEMMESIDE EL FIRMA ANDERSEN EL GRAFISK WORKFLOW HJEMMESIDE EL FIRMA ANDERSEN EL OPGAVEBESKRIVELSE Min kunde er en ung mand som ønskede at få lavet en hjemmeside til hans fremtidig firma, den skulle være responsiv og simpel. Da kunden

Læs mere

Projekt i Programmering C Menu til hjemmeside.

Projekt i Programmering C Menu til hjemmeside. Projekt i Programmering C Menu til hjemmeside. 10-12-2004 Holstebro HTX Bent Arnoldsen Synopsis. Projektet her er en menu til hjemmesider, som er lavet så den er let at tilrette, når man tilføjer eller

Læs mere

Superskolernes kampagne

Superskolernes kampagne Superskolernes kampagne Projekt i Kommunikation/IT Roskilde Tekniske Skole Side 1 af 12 Indhold Indledning... 3 Målgruppeanalyse - Kanylemodel... 4 Begrundelse for valg af medie... 5 Grovskitsering...

Læs mere

GRAFISK WORKFLOW OPGAVEBESKRIVELSE KVALITETSVURDERING HJÆLPEMIDLER BROWSER BRUGERVENLIGHED/USABILLITY

GRAFISK WORKFLOW OPGAVEBESKRIVELSE KVALITETSVURDERING HJÆLPEMIDLER BROWSER BRUGERVENLIGHED/USABILLITY GRAFISK WORKFLOW OPGAVEBESKRIVELSE Min kunde er en ung mand som ønskede at få lavet en hjemmeside til hans fremtidig firma, den skulle være responsiv og simpel. Da kunden ikke havde noget ønske om selv

Læs mere

Opgaven. Brugervenlighed. Designparametre. Følgende krav var : Research. Målgruppe. Konklusion. sitet ikke bliver for mørkt.

Opgaven. Brugervenlighed. Designparametre. Følgende krav var : Research. Målgruppe. Konklusion. sitet ikke bliver for mørkt. Opgaven Opgaven var fiktiv og bestod i at redesigne og kode hjemmesiden Copenhagen Street Food samt at redesigne logo. Kunden ville gerne have et bedre flow på hjemmesiden og tiltrække flere besøgende

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

1. Bilag: Brugertest for gammel site

1. Bilag: Brugertest for gammel site Bilag 1 1. Bilag: Brugertest for gammel site Brugertest af Isabellais.dk Scenarie 1 Gå ind på www.vinoble.dk Du har på forsiden nogle vine som er fremhævet, de er placeret i nogle bokse, som du har mulighed

Læs mere

Mark André Lyhne. Eksamen 2012. 12web1b

Mark André Lyhne. Eksamen 2012. 12web1b Mark André Lyhne Eksamen 2012 12web1b Indholdsfortegnelse Indholdsfortegnelse... 1 Projekt beskrivelse... 3 Målgruppe... 3 Afsender... 3 Budskab... 3 Kommunikationsmål... 3 Ideudvikling... 3 De 6 Designparametre...

Læs mere

GRAFISK PRODUKTIONSFORSTÅELSE

GRAFISK PRODUKTIONSFORSTÅELSE GRAFISK PRODUKTIONSFORSTÅELSE Opgavebeskrivelse Julie Abels Dansestudie vil gerne have en ny hjemmeside, der skal promovere studiet. De har en opsat hjemmeside fra 123hjemmeside, som de gerne vil have

Læs mere

Målgruppe Mænd og kvinder i alderen 30 til 60 år, som er interesret i selvudvikling og ønsker et sundt arbejds- og privat liv.

Målgruppe Mænd og kvinder i alderen 30 til 60 år, som er interesret i selvudvikling og ønsker et sundt arbejds- og privat liv. Grafisk Design Kunden Mindfullife er en forskningsinvolveret undervisnings- og uddannelsesvirksomhed indenfor mindfulness-baseret intervention. De tilbyder kurser, retreats og uddannelse centreret omkring

Læs mere

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

OPGAVEN PROGRAMVALG. Jeg har brugt Illustrator til at lave logo og ikoner. GRAFISK DESIGN OPGAVEN Min kæreste er medstifter af en vinloge. Medlemmerne af logen kunne godt tænke sig et sted, hvor de bl.a. kunne få et overblik over, hvilke vine de har bedømt og hvornår næste loge

Læs mere

! }! FORSIDE! <html>! <head>!

! }! FORSIDE! <html>! <head>! FORSIDE opgaver body { background-color:#33adff; } header { background:#33adff; color:white; text-align:center; padding:5px;

Læs mere

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

OPGAVE BESKRIVELSE ARBEJDSPROCES. Idéudvikling. Inspiration. Skelet. Uploade til server. Kodning. Teste sitet igennem. Rettelser og godkendelse GRAFISK WORKFLOW ARBEJDSPROCES OPGAVE BESKRIVELSE OPGAVEN At lave et redesign af AGF Fanclubs hjemmeside med et mere nutidigt look og bedre oversskuelig brugerflade. Opgaven har jeg stillet mig selv, men

Læs mere

Grafisk workflow. Maria Clausen Svendeportfolio Grafisk workflow

Grafisk workflow. Maria Clausen Svendeportfolio Grafisk workflow Grafisk workflow Maria Clausen Svendeportfolio Grafisk workflow OPGAVEN Kunden har stiftet et nyt firma som hedder Wood id, som sælger lamper, møbler og tilbehør lavet i kvalitets træ. Kunden ville gerne

Læs mere

GRAFISK WORKFLOW PORTFOLIO NIKLAS POULSEN H1

GRAFISK WORKFLOW PORTFOLIO NIKLAS POULSEN H1 GRAFISK WORKFLOW PORTFOLIO NIKLAS POULSEN H1 GRAFISK WORKFLOW DOKUMENTATION OPGAVEN Denne opgave er lavet som en fiktiv opgave. Opgaven er lavet for et fiktivt firma, som tilbyder personlig fitness træning.

Læs mere

Grafik Workflow...2 Opgave Kunden Min opgave Nuværende Design...4 Overvejelser Brainstorm...6 Målgruppe Signalværdi Sitemap Nuværende sitemap...

Grafik Workflow...2 Opgave Kunden Min opgave Nuværende Design...4 Overvejelser Brainstorm...6 Målgruppe Signalværdi Sitemap Nuværende sitemap... Grafik Workflow....2 Opgave Kunden Min opgave Nuværende Design...4 Overvejelser Brainstorm...6 Målgruppe Signalværdi Sitemap Nuværende sitemap...7 Kommende sitemap...7 Mockup...8 Opsætning... 10 Programmer

Læs mere

Her vil jeg forsøge at gennemgå hvordan vi kan opnå at centrere en»div-container«både vertikalt og horisontalt i browser vinduet.

Her vil jeg forsøge at gennemgå hvordan vi kan opnå at centrere en»div-container«både vertikalt og horisontalt i browser vinduet. Side 1 Her vil jeg forsøge at gennemgå hvordan vi kan opnå at centrere en»div-container«både vertikalt og horisontalt i browser vinduet. Dette er nogle gange et ønske fra den enkelte kunde, som blot ønsker

Læs mere

Grafisk produktion og workflow

Grafisk produktion og workflow Grafisk produktion og workflow Helle Nicolaysen, mediegrafiker, 3. hovedforløb Introduktion Bylderup-Bov Rideklub har en hjemmeside, bestående af en template, hvor designet er fastlagt. Jeg er i kontakt

Læs mere

Opgaven. Væsentlighed. Problemstillinger. Browserkompabilitet. Layout. Kvalitetsvurdering. Format. Processer. Komposition og modulopbygning

Opgaven. Væsentlighed. Problemstillinger. Browserkompabilitet. Layout. Kvalitetsvurdering. Format. Processer. Komposition og modulopbygning Opgaven Opgaven var fiktiv, og gik ud på at lave en side med titlen Husk Hjelmen - hvilket skulle være en underside, til rådet for sikker trafik. I sidens layout skulle vi vise at der var plads til at

Læs mere

Grafisk. Hjemmesiden er designet til en nyopstartet virksomhed kaldet Tegnestuen M. De har både en arkitektafdeling og en tømrer-/ snedkerafdeling.

Grafisk. Hjemmesiden er designet til en nyopstartet virksomhed kaldet Tegnestuen M. De har både en arkitektafdeling og en tømrer-/ snedkerafdeling. Grafisk w o rk f l ow jemmesiden er designet til en nyopstartet virksomhed kaldet Tegnestuen M. De har både en arkitektafdeling og en tømrer-/ snedkerafdeling. Deres vision er at skabe enkle og inspirerende

Læs mere

Form og dens underlige box model

Form og dens underlige box model Denne guide er oprindeligt udgivet på Eksperten.dk Form og dens underlige box model Denne artikel handler om hvilke problemer man som webudvikler kan komme ud for, og hvordan man løser dem. Jeg kommer

Læs mere

OPGAVEN Konditoren skulle have lavet et site til deres opskrifter. Konditoren.dk er en blog for bageglade amatørere i alle aldre.

OPGAVEN Konditoren skulle have lavet et site til deres opskrifter. Konditoren.dk er en blog for bageglade amatørere i alle aldre. WORKFLOW OPGAVEN Konditoren skulle have lavet et site til deres opskrifter. Konditoren.dk er en blog for bageglade amatørere i alle aldre. Det er en fiktiv opgave. MIT BIDRAG Jeg stod for al design og

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

Grafisk produktion & workflow

Grafisk produktion & workflow Grafisk produktion & workflow WORKFLOW & PRODUKTION WEBSITE NATURSPEJDERNE Dokumentation I 2 OPGAVEN Opgaven Jeg har lavet dette fiktive website der kunne være en mulighed for en nyopstartet spejderforening.

Læs mere

GRAFISK WORKFLOW WEBSHOP TIL KLITMØLLER COLLECTIVE

GRAFISK WORKFLOW WEBSHOP TIL KLITMØLLER COLLECTIVE GRAFISK WORKFLOW WEBSHOP TIL KLITMØLLER COLLECTIVE WEBSHOP TIL KLITMØLLER COLLECTIVE Klitmøller Collective er et nyt lifestyle brand, som udspringer fra fiskerlejet Klitmøller i det nordvestlige Jylland.

Læs mere

Laura Svendsen Kernekompetencer GRAFISK WORKFLOW

Laura Svendsen Kernekompetencer GRAFISK WORKFLOW Laura Svendsen Kernekompetencer GRAFISK WORKFLOW website til drømmemadpakken Hvad? Opgaven er anden del af en opgave i to dele, et trykt produkt og et digitalt produkt. Vi fik udleveret tekst og billeder

Læs mere

Grafisk workflow 3. Hovedforløb

Grafisk workflow 3. Hovedforløb Grafisk workflow 3. Hovedforløb 3. Hovedforløb Grafisk workflow Dreamweaver Opgavebeskrivelse Højbakkegaard har brug for en hjemmeside, som kan vise hvad gården har at byde på, deres unikke vine og faciliteter

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

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

Naja Schlüter Roskilde Tekniske Gymnasium 26/ Interessentanalyse

Naja Schlüter Roskilde Tekniske Gymnasium 26/ Interessentanalyse Interessentanalyse Jeg fik til opgave at skulle lave en ny studieweb som er min egen personlige side. Min studieweb skal bruges til lidt information og så vil jeg løbende igennem de to år jeg har igen

Læs mere

ActiveBuilder Brugermanual

ActiveBuilder Brugermanual ActiveBuilder Brugermanual Forfatter: TalkActive I/S Dato: Juni 2004 Version: R. 1.01 Sprog: Dansk Copyright 2004 - Talk Active - all rights reserved. Indhold: 1. INDLEDNING...2 2. QUICK-START...3 3. OPBYGNINGEN

Læs mere

GRAFISK WORKFLOW - RESPONSIV WEBSIDE

GRAFISK WORKFLOW - RESPONSIV WEBSIDE GRAFISK WORKFLOW - RESPONSIV WEBSIDE REDEGØRELSE Opgavebeskrivelse Redesign hjemmeside for Murerfirmaet Døssing i responsivt design, som udstråler professionalisme. Der skulle være en referenceside med

Læs mere

Marc Creutzberg aarhusportalen AARHUSTECH 19/06 2012

Marc Creutzberg aarhusportalen AARHUSTECH 19/06 2012 Marc Creutzberg aarhusportalen AARHUSTECH 19/06 2012 1 Marc Creutzberg aarhusportalen AARHUSTECH 19/06 2012 Indhold Projekt Beskrivelse... 3 Temaer... 3 Afsender... 4 Budskab & Kommunikations formål...

Læs mere

3. PROJEKT, 2 SEMESTER

3. PROJEKT, 2 SEMESTER 3. PROJEKT, 2 SEMESTER Bruger undersøgelse, af sociale medie. KENDSKAB TIL OG BRUG AF ONLINE SOCIALE MEDIER FORENINGEN AF DANSKE INTERAKTIVE MEDIER, FÅET TIL OPGAVE AT AFDÆKKE DANSKERNES BRUG AF SOCIALE

Læs mere

Bootstrap Tutorial LAV EN SIMPEL RESPONSIVE SIDE MED BOOTSTRAP MATHIAS HERSKIND GROTRIAN

Bootstrap Tutorial LAV EN SIMPEL RESPONSIVE SIDE MED BOOTSTRAP MATHIAS HERSKIND GROTRIAN 2015 Bootstrap Tutorial LAV EN SIMPEL RESPONSIVE SIDE MED BOOTSTRAP MATHIAS HERSKIND GROTRIAN I denne tutorial kommer du til at I denne tutorial vil du lære hvad Bootstrap er, hvordan det fungerer og hvordan

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

GRAFISK WORKFLOW PHILIP CREAMER AARHUS TECH SVENDEPRØVE NOVEMBER 2016

GRAFISK WORKFLOW PHILIP CREAMER AARHUS TECH SVENDEPRØVE NOVEMBER 2016 GRAFISK WORKFLOW PHILIP CREAMER AARHUS TECH SVENDEPRØVE NOVEMBER 2016 grafisk WORKFLOW // DOKUMENTATION opgaven // Jeg har i min opgave lavet et responsive onepage website for et årlig event kaldet Dirt

Læs mere

GRAFISK PRODUKTIONSFORSTÅELSE

GRAFISK PRODUKTIONSFORSTÅELSE GRAFISK PRODUKTIONSFORSTÅELSE BRILLIANT BIKINIES WEBSITE MARÍ DYRMOSE OPGAVEN OPGAVEBESKRIVELSE Brilliant Bikini kompagniet skulle have designet og programmeret en website, hvor de kunne præsentere deres

Læs mere

GRAFISK DESIGN. webdesign af pl.dk

GRAFISK DESIGN. webdesign af pl.dk Webdesign af pl.dk Opgavebeskrivelse Bold.dk og 6 eren har slået sig sammen for at skabe Danmarks største Premier League fodboldportal, PL.dk. Hjemmesiden skal indeholde mange informationer, og samtidig

Læs mere

Eksamen. Jonas Langhoff Nielsen Web01b

Eksamen. Jonas Langhoff Nielsen Web01b Eksamen Jonas Langhoff Nielsen Web01b 1 Indhold Tidsplan 3 Projektbeskrivelse og Målgruppe 4 De 6 Designparametre. 5 Skitser.. 6 Flowchart 7 Fremstilling af Logo 8 Farvevalg 9 Valg af fonte 10 Skelet.

Læs mere

1. Hovedforløb. Mediegrafiker - 2015

1. Hovedforløb. Mediegrafiker - 2015 Af Ditte Vium Overgaard Grafik og billedbehandling 1. Hovedforløb Mediegrafiker - 2015 OPGAVEBESKRIVELSE Der er til alle de fire kernefagligheder taget udgangspunkt, i mit eget lille projekt, med design

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

Grafisk Design. Svendeprøve Portfolio Anja Jelstrup Jensen, Kailow

Grafisk Design. Svendeprøve Portfolio Anja Jelstrup Jensen, Kailow Grafisk Design Svendeprøve Portfolio Anja Jelstrup Jensen, Kailow Gammelt layout Nyt layout 6 Grafisk Design Kunden Mindfullife er en forskningsinvolveret uddannelsesvirksomhed indenfor mindfulness-baseret

Læs mere

Om styles / typografier / typografiark / stylesheets

Om styles / typografier / typografiark / stylesheets Om styles / typografier / typografiark / stylesheets (dvs. Cascading StyleSheet ~ CSS) CSS er et sprog til at definere layout på HTML-dokumenter. CSS indeholder flere muligheder for layout end HTML og

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

Webside score theimblog.net

Webside score theimblog.net Webside score theimblog.net Genereret August 21 2015 02:33 AM Scoren er 53/100 SEO Indhold Titel et Marketing Blog - Great Tips And Advice Længde : 47 Perfekt, din titel indeholder mellem 10 og 70 bogstaver.

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