OPGAVEN Y ELL O W G REN A D E

YELLOW GRENADE

OPGAVEN Nick Christiansen kontaktede mig på Facebook. Han havde set mit coverbillede, (ulven ses på modstående side) som jeg har tegnet i Illustrator. Han var helt vild med ulven, der udelukket er illustreret med trekanter. Nick Christiansen er iværksætter, og vil gerne have sat et rådgivningsfirma på benene. Han ønskede derfor et logo af en granat, lavet af trekanter. I denne sammenhæng blev jeg også bedt om at lave en hjemmeside med grafik, flyers og visitkort for Nick Christiansens YELLOW GRENATE (logo, flyers og visitkort udarbejdelsen kan du finde i mappen: Grafisk Design). Ideen med granaten som logo, er noget han selv har fundet på, samt navnet YELLOW GRENATE. Hans ide udspringer af den måde som han vil rådgive hans kunder på, nemlig ved hjælp af en illustration/ grafik. Den grafik ville han også have mig til at lave. I denne mappe vil jeg vise, hvad jeg har arbejdet med indenfor kernefagligheden Grafisk Produktion og Workflow. Her vil jeg visualisere mit workflow som jeg har haft i forbindelse med, at lave YELLOW GRENATEs hjemmeside. Hjemmesiden er en del af et stort designoplæg for YELLOW GRENATE, og denne udarbejdelse af hjemmesiden har jeg valgt at plukke ud og tage med her. Jeg vil her beskrive mine processer og overvejelser, valg og fravalg med fokus på slutproduktet i praksis. Y ELL O W G REN A D E Hele vejen igennem denne designproces af hjemmesiden, har jeg haft kontakt med Nick Christiansen over Facebook, hvor det er let at kommunikere og sende filer. Til slut har vi brugt WeTransfer.com, som en let måde at sende mapper (som zip-filer) og andet fra. Nick Christiansen ville nemlig gerne selv skrive teksten som skulle på hjemmesiden, jeg skulle gøre det klart til ham, og han ville også selv gøre hjemmesiden online. Så derfor har jeg skulle sende min Dreamweaver fil til ham, samt image -og styles mappen. YELLOW GRENATE VISUEL IDENTITET 2 GRAFISK PRODUKTION & WORKFLOW

visitkort logo flyers Nick Christiansen Marketing Guru Y ELL O W G REN A D E Y ELL O W G REN A D E vi skaber din online identitet T: 6154 5236 E: nick@yellow-grenate.dk W: www.yellow-grenate.dk Y ELL O W G REN A D E HJEMMESIDE YELLOW GRENATE VISUEL IDENTITET 3 GRAFISK PRODUKTION & WORKFLOW

BRAINSTORM YELLOW GRENATE VISUEL IDENTITET 4 INSPIRATION GRAFISK PRODUKTION & WORKFLOW

MÅLGRUPPEN DE 4 P ER YELLOW GRENATE henvender sig til ny opstartede eller i forvejen opstartede firmaer som skal have hjælp til opstart eller fornyelse. De er selvstædige. De har et produkt som de vil sælge, men har brug for hjælp til marketing og visuelidentitet. Det blå segment: Folk, der er tildelt det blå segment, lægger høj vægt på erhvervslivet. De har høj indkomst, høj prestige, høj uddannelse og er meget resultatorienterede. De går højt op i kvalitet og design. De stemmer på de Konservative og Venstre. Målgruppen: alderen er 25-30 år. Bor i en størrer by. Har gode ideer til et produkt som skal sælges, men har ikke den store erfaring i at designe sin visuelle identitet og hvordan man skal reklamere sig selv, bl.a. online. Selvstændig. Ny opstartet eller vil fornye sit firma. Nogle som vil være med på beated. PRODUKT: firmae skaber platforme og komplette marketing strategier. Opgaverne kan være: design af logo, oprettelse og design af hjemmesider, sociale medie stragier og marketing apps. PRIS: pris struktur skal så vidt det er muligt være i overensstemmelse med Nick Christiansens kompetencer, erfaring og positionering i faget. Han er ny opstartet, så derfor vil priserne nok ikke ligge i den høje ende i forhold til konkurrenterne. PROMOTION: reklame som bl.a. flyers skal ligges rundt omkring. Når man er online skal man sørge for at man kommer rundt omkring, også til forskellige konferencer og messer, hvor man sælger sit firma og gør reklame. POSITION: firmaet findes online. Når man er online, skal man købe sig til at komme frem som en af de øverste i rækken når man søger på google. Mange søger på nettet i dag, frem for at kigge i en telefon bog mm. Derfor er det en god måde at drive virksomhed på, især i starten, så det ikke kræver en matrikel. YELLOW GRENATE VISUEL IDENTITET 5 GRAFISK PRODUKTION & WORKFLOW

