Dokumentation. Grafisk Design

Transkript

1 Dokumentation Dokumentation OPGAVEN: Denne opgave er lavet for en ny opstartet cafe og restaurant i Vordingborg, de skulle derfor bruge et logo som det første og derefter en hel design linje. Deres ide var at det skulle være kombineret cafe og restaurant, cafe om dagen og restaurant om aften. Så derfor ville de bibeholde den lidt fine restaurantstil, med servicen i top og ingen selvbetjening. Madstilen skulle være en kombination mellem det nye cafe køkken, og det gamle danske traditionelle køkken, og gerne med et lidt eksklusivt touch. MÅLGRUPPE: Målgruppen er bred, den er fastsat til at være årige, det er mennesker som godt kan lide lidt ekstra godt, som gerne vil give lidt penge for selv at slippe for opvasken, de kan godt lide god mad og god kvalitet, det er ikke dem som tænker vi tager kaffen derhjemme, men derimod dem som måske hellere vil tage kaffen ude med veninderne, kigge på mennesker og sidde i flere timer for at snakke. Det er ikke nødvendigvis en målgruppe som har en kæmpe rådighedsbeløb, men måske mere nogle som bare prioriterer at gå ud, for at få deres kick af livsnyder stilen, det vil også være en målgruppe som prioriterer det sociale højt. PROGRAMVALG: Illustrator CS6, InDesign CS6, Photoshop CS6 og Wordpress TEKNIKKER: Brainstorm Google Storm Mindmap Moodboard Skitser Design Pen tool Spatiering Wordpress

2 Moodboard

3 Mindmap og skitser

4 Logo proces HOLGER OLGER HOLGER HOLGER HOLGER Cafe og Rastaurant HOLGER HOLGER H HOLGER HOLGER C a f e o g r e s t a u r a n t Cafe og restaurant

5 Logo proces C a f e o g r e s t a u r a n t C a f e o g r e s t a u r a n t C a f e o g r e s t a u r a n t C a f e o g r e s t a u r a n t Cafe og restaurant C a f e o g r e s t t a u r a n Cafe og restaurant Cafe og restaurant Cafe og restaurant

6 Det endelige logo Logoet skulle gerne være enkelt og let genkendeligt. Jeg ville gerne kombinere det lidt mere moderne med noget lidt old school, da det også var ejerens ide med selve menukortet s indhold. Min tanke var også at det skulle være et lidt seriøst og enkelt udtryk men med et lille tvist, det lille tvist kommer til udtryk i form at hatten, her kan det godt ligne lidt et ansigt, altså med O og G som øjne, og L som næse som vist her til højre. Hatten kan også bruges for sig selv i forskellige sammenhæng # 1F1F1E 0 / 0 / 0 /100 # 56257A 75 / 100 / 1 /5 # / 0 / 0 /80 Min primære»farve«er sort, som er gennemgående i hele design linjen, udover min primære farve har jeg lavet to sekundære farver, den lilla farve bruger jeg lidt som en heighlighter i f.eks. avisannonser og på flayers. Den grå farve bruger jeg primært til de forskellige illustration i f.eks. menukortet. Century Gothic Regular Italic Bold Bold Italic abcdefghijklmnopqrstuvxyzæøå ABCDEFGHIJKLMNOPQRSTUVXYZÆØÅ (!@#$%&.,?:;) Jeg har valgt at bruge fonten Century Gothic som er en sans serif, som er Grotesk font, dvs. en skrifttype uden fødder. Century Gothic er også en opentype font. Jeg synes at fonten er rigtig fin enkel og moderne, den kompencere fint for den lidt tunge hat, og gør logoet mere let.

7 Størrelser og gråtoner Logo i forskellige størrelser Logo i gråtone

8 Inspiration til website

9 Skitser til website

10 Flowshart Index siden indeholder b.la. en slider så gæsten kan få en fornemmelse af stemningen, og måske blive fristet Index/Velkommen Menukort Månedensmenu Kolde drikke Galleri Åbningstider Søndagsbuffet Varme drikke Vinkort Kontakt Frokost Google map Caferetter Der er et kort på kontakt siden sådan at brugeren kan danne sig et indtryk af hvor restaurantens placering er Frokost Dropdown med menukort Vegetar & fiskeretter Stegeretter Facebook Opkald Desserter Børneretter Jeg har to symboler som er vist under menuen, de fremgår på alle siderne, det gør det nemt for brugeren at komme direkte til restaurantens facebook side, hvor de b.la. kan læse anmeldelser fra andre gæster. Udover facebook ikonet er der også et opkaldsikon, sådan at kunden kan ringe direkte op til restauranten.

11 Website Denne hjemmeside er lavet i wordpress, da kunden havde et behov og ønske om, selv at kunne rette tekst på hjemmesiden. Siden er responsive sådan at den tilpasser sig brugerens platform, dette er blevet en næsten uundværlig egenskab for en hjemmesider, da der i dag er så mange forskellige platformer og derfor mange forskellige skærmstørrelser. Jeg har valgt at hjemmesidens design og muligheder skulle være meget enkle, både for at være i tråd med resten af design linjen, men også for at brugeren skal have nemt ved at navigere rundt på siden.

12 Website og facebook Under menuen har jeg benyttet mig af to ikoner, et der linker direkte til restaurantens facebook side, da man her også vil kunne finde relevante oplysninger, det kunne f.eks. være konkurrencer, arrangementer og anmeldelser fra andre spisegæster. Det andet ikon jeg har valgt at sætte på kan man bruge hvis man tilgår hjemmesiden via en smartphone, så vil man kunne klikke på det, og du vil her blive spurgt om du vil ringe op, på den måde er man fri for at skulle skrive ned, eller lave en copy paste. Jeg har også lavet en facebook side til restauranten, da facebook er en rigtig god måde at komme ud til folk på, her kan man få meget reklame til ingen penge, det giver også rigtig god mulighed for at dele f.eks. arrangementer med sine gæster, og så få dem til at dele dem, og på den måde når man lige pludselig ud til mange potentielle gæster. På facebook har man også en rigtig god mulighed for at få et indblik i hvad der sker på siden og hvem ens besøgende er, hvis man vil kan man kigge nærmere på dette og finde ud af en hel del om sin målgruppe.

13 Website Logoet fungerer som link til forsiden. Alle link er påført mouseover effekt, mouseover er er funktion som viser, at der sker en handling når musen bevæger sig ind over et element eller noget tekst. I dette tilfælde for linksene en mørkere farve. Slider på forsiden som viser lidt billeder fra Cafe og restaurant Holger Knap som linker direkte til menukortet

14 Tablet Logoet fungerer som link til forsiden. Samme layout som på computeren, mouseover effekten er dog væk da dette ikke fungere på tablet og smartphone Slider bliver skaleret ned, men ikke beskåret.

15 Smartphone Alle menu punkter er blevet til en dropdown menu, på denne side er det en udemærket løsning, da der er mange menupunkter, det ville fylde rigtig meget på siden hvis menupunkterne skulle ligge under logoet, og man ville der skulle scrole meget op og ned på siden. Finger-scroll på siden. Det er en funktion du bruger på smartphones og tablets Menukortet er sat op i collumns der bliver skalleret alt efter hvilken størrelse skærm den vises på Slider bliver skaleret ned, men ikke beskåret.

16 Færdige produkter