GRAFISK WORKFLOW WEBSITE - CHOCOADDICT



Relaterede dokumenter
GRAFISK WORKFLOW H1 MARIA SCHELDE

grafisk workflow Madmagasinet

PORTFOLIO TYPOGRAFI & OMBRYDNING

GRAFISK PRODUKTION OG WORKFLOW. Hjemmeside til Team Brügger

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 WEBSHOP TIL KLITMØLLER COLLECTIVE

GRAFISK PRODUKTION & WORKFLOW. Endotest website

Grafisk produktion & workflow

GRAFISK WORKFLOW PHILIP CREAMER AARHUS TECH SVENDEPRØVE NOVEMBER 2016

Grafisk workflow. Hjemmeside til Bærkompagniet

Mit grafiske workflow inkluderer:

GRAFISK DESIGN. Min personlige e-portfolio

Portfolio - Grafisk Workflow

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

Grafisk workflow. Se siden her:

GRAFISK PRODUKTIONSFORSTÅELSE

GRAFISK WORKFLOW. Kasper Staal - Portfolio - H2

Laura Svendsen Kernekompetencer GRAFISK WORKFLOW

portfolio GRAFISK WORKFLOW

portfolio GRAFISK WORKFLOW

GRAFISK WORKFLOW Hjemmesidedesign

GRAFISK WORKFLOW OPGAVEBESKRIVELSE KVALITETSVURDERING HJÆLPEMIDLER BROWSER BRUGERVENLIGHED/USABILLITY

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

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

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

GRAFISK PRODUKTION & WORKFLOW

GRAFISK WORKFLOW GRAFISK WORKFLOW DIGITAL KOMMUNIKATION OLEMOGELBY.COM

GRAFISK PRODUKTION PORTFOLIO DAN KLESSEN BOOSTING BUSINESS MEDIEGRAFIKER SVENDEPRØVE

GRAFISK WORKFLOW. 1 Grafisk workflow

grafisk workflow Frank winding

Sabine Puk Sørensen Svendeprøve portfolio

GRAFISK WORKFLOW Hjemmeside - Husk hjelmen.

REDESIGN AF GRAFISK FORUMS HJEMMESIDE. Grafisk Workflow

FORSTÅELSE FOR GRAFISK PRODUKTION OG WORKFLOW

Grafisk workflow. bl.udbudsnet.dk

Dokumentation. Karen-Louise Fejerskov

GRAFISK DESIGN SVENDEPRØVE Dorte Damsgaard Larsen

Grafisk Workflow. Opgaven. Test i forskellige browsere (Usability) Arbejdsgang. Kvalitetsvurdering. Procesbeskrivelse

GRAFISK PRODUKTION & WORKFLOW RESPONSIV HJEMMESIDE

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

GRAFISK WORKFLOW LENA SØRENSEN

Grafisk Workflow. hovedforløb 2

Her ses et screenshot af websitet solsystemet i menuen Merkur. Baggrundsbillede skal være static så resten af siden skal man scrolle ned for at se.

Produktbeskrivelse - Grafisk workflow

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

1. Hovedforløb. Mediegrafiker

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

Grafisk. Workflow. Side 1

Mark André Lyhne. Eksamen web1b

FORSTÅELSE FOR GRAFISK PRODUKTION

Dokumentation. Grafisk Design

Birgitte Bremholm Persson MG21 svendeprøve 2015 MEDIEGRAFIKERSVENDEPRØVE

PROJEKTET LAYOUT IDEUDVIKLING - PROCESS FRA IDÉ TIL PRODUKT

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

Grafisk design. Ide. Designprocess. Målgruppe

GRAFISK DESIGN. Diner no. 34 Hjemmeside + Visuel identitet

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

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. fra idé til visuelt udtryk Benett

Produkt. Index side GRAFISK DESIGN

PORTFOLIO SVENDEPRØVE

Grafisk Design. rafisk Design

KODNING AF RESPONSIV DESIGN

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

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

COPENHAGEN. Opgaven. Kunden. Målgruppe. Layout 1. GRAFISK DESIGN // METTE-MARIE RANDSKOV

WORKFLOW. RESPONSIV HJEMMESIDE MED ET FARVETWIST Hjemmesidedesign og udvikling.

H2 Portfolio. Patrick Lindholm-Andersen

grafisk design Se webappen på din mobil

Eksamensopgave Aarhusportalen. Melissa Emilie

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

Hovedforløb 1 Grafisk Produktionsforståelse & Workflow Stine Keller

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

MARIA SKAU MADSEN SVENDEPRØVE

det færdige resultat