GRAFIK PROCESSEN Nick Christiansen havde den gode ide med, at kunne illustrere den måde som han arbejder på, med krudt, granat osv. og den grafik ville han gerne have med på hans hjemmeside. Nick skrev til mig på Facebook: Jeg kunne godt tænke mig, at se hele forløbet fra ide til implementering i en grafik. Jeg vil prøve at beskrive forløbet for dig her, blandet med de ideer jeg har til grafikkens udseende: Først skal være noget krudt eller sådan noget, det er der man møder kunden og undersøger hvilke ting man skal fokuserer på, det næste er at komme krudtet i granaten, granaten er symbol på hvilke kanaler der skal bruges (facebook, hjemmeside osv). Dernæste skal garanten kastes, så den sprænger og ramme flest fra målgruppen. Den sidste del skal være vurdering/opfølgning/ forsættelses af konceptet, der ved jeg ikke rigtig hvad der skal være symbol på det. Først skitserede jeg illustrationerne på et stykke papir, for at skabe en ide om hvad han skrev i beskeden på Facebook. Så jeg skulle lave en grafik som visuelt viste stadierne som man skal igennem fra ide til implementering. Det letteste ville være at lave en slags tegneserie over forløbet, med en mand som bl.a. kaster granaten, boom, og sårede personer. Men den ide fastede jeg hurtigt væk, da den var for barnlig og ikke så enkel. Jeg synes hellere om en grafik som er enkel, stil fuld, moderne, seriøs, da det buisness mænd som grafikken skal henvende sig til. Jeg fandt nogle billeder på Shutterstock som passede fint til det som jeg havde tænkt. Billederne i sig selv var måske ikke så spændende at se på, så for at gøre det mere fangende lave fritlægninger af billederne på en meget kantet måde, så meget at den hvide baggrund kom med. Det synes jeg så meget cool ud. Det krævede jo så at der kom en skygge bag på, for at man ville kunne se at det var hårdt fritlagt, og så giver det et klippe-klister-look. Oveni det har jeg været nødt til at lægge en baggrundsfarve på, men det synes jeg egentlig også bare godt om, da man så indrammer at her er grafikken. Nick Christiansen havde selv fra starten lagt ud at det var krudt, dernæst en granat og derefter nogle som bliver såret, som der skulle være på grafikken. De to første illustrationer var dermed lette at finde, hvor den sidste med de sårede skulle jeg arbejde på at illustrere. Jeg tænkte med det samme, at det ikke skulle blive blodigt, klamt, makabert eller noget i den stil, så hvordan kan man så illustrere at nogle bliver ramt af en granat? Jeg fik ideen ved at jeg for inden havde lavet en skyde plakat, og tænkte at noget ligende, bare meget stilet, ville kunne bruges. Illustrationen af pilen, valgte jeg fordi det er enkelt, det er stilfuldt, det er til at forstå. Ellers kunne jeg have lavet en illustration af at det blev hældt på, men så tror jeg grafikken ville blive hurtig at gennemskue. Min grafik blev med det samme godkendt af Nick Christiansen, men teksten under skal han selv have udarbejdet lidt mere på, så det bliver helt klart og tydeligt. YELLOW GRENATE VISUEL IDENTITET 6 GRAFISK PRODUKTION & WORKFLOW

GRAFIKKEN YELLOW GRENATE VISUEL IDENTITET 7 GRAFISK PRODUKTION & WORKFLOW

H JEMMESIDE INSPIRATIO N YELLOW GRENATE VISUEL IDENTITET 8 GRAFISK PRODUKTION & WORKFLOW

