Indholdsfortegnelse Idéen bag logo Idéen bag website Farveversioner af logo Webdesign Videoen: Visuelle tanker Stil Speciel effects Motion Design



Relaterede dokumenter
3. semester F&A, 2014 Jump Rope Production

GRAFISK WORKFLOW. Proces. Kodning. Fonts:

GRAFISK WORKFLOW. 1 Grafisk workflow

GRAFISK WORKFLOW OPGAVEBESKRIVELSE KVALITETSVURDERING HJÆLPEMIDLER BROWSER BRUGERVENLIGHED/USABILLITY

PROGRAM VALG: InDesign CC Illustrator CC Photoshop CC Dreamweaver CC

GRAFISK WORKFLOW. Rune Hjørringgaard

Projekt 5 Eksamens opgave Re-design af portfolio Af Jonas Lunding

NY IDENTITET TIL SCHWARZ

WORKFLOW & GRAFISK PRODUKTION

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.

Tweet dine råd - Og gør dem levende med Vine og Instagram

BILLEDBEHANDLING & GRAFIK

Brugermanual 3D Webcam

GRAFISK WORKFLOW PORTFOLIO NIKLAS POULSEN H1

GRAFISK DESIGN. Diner no. 34 Hjemmeside + Visuel identitet

GRAFISK DESIGN CAMILLA VINTER

grafisk workflow OPGAVE: EMBRACE-IT WEBSITE

NICHLAS STILLING HANSEN PORTFOLIO

Grafisk design. Ide. Designprocess. Målgruppe

Grafik & Billede Billedbehandling

Odense Video Klub Bent Sehested Side - 1. Start AE og kontroller indstillingerne for PAL:

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. Hjemmeside til Dizzy Mizz Lizzy

JEG GIVER SELLS.DK NYT LIV MED ET MODERNE RE-DESIGN.

Introduktion. Hej og velkommen til "Sådan tager du fantastiske landskabsfotos".

Gruppemedlemmer: Frederik, Michael og Anders

GENNEMGANG PROCES HVAD GÅR OPGAVEN UD PÅ MÅLGRUPPE PROGRAMVALG

GRAFISK DESIGN. Responsiv website - Mockup

REKLAMEBANNER FOR MEDINA

GRAFIK & BILLEDETBEHANDLING Kunde / Pierre Beauvais Opgave / Annonce (fiktiv) Farve / RGB Programmer / Photoshop, InDesign

Grafisk workflow. bl.udbudsnet.dk

Produktionsforståelse. Julie Kühnell Hovedforløb 2, november 2017


GRAFISK DESIGN 1. HOVEDFORLØB

Designmanual. Bilag 04

OPGAVEBESKRIVELSE. Grafisk design process for Kolding Motion, logo, frontend hjemmeside samt t-shirt og skilt.

WOODKID. The Golden Age. Banner Projekt - 1 Semester, CPH Business, MUL-A13E. Casper Birch Buchberg, Natahlie Heiden & Sebastian Nyholm

SÅDAN LAVER JEG DET FEDESTE KAMPAGNE- BILLEDE NOGENSINDE.

det færdige resultat

GRAFISK DESIGN DOTHOST HJEMMESIDE

Tillæg til Libris-hæftet: WordPress. Temaredigering og sikkerhed m.m.

PORTFOLIO SEBASTIAN NYHOLM. Eksamensprojekt. 1. Semester

PR Offset Dennis Iversen Mediegrafiker Nordre Ringvej Fredericia

Produkt. Index side GRAFISK DESIGN

Vurdering af billedmanipulation Opgave 1

Dokumentation. Karen-Louise Fejerskov

Film Hastighed Film Speed

Grafisk produktion & workflow

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

Billedredigering REDEGØRELSE BILLEDE REDIGERINGS OPGAVE HORROR MOVIE POSTER

Kom i gang - Sådan gør du: 1) For at komme i gang skal du først oprette dig som bruger. Tryk på

Naja Schlüter Roskilde Tekniske Gymnasium 26/ Interessentanalyse

