Kommunikation og design Ugeopgave 38 Website. Sarah Winther, Hold B

Transkript

1 Kommunikation og design Ugeopgave 38 Website Sarah Winther, Hold B

2 Dato: 18 sep Kunde: Subsero Projekt: Ugeopgave 38 Kreativ Brief Case: Digitalt bureau: Hvem er afsenderen? Sarah Winther (Multimediedesigner) Hvad er formålet? At vise mine kreative og grafiske evner, min erfaring og personlige kompetencer Hvem er målgruppen? Bureauet Subsero Et 14 år gammelt digitalt bureau En lille gruppe af kreative personer (7 personer) Hvad tænker målgruppen om os nu? Jeg er en ung, engageret multimediedesigner med erfaring i Photoshop og InDesign Hvad vil vi gerne have målgruppen skal tænke om os? At jeg er en sød, erfaren, kreativ person og er lige det de leder efter At jeg kan tage en udfordring op, arbejde selvstændigt og jeg personligt ville passe godt ind i deres team af 7 kreative personer Hvad er budskabet? (Kort og præcist som fx et slogan/tagline) Jeg er en kreativ, udadvendt, engageret og altid klar til at tage en udfordring op. Jeg studerer multimediedesign og har meget erfaring med Photoshop, InDesign og Illustrator. I will give you something unexpected Hvordan er vores kommunikation? (Stil og tone) Moderne (ikke for mange farver) Ren (ikke for mange billeder, forskellige/ ulæselige fonts) Feminint/ elegant (Lilla/ sort er farvekontrasterne) Præcis og organiseret (De forskellige sider forvirrer ikke læserens øjne og er meget enkel og lige til ) Via hvilke medier kommunikerer vi? (Fx web, tv, outdoor, annoncer) Kommunikere gennem web og Facebook (På hjemmesiden kan man trykke sig ind på dem) Telefon Sælges mig selv gennem kontakter og outdoor møder mennesker Er der særlige krav eller begrænsninger til opgaven? Kreativ grafiker, studentmedhjælper, styr på spatiering og pixels, starte snart, studerer interaction design, digitalt design eller multimediedesign.

3 Metoder til ide og koncept generering Brainstorm: - Jeg startede processen ved at lave en brainstorm. - Denne metode er god at anvende, da der kan skabes mange ideer, og i denne face er ingen ideer dårlige. - F.eks da jeg skulle lave mit Style- Guide. Jeg satte mig ned og lavede noget research, og skrev ideerne ned. Mindmap: - Denne metode gav mig et bedre overblik over min ideer. - Her tegnede jeg mine ideer, så jeg kunne se det visuelle billede. - F.eks da jeg skulle lave mit Visuelle Design. Jeg havde skrevet nogle ideer ned, men nu begyndte jeg at tegne dem, så jeg rigtig kunne se det for mig.

4

5 Responsive Designpattern Hvilket designprincip har du valgt? Responsive designprincip - Jeg har valgt designprincippet Layout Shifter - Jeg har valgt dette, da det mønster gør mest for at tilpasse sig forskellige skærmstørrelser - Derudover mener jeg, det er det letteste designprincip at finde rundt på de forskellige skærmstørrelser

6 Wireframes nav Logo (Til forside knap) About Portfolio Career Contact søg... Desktop landingpage Navigationen/ menuen skal følge siden der man ruller ned Logo (Sarah Winther) (multimediedesign) Navigations-pil section_about Baggrundseffekter logo Aboutbillede Abouttekst section_portfolio (Portfolio) logo image image image image image image section_career (Career) logo Shapes med tekst Shapes med tekst Shapes med tekst section_contact logo Faded sort farve ( + Facebook) Footer- (copyright)

7 Wireframes nav Landingpage About Portfolio Career Contact Logo SARAH WINTHER Multimediedesigner Logo Tablet section_about Billlede (mig) (omg mig) section_portfolio Portfolio image image image image image image section_career Career Shapes med tekst Shapes med tekst Shapes med tekst section_contact Faded sort farve ( + Facebook) Footer: (copyright)

8 Wireframes SARAH WINTHER Mobil (IPhone 6) Landingpage section_about Forside About Portfolio Career Contact Logo Image Text Portfolio section_portfolio section_career Career section_contact Text Footer

9 Style Guide

10 Visuelt design Desktop Tablet Mobil (Iphone 6) søg...

11 Header - Logo Nav - About, Portfolio, Career, Contact Layoutdiagram Section_about -.wrapper -.aboutbillede (mig) -.abouttekst (info om mig) Section_portfolio -.portfoliotekt ( Portfolio ) -.wrapper - 3 x.portfolio - 3 x.billede Section_career -.wrapper - 3 x.careerbillede Section_contact -.wrapper Footer -.copyright

12 Refleksionsafsnit Komposition - Stjernekomposition: Min forside hvor alt peger ind mod midten - Whitespace: På hele min hjemmeside er der meget luft, og der sker derfor ikke noget over det hele. Den har ikke en dannebrogseffekten. - Symmetrisk: Min hjemmeside er meget symmetrisk, da alt står meget i midten/centrum og lige fordelt på vær side. Gestaltlove - Forbundethed: Min navigation (About, Portfolio, Career, Contact), da de er fobundet og ses hørende sammen. - Nærhed: F.eks. på min forside hvor mit logo, mit navn og Multimediedesign opfattes hørende sammen, da de står nær hinanden. - Lukkethed: F.eks på min Portfolio side hvor mine billeder/ projekter som står i samme ramme hører sammen. Kontraster - Størrelseskontraster: Der er f.eks. størrelseskontrast på forsiden, da elementerne på siden er forskellige størrelser - Farvekontraster: Der er også farvekontraster på min hjemmeside. F.eks meget med sort/hvid/grå og lilla - Formkontraster: Har også forskellige former på min hjemmesiden f.eks. firkanter og 6-kanter osv. - Styrkekontraster: Der forekommer også styrkekontaster f.eks. på forsiden hvor det er en mørk baggrund med hvid skrift og logo, så man lægger mere mærke til det. Typografi - Anvender forskelligt typografi, som også kan ses på min Style-Guide. Dog er de ikke så forskellige, at det er meget i øjenfaldende, da jeg mener det enkle er mere elegant.