H JEMMESIDEN index STORYBOARD: Nick Christiansen havde selv set MYKITAs hjemmeside og havde fundet den rigtig god. Han sendte mig et link og skrev at han godt kunne tænke sig en hjememside som lignede den. Han havde brug for en startside, en informationsside hvor grafikken skulle på og en kontakt side. Ellers gav Nick Christiansen mig frie tøjler. til designet. FLOWCHART: Flowchartet ser altså således ud: Index som er startsiden, skal hedde YELLOW GRENATE. Så er der to andre sider som hedder information og kontakt. Alle sider linker til hinanden. information kontakt BILLEDER -OG FIL STØRRELSER: Alle mine billeder og filer må ikke fylde mere end 10 sek, da hjemmesiden ellers tager for lang tid at komme frem når man har klikket på hjemmesiden online. Men mine billeder er så store og vigtige, at jeg tillader at de bliver lidt størrer. Jeg vil have at folk der besøger hjemmesiden ikke skal vente på at hjemmesiden er loaded færdig, så YELLOW GRENATE kan miste eventuelle kunder. Derfor vil jeg have alle billeder som JPG-filer, da de fylder mindst og have dem i opløsningen 72 ppi. Og hvis jeg havde nogle negative ikoner eller logoer, så ville jeg have haft dem i PNG. For at få mine billeder ned i et lille format, så åbner jeg dem i Photoshop, trykker File > Save for Web and Devices. YELLOW GRENATE VISUEL IDENTITET 9 GRAFISK PRODUKTION & WORKFLOW

INDEX/ YELL O W GRENATE BLIKFANG: Det første man ser når man kommer ind på YELLOW GRENATEs index side er logoet. Loget er det som besøgeren skal kunne huske, og skal kunne genkende, hvis han hun møder det igen. Logoet er en vigtig del af dette firma, da det også er en reference til grafikken, som er den måde Nick Christansen vil rådgive hans kunder udfra. TEKST: I teksten skal der stå noget om hvad firmaet kan tilbyde og det skal være en appetit vækker til at man har lyst til at besøge Informations siden, hvor man mere dybte gående vil få information om YELLOW GRENATs ydelser. Det bliver ens for alle sider at der er sådan en tekst i bunden, så det skaber fobundethed siderne imellem. Det vil være forskellig tekst på alle sider, men med samme struktur. Den overholder Gestalt loven om nærhed, da man kan se at overskriften og teksten nedenunder hører sammen. Teksten har den font som også er på YELLOW GRENATEs andre ting. (Se mere i mappen: Grafisk Design). Y ELL O W G REN A D E Velkommen til Yellow Grenate. Velkommen til Yellow Grenate. Her på denne hjemmeside Ximaio vid magnisit, que quatemp orunditsumqui dolorem erferum, que est qui ducimolor ab idiant apero consercia doloritium inus evellupta di dolut pliam ex et qui ilignitibus, soluptatur sed qui delent delescium volorporrum sum volupta tatectiis comni sa voluptaspe doles qui dolupta tendam vidia perciatur? Ovidi cupiet doluptatem reptuscitao. Nam quundis inverchici to voluptati ut qui autenis estem volorro vitibus cus etur sunt et hitia alicipsam que doluptasite volor rerum quis eveles excestr uptaepudis estissimus, nonsedi ctatet hicaecti tendio dolupie ndelecus. YELLOW GRENATE INFORMATION KONTAKT MENU: På alle sider vil der være denne menubar. Menuen er ens på alle sider og er placeret samme sted. Dette giver en forbundethed mellem alle siderne. Dette er også en hjemmeside hvor det ikke er muligt at scrolle. Derfor vil menuen alti være let at finde. Menuen overholder Gestalt Lovene for: nærhed, da menuen står på linje, så man kan se at de hører sammen og kan derfor det samme - nemlig linke videre til en anden side. Den overholder loven om lighed, da fonten, font størrelsen og farven er den samme, og de skal betragrtes som ens, da de kan det samme. Det er også ens for dem, at når man har en af linkerne aktiv, så er den grå i stedet for sort. Den besøgte side bliver sort igen når man går derfra. Fonten er den samme som logoets, se mere i mappen Grafisk Design. YELLOW GRENATE VISUEL IDENTITET 10 GRAFISK PRODUKTION & WORKFLOW