grafisk workflow Frank winding

1 // Grafisk design. Hjemmesiden før. Kunde. Produkt. Opgave. Målgruppe. Bogforlaget Frydenlund A/S.

AFTER EFFECTS DET GRUNDLÆGGENDE INTERFACE

Introduktion til Flash

Guds Fred Grafisk produktionsforståelse

PROJEKTET LAYOUT IDEUDVIKLING - PROCESS FRA IDÉ TIL PRODUKT

Grafisk workflow. Se siden her:

GoXtreme Barracuda 4k

Odense Video Klub Bent Sehested Side - 1

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

Grafik Billedbehandling

GRAFISK DESIGN Logo - inderst inde

Grafik & billedbehandling. EDC Åløkken, Vinduesfolie

Mediegrafiker hf 1, Sascha Petersen. Grafisk design. Wireframe & skitse. 1 - Page 1. Flowchart. Start. Opret bruger/login Forside Mad i din by.

Interaktiv filmanalyse

CINEMAGRAPH - Sydsort.dk

GRAFISK WORKFLOW H1 MARIA SCHELDE

GRAFISK PRODUKTION OG WORKFLOW. Hjemmeside til Team Brügger

Grafisk. Design. Side 1

GRAFISK WORKFLOW WEBSHOP TIL KLITMØLLER COLLECTIVE

Birgitte Bremholm Persson MG21 svendeprøve 2015 MEDIEGRAFIKERSVENDEPRØVE

GRAFISK WORKFLOW PHILIP CREAMER AARHUS TECH SVENDEPRØVE NOVEMBER 2016

KERNEOMRÅDE. Grafik & Billeder

GRAFISK WORKFLOW. Hjemmeside design til Chem-Tec Plating

Hvad skal vi have ud af dagen: Desk Research omkring Spicy Køkken, evt. muligheder for Spicy Køkken, til vores SWOT/TOWS.

GRAFISK PRODUKTIONSFORSTÅELSE

Introduktion. Properties (egenskaber) Timeline (Tidslinien) Stage (hovedscenen) kan redigeres.

Tweet dine råd. - og gør dem levende med Vine og Instagram

KALAS FESTIVAL. Link til hjemmesiden: Laura Lundby Gravesen

REDESIGN AF GRAFISK FORUMS HJEMMESIDE. Grafisk Workflow

GRAFISK WORKFLOW HJEMMESIDE EL FIRMA ANDERSEN EL

OPGAVEN PROGRAMMER VÆRKTØJER ARBEJDSPROCESS KVALITETSVURDERING

Grafisk Design. fra idé til visuelt udtryk Benett

GRAFIK OG BILLEDE Være Sammen folder reklame

WORKFLOW & PRODUKTION

afsender Aarhus Folk Festival

GRAFISK DESIGN. Kenneth Friis Petersen

Introduktion til Flash

Lav en hjemme side der kan sælge fly billetter til en stor i Europa.

Projekt Reklamefilm Kom/IT y, HTX, EUC Syd Sønderborg Sahra M. Andersen

Grafisk produktion & workflow: Alt til forfesten

Portfolie Redesign. Multimediedesigner CPH Business 1. sem. eksamensprojekt - Clmul-b12e Januar Jens Jákup E.

Disse har alle sammen hjulpet til at skabe min hjemmeside. Ved at give inspiration og få ideerne ned på papir, før de blev vist til omverdenen.

Redtape.dk Grafisk Design

404 CAMCORDER CAMCORDER- OG KAMERAFUNKTIONER

Vejledning for LOF s afdelingshjemmeside

GRAFISK WORKFLOW - RESPONSIV WEBSIDE

Transkript:

1

Indholdsfortegnelse Idéen bag logo 3 Idéen bag website 4 Farveversioner af logo 5 Webdesign 6 Videoen: 7 Visuelle tanker 7 Stil 7 Speciel effects 8 3D 8 Motion Design 9-10 2

