portfolio GRAFISK WORKFLOW

Transkript

1

2 Grafisk Workflow Opgaven Der skal laves nyt hjemmesidedesign til Inhouse Graphic skolepraktik på Aarhus Tech. Hjemmesiden skal kort og godt fortælle om de elever, der arbejder i skolepraktikken og om deres kompentencer, evner, færdigheder og produkter de laver. Det er faktisk en fælles opgave for os alle sammen, hvor Henriette Lindsted Heckmann og jeg står for det meste af arbejdet i Dreamweaver. Det er Henriette, som står bag jquery.nivo.slider og jscrollpane. Resten er stort set mit arbejde. Min opgave var også at lave skelet, flowchart og storyboard. Layout er lavet af Amanda Skov Hansen. Designkrav En hjemmeside som er nem at navigere igennem Link til [email protected] via Microsoft Outlook 2010 Flotte produktbilleder Skal være indbydende Links til: Facebook Google Maps på Kontaktsiden Layout Format 1024 x 640 px Alle sider linker til hinanden via menulinjen Menulinjen med mouseover effekt, lavet som liste, drop down menu. jquery.nivo.slider på Portfoliosiden (både trykt og digitalt) Hotspot effekt (med Polygon Hotspot Tool) på Teamsiden jscrollpane skrolbar på Homesiden og hver elevs enkelte side Typografi H1 (37 px; #413e3c), H2 (28 px; #c8d413) og H3 (20 px; #C8D413) Georgia; Times New Roman; serif, H4 (14 px; #413E3C) Helvetica; Arial; sans-serif p (11 px; #000) Helvetica; Arial; sans-serif Komposition Tænkt i kasser og i lige linjer for at skabe overblik. Illustrationer jpeg billeder af høj kvalitet ihg-logoet er et png.billede Procesbeskrivelsen Holder møder og snakker med hinanden Skitser i hånden og Illustrator Fotografering af vores produkter med kamera Canon EOS 1000 D Layout i Photoshop Flowchart i InDesign Skelet af index.html i Illustrator Storyboard af diverse sider i Illustrator Billedbehandling i Photoshop (RGB og 72 ppi) Opsætning i Dreamweaver med andvendelse af css, html og jquery Tjekkes i diverse browsere: Mozilla Firefox, Internet Explorer og Google Chrome Uploades på IHGs domæne Farver Dominerende farver gennem hele hjemmesiden er: lime grøn: #C8D413 og grå #413E3C Kvalitetsvurdering Vores lærer(er), andre fra klassen og selvfølgelig mig er meget tilfredse med IHGs ny hjemmeside

3 INDEX PORTFOLIO TEAM KONTAKT 1.5 BESTILLING Flowchart Hjemmesiden består af en indexside og fire underligende sider. Portfolioside består af to andre underside. Teamside består af så mange sider som der er elever i skolepraktik. Mens bestillingsside har én underliggende side AMANDA HENRIETTE FIND OS 1.2 PORTFOLIO TRYK DIGITALT 1.3 TEAM ANDREAS CHRISTINA KASPER MARIE PRISER DITTE MILI

4 Inhouse Graphic website - Skelet, index.html 193 x 199 px 1024 x 640 px 135 px Skelet index.html Skelet til index.html er lavet i Illustrator. 19 px 33 px 299 px 61 px 336 x 16 px 42 px 42 px 109 x 161 px 148 px 19 px 46 px 168 x 122 px 135 px 109 px 355 x 74 px 14 px 2 px 54 px 38 px 168 x 238 px 270 px 102 px 418 x 195 px 79 px 41 px 102 px 2 px 29 px 29 px

5 Inhouse Graphic website - Storyboard, index.html Storyboard index.html 3 1 baggrundsbillede.jpeg 2 inhousegraphic_logo.gif 3 5 Brødtekst (Neue Helvetica 55 Roman 14 pt RGB: RGB: ) LIDT MERE KANT HVEM ER VI? H3.textdoc (Neue Helvetica 55 Roman 25 pt RGB: ) 6 HOME PORTFOLIO TEAM KONTAKT BESTILLING 5 4 Links H1.textdoc (Georgia, Reg. 45 pt RGB: RGB: ) home->index.html ->.html team->team.html kontakt->kontakt.html bestilling->bestilling.html 4 H2.textdoc (Georgia, Reg. 30 pt RGB: ) Storyboard til index.html er lavet i Illustrator.

6 Layout Layout til index.html er lavet i Photoshop.

7 Hotspot (team.html) Her viser jeg nogle af siderne som jeg står for. Hotspot effekt (med Polygon Hotspot Tool).

8 Externe link (kontakt.html) Her viser jeg også en af siderne som jeg står for.

9 Browserkompatibilitet Hjemmesiden virker i: Mozilla Firefox, Internet Explorer og Google Chrome