Transkript:

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 skal laves index side, samt to underliggende sider. Disse skal bestå af en side som viser forskellige opskrifter og en side med en opskrift, hvor print selv opskriften ligger. Der skal desuden være et link til print selv opskriften, hvor kunden selv kan udfylde skabelonen. Denne skal ligge et sted som ses og er nem for kunden at finde. LAYOUT Layoutet er enkelt og lyst, da kunden ønskede at billederne skulle være i fokus. Stilen er meget moderne, og flere af billederne har et grafisk element inde over ved mouseover. Sitet er opbygget i tre spalter, således at de gennemgående linjer forbliver. Index siden er opbygget således at det er nemt at tilføje nye blog indlæg, og kan placeres i vilkårlig rækkefølge. Kategori siden kager er opbygget således at sitet bliver længere jo flere billeder der tilføjes. USABILITY Sitet er overskueligt og nemt at navigere rundt på. Menuen er lavet med dropdown, så det altid er nemt at finde den rette kategori lige meget hvor på sitet du befinder dig. Der er desuden lavet links mellem blog indlæg på forsiden til opskriften. BROWSERKOMPATIBILITET Sitet er testet i Chrome og Safari, og her fungerer alt som forventet. PROCESREDEGØRELSE Møde med kunden Inspirationssøgning og ideudvikling Skitser Layout i Photoshop som sendes til kunden for godkendelse Flowchart, skelet og storyboard udarbejdes så det er hurtigt og nemt at gå til programmeringen. Programmering af sitet Søgeoptimering ved brug af metatags Browserkompatibilitet testes Demo sendt til kunden Enkelte rettelser af tekster og koder Sitet godkendes og uploades KVALITETSVURDERING Jeg er blevet godt tilfreds med det færdige resultat, da sitet er let og overskueligt at navigere rundt på. Opskrifterne er let tilgængelige, og print-selv funktionen virker som forventet. Senere skal sitet laves responsivt, således at det virker optimalt på tablets og smartphones.

MOODBOARD IDEUDVIKLING Disse tre skitser er blevet brugt som udga ngspunkt for sitet

FLOWCHART LAYOUT I PHOTOSHOP opskrift.html FORSIDE, KAGER OG MIN BEDSTE BROWNIE Layoutet er enkelt og lyst, da kunden ønskede at billederne skulle være i fokus. Stilen er meget moderne, og flere af billederne har et grafisk element inde over ved mouseover. kategorier.html chokoladen.html mitkoekken.html Sitet er opbygget i tre spalter, således at de gennemgående linjer forbliver. Index siden er opbygget således at det er nemt at tilføje nye blog indlæg, og kan placeres i vilkårlig rækkefølge. Kategorisiden kager er opbygget således at sitet bliver længere jo flere billeder der tilføjes. Her ses kategorisiden "kager" samt en opskrift som bliver vist her som "Min bedste brownie" kager.html brownie.html cookies.html broed.html andet.html Index siden med blog opslag, samt informationer som bla om mig, nyheder og instagram.

SKELET & STORYBOARD - FORSIDE SKELET & STORYBOARD - KAGE #header: auto x 1000px #banner: 150 x 1000px - img: frontpage_banner.png #header: auto x 1000px #banner: 150 x 1000px - img: frontpage_banner.png #Nav #Nav #content: auto x 1000px #boksleft: auto x 525px #boks1: auto x 475px #boksright: auto x 250px #boks2: auto x 200px #content: auto x 1000px img: kage_chokoladekube.png img:kage_chokoladekube_over_png img: kage_chokotærte.png img: kage_chokotærte_over.png img: kage_saltlakrids.png img: kage_saltlakrids_over.png img: frontpage_brownie.png img: frontpage_moedmig.png img: kage_hindbærmarengs.png img: kage_hindbærmarengs_over.png img: kage_brownie.png img: kage_brownie_over.png img: kage_smore.png img: kage_smore_over.png #boks1: auto x 475px #boks2: auto x 200px #boks3: auto x 800px #boks3b: 250 x 250px #boks3c: 250 x 250px img: frontpage_mitkoekken.png Billeder som skifter ved mouseover.

HTML & CSS HTML & CSS METATAGS, MENU & MOUSEOVER På sitet har jeg lavet description og metatags, for at øge søgeoptimeringen. Derudover har jeg lavet alternative tekster til billeder, samt benyttet mig af h1, h2, h3 og p. På denne side ses min html for metatags, menuen samt billeder med mouseover. På modsatte side vises min css. Billeder som skifter ved mouseover - samt "alt" tekst.

H2 PORTFOLIO - GRAFISK WORKFLOW CAMILLA GREGERSEN