INFORMATION BLIKFANG: Når man kommer ind på denne side, er grafikken det første som man ser. Grafikken er væsentlig at have en fokus, da det er den det hele drejer sig om. Det er den som man skal finde interessant og skaber interesse og nysgerrighed for hvad YELLOW GRENATE tilbyder. Der skal også være en overskrift på denne side, og overskriften skal være navnet på grafikken, f.eks.: fra ide til implementering. Overskriftens font er den samme som logoets, som blev bestemt under designfasen, som du kan se i mappen Grafisk Design OVERSKRIFT TEKST: I teksten skal der stå dybte gående hvad YELLEOW GRENATE tilbyder og kan hjælpe med og enventuelt en uddybning af hvad grafikken ovenfor betyder. Fra ide til implementering. Her på denne grafik kan du se imaio vid magnisit, que quatemp orunditsumqui dolorem erferum, que est qui ducimolor ab idiant apero consercia doloritium inus evellupta di dolut pliam ex et qui ilignitibus, soluptatur sed qui delent delescium volorporrum sum volupta tatectiis comni sa voluptaspe doles qui dolupta tendam vidia perciatur? Ovidi cupiet doluptatem reptuscitao. Nam quundis inverchici to voluptati ut qui autenis estem volorro vitibus cus etur sunt et hitia alicipsam que doluptasite volor rerum quis eveles excestr uptaepudis estissimus, nonsedi ctatet hicaecti tendio dolupie ndelecus. YELLOW GRENATE INFORMATION KONTAKT YELLOW GRENATE VISUEL IDENTITET 11 GRAFISK PRODUKTION & WORKFLOW

K O NTAKT KONTAKT OPLYSNINGER: Det er vigtigt at den besøgende let kan finde kontakt oplysningerne. Hvis det er for svært at finde frem til oplysningerne på en hjemmeside, så man længe skal sidde og søge, så kan det være at man mister nogle eventuelt nye kunder, da de opgiver søgningen. KONTAKT Nick Christiansen Kommunikations rådgiver T: 6154 5236 E: nick@yellow-grenate.dk Få hjælp til,hvordan du rammer din målgruppe BLIKFANG: Det er vigtigt at man også her kan se hvad YELLOW GRENATE tilbyder, da man fra google søgning, direkte kan komme ind på denne side, uden at være kommet forbi de to andre. TEKST: I teksten skal der stå fakta om firmaet. Hvornår det startede og eventuelt hvorfor Nick Christiansen er opstartet og hvordan, hans erfaring osv.. Det er godt at have disse oplysninger stående, så den nye eventuelle kunde, kan få et indblik i YELLOW GRENATE og kunne føle sig tryk ved at kontakte. Yellow Grenate. Firmaet Yellow-Grenat startede i 2013 velkommen til Yellow Grenate. Her på denne hjemmeside Ximaio vid magnisit, que quatemp orunditsumqui dolorem erferum, que est qui ducimolor ab idiant apero consercia doloritium inus evellupta di dolut pliam ex et qui ilignitibus, soluptatur sed qui delent delescium volorporrum sum volupta tatectiis comni sa voluptaspe doles qui dolupta tendam vidia perciatur? Ovidi cupiet doluptatem reptuscitao. Nam quundis inverchici to voluptati ut qui autenis estem volorro vitibus cus etur sunt et hitia alicipsam que doluptasite volor rerum quis eveles excestr uptaepudis estissimus, nonsedi ctatet hicaecti tendio dolupie ndelecus. Jeg ser meget frem til et samarbejde med dig. YELLOW GRENATE INFORMATION KONTAKT YELLOW GRENATE VISUEL IDENTITET 12 GRAFISK PRODUKTION & WORKFLOW

HJEMMESIDE PRODUKTIONEN Domænenavnet www.yellowgrenade.dk var ledigt, så det er købt. Så hjemmesiden kan snart findes online. Kunden skal nu selv sætte sin egen tekst ind, hvor jeg har gjort plads til det. Jeg har på alle tre sider den samme with og height, så de er ens. Jeg har også margin-left & right som auto, så hjemmesiden altid er i midten. På kontakt siden har jeg delt siden op med mange div-containere for at kunne få det hele med. Grafikken til højre er lagt ind som baggrund, så jeg kunne skrive teksten ved siden af. Grafikken i midten har jeg lavet lige så lang som min wrap, så den kommer i fokus og tiltrækker opmærksomheden. Jeg har ikke kunnet lave grafikken, så den gik var den ene ende til til anden på skærmen, da alle skærme ikke har de samme mål. YELLOW GRENATE VISUEL IDENTITET 13 GRAFISK PRODUKTION & WORKFLOW