Introduktion Hoved idéen bag logoet: Opbygning Vores logo er udarbejdet i to versioner, en med alle medlemmers navne og en uden. Versionen med navnene er den version der primært ville blive brugt. Det andet logo vil blive brugt i korte sekvenser i film og spil efter at man har stiftet bekendtskab med den første version, den er med til at skabe mere simplicitet i vores design. Symbolik Udviklingen af logoet til Designbureauet er lavet med inspiration fra det enkle, men med et sofistikeret præg, selvom der mangler lidt af to bogstaver er man ikke i tvivl om hvad de er, men man danner selv forbindelsen og husker det, der må ikke herske tvivl om hvem det er at brugeren besøger og hvilken slags bureau vi er. Derudover er der god symmetri i midten af logoet hvilket gør at øjet snubler lidt over det, derfor er det også altid placeret centralt, da det skaber balance i siderne. Vi har valgt at bruge bogstaverne fra vores navne som en visuel repræsentation af at vi alle bringer noget vidt forskelligt til samarbejdet. 3

Hoved idéen bag websitet: Vores website proces har haft op og ned ture, da vi startede med at lave et fuldt parallax scrolling website til vores fiktive virksomhed Toramada. Det så godt ud og websitets basic struktur var bygget, dog syntes vi der manglede noget. Sitet var bygget uden menubar, og det gjorde at vi ikke kunne fremvise de projekter som Toramada skulle bruge for at opbygge sin visuelle identitet. Det nye site er opbygget af HTML5, CSS3 og JS, det skulle være nemt at bruge, designmæssigt indeholde Toramada's stærke design kompetencer, og være med på den nyeste responsive webmode. Det vil sige at vores website et kompatibel med smartphones og tablets, og vises med menu bar uden at skulle zoome, trække og trykke. Design af hjemmeside: For at bygge vores virtuelle identitet har det været vigtigt at følge nogle forskellige design regler " Simplicity can be surprisingly effective". Som skrevet i metode afsnittet gør vi brug af forskellige metoder og teorier. For vores website, som er noget af det første brugerne/kunderne ser hvis de søger web/film design, er det meget vigtigt at give den eventuelle nye kunde det rigtige indtryk. Vi skal vise at vores design er stærkt, betydningsfuldt, og simpelt. 4

Farveversioner Vores logo findes i versioner af hvid og af sort. Den sorte version af logoet er den version der primært bliver brugt på vores hjemmeside, i vores spil og på vores Facebook side. Den hvide version af logoet bliver brugt steder hvor det sorte logo ikke vil være genkendeligt, på sorte og meget mørke overflader. Logoet skal ikke eksistere i flere farver, vi går efter et klassisk look. 5

Webdesign: Da vores site er fuldt responsive, ville det ikke være relevant at vise pixel mål på alting, da de selv scaler op og ned alt efter hvor stor opløsning brugeren har på sin skærm, og hvor stort brugeren har gjort browser viduet. Brug af farver på forsiden: 6

Videoen. Visuelle tanker: Vores visuelle tanker filmen, er at alting foregår i et cartoonish eventyrs univers, og det har vi så designet alt visuelt efter. Stil: Da vi arbejdede efter holde stilen cartoonish igennem hele filmen, gjorde vi stor interesse i at sørge for vores scener, ting og karakterer havde de rigtige teksturer. F.eks. lavede vi om på vores soldats trøje ind i photoshop, så han passede ind i beskrivelsen af det originale eventyr om at have blå bukser, rød trøje med hvidt bånd, og brune støvler. Her ændrer vi soldatens trøje i photoshop: 7

