GRAFISK WORKFLOW PHILIP CREAMER AARHUS TECH SVENDEPRØVE NOVEMBER 2016

Transkript

1 GRAFISK WORKFLOW PHILIP CREAMER AARHUS TECH SVENDEPRØVE NOVEMBER 2016

2 grafisk WORKFLOW // DOKUMENTATION opgaven // Jeg har i min opgave lavet et responsive onepage website for et årlig event kaldet Dirt Days, som er et arrangement for Mountain Bikere der hvert år kan deltage sig til forskellige events og konkurrencer rundt omkring i Danmark. Målgruppe // Min målgruppe er til Mountain bikere mellem år. Med passion og fælleskab samt konkurrence indenfor Mountain Biking. BUDsKAB // Budskabet er at lave en overskuelig og brugervenligt website. Som er indbydende og og vækker interresse. Samt at informere tilskuer og kunder om eventet. PRocessen // Brainstorm Moodboard Flowchart Skitser Farvevalg & Symbolik Google fonts Seo Udgivelse Færdig produkt responsive WEBsite // Jeg har lavet website responsiv, så den vises korrekt i alle opløsninger på computerskærme. Derudover er den også optimeret til at kunne vises Ipad. Når den kommer under 768 px i bredden tilpasses websitet diverse smartphones. Google fonts // Jeg har valgt fonten Open Sans. Da den er er overskuelig og læsevenlig font, som skaber en god dynamik igennem hele websitet. Fonten er en Sans Serif. USABILITY // Websitet er nemt at navigere rundt på, da det er enkelt og er overskueligt opbygget. Tekst kortet ned for let tilgængelig læsning for besøgende på websitet. søgemaskineoptimering - SEO // Jeg har i forbindelse med min opgave været inde og lave SEO optimering på websitet, for at øge chancen for at blive fundet på Google. Dette er gjort ved brug af meta-tags. DIGITAL BILLEDOPTIMERING // Alle billeder der er blevet brugt på hjemmesiden har været igennem Photoshop, her er de blevet optimeret til 72 ppi, og gemt ned som PNG filer, som er standarden for billeder til digitalt arbejde. browser kompatibilitet // Websitet er testet og virker korrekt i følgende browsere. Internet Explorer Google Chrome Mozilla Firefox KVALITETSVUrderING // Jeg er meget tilfreds med min opgave. Jeg synes jeg har løst opgaven og gjort det brugervenligt. Dog kunne jeg godt ønske at jeg havde nået at optimere hjemmesiden så den kunne vises korrekt på tablet. anvendte programmer // Adobe Dreamweaver CC Adobe Photoshop CC Filezilla SIDE 2

3 grafisk WORKFLOW // BRAINSTORM DIRT DAYS MOUNTAINBIKE NATUR SKOV PASSION EVENTS KONKURRENCE FÆLLESKAB RACE SIDE 3

4 grafisk WORKFLOW // MOODBOARD SIDE 4 Kilder: Google

5 grafisk WORKFLOW // FLOWCHART INDEX INFORMATION EVENTS KONTAKT SIDE 5

6 grafisk WORKFLOW // Skitser body 2. section section 8 3. section_info 9 4. section_event 5. section_contact section_info logo (img) 7. menu (nav) 8. h1 9. countdown timer 10. h mtb_info ( img ) 12. text ( <p> ) section_event h3 14. h4 15. mail form footer 17. h5 section_contact SIDE 6

7 grafisk WORKFLOW // FARvevALG & SYMBOLIK OVErvejede FARVER VALGTE FARVER ORANGE MØRKEGRÅ #F79c26 #828f86 #5d0d19 #1025fb #ecdbbd VARME SIKKERHED ENERGI STABILITET UNGDOMMELIG NEUTRAL BALANCE PÅLIDELIGHED AMBITIONER TIDSLØSHED #a5fc28 #43fffe # #fb0016 #2efd25 FARVEVALG Jeg har på websitet valgt at benytte farverne Orange & Mørkegrå for at give både en varm og kold kontrast i mellem farverne, hvilket fungere rigtig godt, da farverne spiller godt sammen på websitet og de er behagelige at se på, hvilket øger chancen for at kunden bliver på siden. SIDE 7

8 grafisk WORKFLOW // GOOGLE FONTS OPEN SANS Jeg valgte at bruge Open Sans som den eneste font på websitet, da jeg ønskede en rød tråd igennem hele siden. Det skulle derfor være en enkelt og læsevenlig font. Fonten er hentet via Google Fonts, og ligger i mit stylesheet (CSS). SIDE 8

9 grafisk WORKFLOW // SEO SEO På websitet har jeg valgt at lave SEO (Søgeoptimering) Da det er en vigtig faktor for at for at blive fundet på Google. Derfor har jeg lavet følgende meta-tags (description, keywords & author) SIDE 9

10 grafisk WORKFLOW // Udgivelse Jeg har brugt programmet Filezilla til at uploade websitet. Det er et bruger nemt FTP program. Det er et overskuelig og nemt at finde rundt i, og det giver et godt overblik over mappe strukturen på ens website. SIDE 10

11 grafisk WORKFLOW // FÆRDIG PRODUKT SIDE 11