Special effects: I vores film er der brugt en del effekter, vi har blandt andet brugt depth of field en del på vores kamera i iclone, da det er med til at skabe rigtig god dybde i hver scene vi har. Det er blandt andet det der med til at vise når der er fokus skift i nogle af scenerne. Vi har også skiftet imellem linsen på kameraet i filmen, for også at forstærke dybde følelsen. Desuden har vi tilføjet glow-effekt på mønterne i filmen, for ligesom at fremhæve deres værdi. Så har vi fra 02:27:18 til 02:34:01, tilføjet effekten After Shake som er et plugin vi har downloadet fra VideoCopilot, så det får den rigtige ryste effekt når pølsen kommer flyvende ind. Og fra 00:15:03 til 00:19:06 tilføjet vores titel på filmen, så den kommer frem i takt med at soldaten går forbi. Det er lavet ved at tage teksten og så bruge en mask i after effects, keyframe den så det passer med at det kommer frem, når soldaten går forbi. 3D: Filmen er animeret i iclone, hvor en del af vores sets og props er sat op og lavet i Maya, inden de er ført igennem 3Dxchange for at vi kunne bruge dem i iclone. Grunden til at vi lavede vores props i Maya, er at Maya er et meget mere brugervenligt og bredere 3D-program, hvilken gjorde at vores props blev meget flottere end hvis vi skulle have lavet det ved hjælp af iclone. (evt. billede-eksempler på props vi har lavet) Og grunden til at filmen er animeret i iclone, og ikke Maya, er at det er meget mere tidsbesparende at animere i iclone, da iclone har indbyggede karakter controls og premade motions som vi kunne bruge og skærer til som vi havde lyst. 8

Motion Design Beskrivelsen af hvordan vores 3D logo på 10 sek. er lavet Programmet brugt til vores 3D version af vores logo er After Effects. Først er vores logo genereret i et plugin til After Effects kaldet Element 3D, som selv kan tracke logoet, og lave det til 3D. Derefter bestemte man udseendet vha. indbyggede hjælpemidler i Element 3D. Så skulle animationen laves til vores logo, så det kommer flyvende ind som det gjorde, og det blev gjort ved først at, aktivere Multi-Object i Element 3D, derefter blev Z-positionen for logoet sat på -2000, for at sørge for det var ude af framet, og derefter blev det keyframet til 0. Desuden blev Rotation Random - endnu en setting i pluginnet, sat til +300 grader, og derefter keyframet til 0, til sidst i animationen. Scatter Multi blev sat til 26,31 i starten og derefter keyframet i samme frame som de andre indstillinger til 0, 5 sekunder inde i videoen. Så lavede vi baggrunden ud af et billede taget fra google, hvorefter effekten CC Light Burst 2.5 blev sat på. Intensity sat til 2740,0 - Ray Length sat til 16,0, Burst Center, og herefter er Center bare keyframet rundt omkring på billedet, over videoens længde, så det skaber et langsomt bevægende lys. Desuden er Opacity keyframet fra 0% til 100% det første sekund. Så er der sat 2 Lights ind i scenen. Den første er et Ambient Light, som først er sat til 18% intensity, for at skabe lidt ekstra lys over det hele, hvorefter til sidst er Intensity keyframet fra 18% til 106% imellem 8. og 9. sekund. For at få logoet til at lyse kraftigt op. Andet Light er et Point Light, som bevæger sig hen over logoet når det er landet, vha. keyframes. Så er der sat vores navne ind under Logoet, når det er landet. De kommer frem vha. effekten CC Light Sweep, hvor settingsne er: Shape - Smooth, Width 146, Sweep Intensity 63, Edge Intensity 25, Edge Thickness 2,20, Light Color - Hvid, Light Reception Cutout. 9

Hvorefter for hvert navn, er Center, i effekten, keyframet sådan at navnene kommer frem samtidigt med at Point Light kører hen over logoet, op over navnene. Til sidst er der sat 2 forskellige greenscreen effekter ind. Første er en gratis partikel-effekt, optaget på en green screen. Den er sat ind bag logoet så den er timet med at flyve op med partikler, når logoet rammer baggrunden. Green screen er fjernet vha. effekten Keylight(1.2), hvor man trykke på Screen Colour og så på det grønne i video filen. Anden greenscreen effekt, er røg der breder sig ud på skærmen, også optaget på green screen og gratis. Samme metode er brugt til at fjerne den grønne baggrund i filen, og derefter er røg-effekten også timet med at flyve ud når logoet rammer baggrunden. 10