|
|
- Thoralf Knudsen
- 6 år siden
- Visninger:
Transkript
1 Rapport obligatorisk oppgave 08 INTERACTIVE INFOGRAPHIC WEBSITE
2 Obligatorisk oppgave 08 : Interactive Infographic Website Oppgaven gikk ut på å lage en hjemmeside som inneholder interaktiv infografikk som tar oss gjennom noen av stilepokene de siste 50 årene; Abstrakt Ekspresjonisme, Swiss Style, Popart og Psykedelisk. Vi skulle bruke et spesifikt objekt eller element for å visualisere denne reisen gjennom tid, hvor objektet skulle endre seg gjennom de forskjellige stilepokene. Vi skulle også ha med noe fakta om hver epoke. Jeg valgte å bruke en kortstokk når jeg skulle illustrere denne reisen, og endret designet på kortene for hver stilepoke. Jeg ønsket av brukeren av hjemmesiden skulle kunne snu kortene for å se både forsiden og baksiden av hvert kort, og at dette skulle være en interaksjon på hjemmesiden. Research og arbeidsprosess Oppgaveteksten inneholdt en anbefaling for hvordan vi kunne fordele arbeidet på de fire ukene som var satt av til oppgaven, og jeg valgte å følge denne til en viss grad. Uke 1: Planlegging og research. Jeg begynte med brainstorming for å finne frem til et produkt jeg ville bruke til infografikken, og hvordan jeg skulle presentere dette på en hjemmeside. Jeg gjorde søk på internett for å finne inspirasjon til infografikk, interaktive hjemmesider og fakta om de forskjellige stilretningene, og laget moodboards av bilder jeg fant på internett. Uke 2: Design; idé, konsept, skisser, wireframe, prototype. Her begynte jeg skisseprosessen etter at kortstokk var valgt som mitt objekt. Jeg begynte med anologe skisser av hvordan kortene skulle se ut, og hvordan jeg skulle presentere disse på hjemmesiden. Deretter fortsatte jeg skisseprosessen digitalt i Illustrator og Photoshop, hvor jeg utviklet designet på kortstokken, og etterhvert det ferdige resultatet av hvordan kortene skulle se ut. Vi kunne velge mellom to målgrupper for denne oppgaven; Studenter som studerer media og kommunikasjon eller en profesjonell gruppe klienter. Jeg valgte den siste gruppen, noe som legger til rette for en formell tone både for det visuelle og for teksten. Hjemmesiden må derfor være strukturert og oversiktilig med et enkelt, rent og profesjonelt design uten forstyrrende elementer og unødvendige detaljer. Hadde jeg valgt den andre målgruppen kunne jeg laget et mer lekent og fresht design. Uke 3: Utvikling av siden; bygge strukturen, kode, lage interaktivitet. Siden det er lenge siden jeg programmerte en hjemmeside trengte jeg en del oppfriskning på emnet. Jeg brukte en del tid på læringsvideoer hos Lynda.com og på å lese gjennom notater fra tidligere i studiet som omhandler html og css. Jeg laget også tegninger og wireframes av hvordan hjemmesiden skulle bygges opp, ved hjelp av Illustrator og Photoshop. Da jeg skulle lage selve hjemmesiden tok jeg først utgangspunkt i en template hos One. com (hvor jeg har et domene som jeg bruker i studiesammenheng). Dette var med på å friske opp litt kunnskaper om å bygge en hjemmeside, men var også ganske begrensend. Jeg gikk deretter over til å kode en side fra begynnelsen av i Dreamweaver for å få det designet og de funksjonene jeg ønsket. Når jeg først kom inn i programmeringen igjen var det bedre å jobbe i Dreamweaver enn i en template hos One.com. Jeg valgte en fixed hjemmeside da en har mer kontroll over designet på siden på denne måten; siden vises likt i alle nettlesere, uten at størrelsesforhold og annet endrer seg. Den interaktive biten var jeg først usikker på hvordan jeg skulle løse for å få noe mer enn klikkbare linker som førte til de forskjellige sidene. Jeg laget noen animasjoner av kortstokker som blir delt ut, men jeg fikk de kun til å virke ved at de åpnet seg i et nytt vindu (ikke på den eksisterende siden som jeg ønsket). Javascript har jeg ikke noen kunnskap om heller, så jeg holdt meg til html og css. Jeg fikk bygge opp strukturen til siden, og plassert tekstbokser og bilder der de skulle være i forhold til hverandre. Uke 4: Legge ut hjemmesiden på nett; siste finpuss, overføre til server, testing, evaluering, rapport. Den siste uken ble det gjort en del justeringer av både hjemmesiden og designet på kortene. Strukturen på siden forble den samme, så jeg endret bare på farger og bilder. Jeg fikk også lagt på interaktivitet ved at kortene snudde seg ved mouseover. 2 Rapport Interactive infographic website Interactive infographic website 3
3 4 Rapport Interactive infographic website Interactive infographic website 5 Psychedelic, bilder fra: Wes Wilson Wes Wilson http-_transpersonalspirit.wordpress.com, Moscoso Swiss Style, bilder fra: Müller Brockmann Richard Lohse Müller Brockmann Hofmann Müller Brockmann Müller Brockmann Popart, bilder fra: Lichtenstein James Rosenquist Andy Warhol James Rosenquist Lichtenstein James Rosenquist Abstract Expressionism, bilder fra: Kline Gottlieb Pollock Pollock De Kooning Rothko Moodboards
4 Blyanskisser Brainstorming Skisser design 6 Rapport Interactive infographic website Interactive infographic website 7
5 Screenshots Skisser hjemmeside 8 Rapport Interactive infographic website Interactive infographic website 9
6 10 Rapport Interactive infographic website Interactive infographic website 11
7 Digital skisse i Photoshop Digital skisse i Photoshop 12 Rapport Interactive infographic website Interactive infographic website 13
8 Designvalg Kortene har fått design tilpasset de forskjellige stilepokene, hvor jeg har brukt typiske kjennetegn fra hver stilretning. Fargevalget mitt er hentet fra korstokken; rødt, hvitt og svart, og med innslag av grått på hjemmesiden. Abstrakt Ekspressjonisme Stilretning som oppstod i Amerika på 1940-tallet, også kalt Action Painting, American-style painting og Color field. Følelser er et viktig stikkord når det gjelder Abstrakt Ekspresjonisme. Kunsten innenfor denne stilretningen er subjektivt søkende, og det ble benyttet sterke og intense virkemidler for å få frem kunstnerens indre følelser og underbevisshet. Det finnes tydelige likhetstrekk fra både den europeiske ekspresjonismen, og også surrealisme. Typografi Jeg har brukt fonten CF Hounted House fordi denne er bygget opp av kjappe penselstrøk som jeg synes passer godt til designet. Swiss Style Stilretningen utviklet seg i Sveits på slutten av 1940-tallet og utover på 50-tallet. Swiss Style blir også kalt International Style og International Typographic Style. Typografi var nemlig en stor del av denne stilretningen, og sans serif skrifttyper som Akzidenz Grotesk (forgjengeren til Helvetica) og Geneva var mye brukt. Teksten var ofte venstrestillt med bølgende høyreside, og bruk av grid var svært viktig. Enkelt utrykk kjennetegner Swiss Style, samt sort-hvitt foto kombinert med tekst. Geometriske former og klare sterke farger er også typisk for denne stilretningen. Typografi Her har jeg brukt en av de mest kjente fontene fra Swiss Style, nemlig Helvetica. Denne gir assosiasjoner til stilretningen, og bokstavene på kortene (J, K, Q og A) er venstrejustert. CF Hounted House abcdefghijklmnopqrstuvwxyz A B C D E F G H I J K L M N O P Q R S T U V W X Y Z * # % & / ( ) =?!., - Helvetica abcdefghijklmnopqrstuvwxyzæøå A B C D E F G H I J K L M N O P Q R S T U V W X Y Z Æ Ø Å * # % & / ( ) =?!., - 14 Rapport Interactive infographic website Interactive infographic website 15
9 Popart Popart begynte på slutten av 1950-tallet, men hadde sin storhetstid på 60- og 70-tallet. Det som kjennetegner stilepoken er fokus på det anonyme, mekaniserte, masseproduserte bildet fra reklame, tegneserier og TV, og også bilder av kjente personer. Kunstnerne tok gjerne objekter ut av sitt opprinnelige miljø, og gjengav dem i utradisjonelle materialer og format. Et kjent eksempel på dette er Andy Warhols Campbell Soup bilder. Sterke og klare farger er typisk for perioden. Typografi Jeg valgte fonten Badaboom som jeg synes representerer Popart godt, da det er en font som gjerne er typisk for tegneserier og som vi ofte ser tilsvarende av i kunst fra denne perioden. Badaboom a b c d e f g h i j k l m n o p q r s t u v w x y z * # % & / ( ) =?!., - Psykedelisk Psykedelia oppstod i San Francisco i hippie-tiden på 60-tallet. Navnet på stilretningen kommer fra virkningen av de hallusigene narkotiske stoffene som var populære på denne tiden, og kunsten skulle fange og visualisere følelsen av å være høy. Kaleidoskopiske mønstre, spiraler, sterke farger og kontraster, optisk effekt av vibrerende linjer, tekst og bokstaver gjort nærmest uleselige og surrealistiske emner kjennetegner stilepoken. Jeg har valgt å bruke vibrerende linjer, kontrast mellom rødt, hvitt og sort, organisk deformert tekst. Typografi Her har jeg valgt fonten Bellybeans som minner meg om hippietiden hvor denne stilepoken oppstod. Bellybeans abcdefghijklmnopqrstuvwxyzæøå A B C D E F G H I J K L M N O P Q R S T U V W X Y Z Æ Ø Å * # % & / ( ) =?!., - 16 Rapport Interactive infographic website Interactive infographic website 17
10 Hjemmeside Designet på hjemmesiden har jeg holdt veldig stilrent og enkelt, hvor whitespace er viktig og illustrasjonene har hovedfokuset. Enkel og tydelig header med en liten twist ; spar-symbolet istendenfor O en i journey. Horisontal meny med mouseover og valgt effekt (skifter farge), og en enkel horisontal rekke med illustrasjoner under. Fakta-delen kommer rett under bildene. Bakgrunnsfargen er en dempet lys grå som er lik på hele siden for å samle den til en helhet. Illustrasjonsbildene på undersidene har mouseover-effekt med at kortet snus når en holder musepilen over. Alt innhold har en margin på 40px fra venstre for å oppnå en bra komposisjon. Farger Fargene på hjemmesiden er hovedsaklig grått og sort for å danne en nøytral bakgrunn for infografikken. Fargen rødt og hvitt er i tillegg representert i illustrasjonene for en fin kontrast. Typografi Jeg har valgt enkel og tydelig typografi, med Arial til overskrifter, og Verdana til brødtekst. Arial abcdefghijklmnopqrstuvwxyzæøå A B C D E F G H I J K L M N O P Q R S T U V W X Y Z Æ Ø Å * # % & / ( ) =?!., - Verdana abcdefghijklmnopqrstuvwxyzæøå A B C D E F G H I J K L M N O P Q R S T U V W X Y Z Æ Ø Å * # % & / ( ) =?!., - 18 Rapport Interactive infographic website Interactive infographic website 19
11 Egenevaluering, Utvikling og Prosess Det å jobbe med webdesign igjen når det er nesten ett år siden sist var en utfordring. Jeg måtte gå gjennom og friske opp kunnskapene grundig, både ved hjelp av Lynda-videoer og notater jeg har gjort tidligere. Først var det veldig skremmende å skulle begynne å programmere igjen, men når jeg først kom i gang kom mye kunnskap fort tilbake. Jeg er fornøyd med resultatet, men når det gjelder responsiv design så kan jeg ikke nok om dette. Skulle jeg gjort denne oppgaven bedre hadde jeg kanskje valgt å bruke en forholdsvis tom Wordpress template hvor alt må kodes, men hvor det er lagt inn koder for responsiv design. Jeg hadde godt av å friske opp disse kunnskapene, og det var kjekt å gjøre programmering igjen. Tiden har jeg disponert bra, men jeg har brukt noe mer tid på designet enn det som er foreslått i oppgaveteksten. Dermed begynte programmering litt sent, og jeg har hatt circa en uke på dette. Kildehenvisninger og referanser Lynda-videoer: Infographics: Planning and Wireframing, with Shane Snow Html Essential Training CSS Fundamentals Designing websites from Photoshop to Dreamweaver Websider: Fakta om Abstract Expressionism Fakta om Swiss Style Fakta om Popart Basics.htm Fakta om Psychedelic Inspirasjon, infografikk (en artig sak om infografikk) 20 Rapport Interactive infographic website Interactive infographic website 21
12 Endringer Kortene ligger nå med bildesiden opp og snues til baksiden når en fører musepilen over istedenfor omvendt. Jeg har også forsøkt litt forskjellig med tekst-feltet, og endte opp med alternativ 3: Alt. 1 Alt. 3 Alt. 2 Alt Rapport Interactive infographic website Interactive infographic website 23
- Pop Art - Swiss - Abstrakt ekspresjonisme - Psychedelia
Rapport oblig-08 Interactive infographics Innledning Oppgaven var å designe en nettside som skulle vise fram fire ulike design stiler. De fire forskjellige stilene skulle vises fram på et produkt eller
Detaljerrapport obligatorisk oppgave 05
rapport obligatorisk oppgave 05 Ferdig produkt obligatorisk oppgave 05 illustrasjon / foto I denne oppgaven skulle vi finne en gjenstand fra før 1970, og lage en reklameplakat for denne. Plakaten skulle
DetaljerObligatorisk oppgave 02. One product Four decades
Obligatorisk oppgave 02 One product Four decades 20-tallet Plakat og emballasje-etikett 50-tallet Plakat og emballasje-etikett 70-tallet Plakat og emballasje-etikett 80-tallet Plakat og emballasje-etikett
DetaljerObligatorisk oppgave.04 BOOK DESIGN
Obligatorisk oppgave.04 BOOK DESIGN Obligatorisk oppgave 04: Book Design Oppgaven gikk ut på å lage en layout til boken Typography From the East ved å fokusere på bokstaver, tekst og typografi. Vi skulle
DetaljerTilleggsoppgaver. Avslutning
Dette dokumentet er laget i formatet 1920x1080px og vi anbefaler å åpne PDF filen i fullskjerm. Til å navigere anbefaler vi å bruke piltaster (høyre/venstre) eller pilene vi har lagt til i dokumentet.
DetaljerMandatory Assignment 04 Layout
Mandatory Assignment 04 Layout Forhåndsord og arbeidsbeskrivelse: Den 4 oppgaven går ut på å lage en oppdiktet kokebok. Vi skal designe layouten på boka og vise eksempler på hvordan sidene i boka skal
DetaljerRapport Oblig 08 - Flash galleri og banner.
Rapport Oblig 08 - Flash galleri og banner. De siste ukene på skolen har vi lært om Flash. I denne oppgaven skulle jeg bl.a lære grunnleggende scripting og koding for webbaserte medier, lære om interaktivitet
DetaljerRAPPORT WEBP MAGNE SILJAN
RAPPORT WEBP MAGNE SILJAN -12.12.13 INNLEDNING TOLKNING AV OPPGAVEN Tolkingen av oppgaven var at det skulle utvikles en webside for en klient (firma, organisasjon eller et annet prosjektområde). Websiden
Detaljerrprt aug 11 SILJE WOLD obligatorisk oppgave
rprt aug 11 obligatorisk oppgave 08 22.04.2012 SILJE WOLD inspirasjon /skisser Søket etter inspirasjon foregikk blant annet på internett, i tegneserier og blader. Det er finnes mye bra og en del mindre
DetaljerProsjekteksamen - Web
Prosjekteksamen - Web Helga Westerheim Hus i Varmen 20.09.2013 snellfotoblogg.com 1 KORTFATTET SAMMENDRAG Det ferdige produktet skulle være en web-/skjermbasert presentasjon utarbeidet i HTML eller Flash
DetaljerRapport Oblig. 07 Fotoserie: Musiker. Laila-Marie Aanensen, jan. -12
Rapport Oblig. 07 Fotoserie: Musiker Laila-Marie Aanensen, jan. -12 INNLEDNING TOLKING AV OPPGAVEN Jeg skal i denne oppgaven jobbe med et fotoessay som skal portrettere en person. Dette skal være en foto-serie,
DetaljerOrganiser rapporten din omtrent sånn, og vurder i vei
Organiser rapporten din omtrent sånn, og vurder i vei 1. Forside - Navn + nettadresse til siden din. 2. Innledning (kort) - Oversikt over prosjektoppgaven. (Ta utgangspunkt i oppgaveteksten. Eks: Vi har
Detaljerinnenfor grafisk design i fremtiden. Dette fordi jeg selv ønsker at jeg en dag vil bli en av dem.
RAPPORT - INFOGRAFIKK 1. HVA GIKK OPPGAVEN UT PÅ? Ved bruk av opptaksprøvene til Westerdals, så valgte jeg en oppgave som gikk ut på å benytte infografikk for å vise høyskolens utvikling. Men siden jeg
Detaljer1. semester Akademisk uke Dag Modul 20.08.12 Mandag 21.08.12 Tirsdag Studiestart
Aug_2011 1. semester Akademisk uke Dag Modul 20.08.12 Mandag 21.08.12 Tirsdag Studiestart 22.08.12 Gra 101 Onsdag 23.08.12 Grafisk Design 1 Torsdag 24.08.12 1 Fredag 25.08.12 Lørdag 26.08.12 Søndag 27.08.12
DetaljerAktivitetsplan - Adobe Pro kurs Infografikk våren 2015
Aktivitetsplan - Adobe Pro kurs Infografikk våren 2015 Hva er nytt i Adobe CC2014 Adobe CC har mange flotte nyheter i InDesign, Illustrator og Photoshop. Vi vil guide deg gjennom nyhetene på en effektiv
DetaljerDESIGNMANUAL 2015. Arbeiderpartiet.no
DESIGNMANUAL 2015 Designmanual for arbeiderpartiet I dette dokumentet finner du råd, tips og prinsipper for hvordan Arbeiderpartiet skal framstå visuelt; På nett, i trykksaker og i andre sammenhenger hvor
DetaljerInnledning. Sjanger og målgruppe 4 Budskap 5. Typografi 7 Farger 8-9
Profilmanual 1 2 3 Innledning Denne profilhåndboken er skrevet for å gi deg informasjon om Noroff House Mafias grafiske profil. Denne boken skal fungere som en bruksanvisning til forskjellige valg man
DetaljerPROSJEKTEKSAMEN. Innhold: GRA 1. Brief s Prosess s Designvalg s Egenevaluering s. 12 A V E S P E N S U S O R T.
GRA 1 PROSJEKTEKSAMEN PROSJEKTEKSAMEN A V E S P E N S U S O R T Innhold: Brief s. 2-3 Prosess s. 4-7 Designvalg s. 8-11 Egenevaluering s. 12 Side 1 BRIEF Jeg skal lage en logo og en visuell identitet til
DetaljerAktivitetsplan - Adobe Pro kurs Infografikk høsten 2015
Aktivitetsplan - Adobe Pro kurs Infografikk høsten 2015 Hva er nytt i Adobe CC 2015 Adobe CC har mange flotte nyheter i InDesign, Illustrator og Photoshop. Vi vil guide deg gjennom nyhetene på en effektiv
DetaljerDet var ikke lov til å bruke tekst på plakaten og den skulle ha målene 50 70 cm, en
INNLEDNING Denne oppgaven går ut på å velge en musiker,gruppe eller et orkester og lage en visuell presentasjon av en av deres sanger. Ved å illustrere sangens mening og lage en original ide, vil det gi
Detaljerdreamweaverflash bridge typografi photoshop label masse som struktur film indesign indesign logo komposisjon webside den daglige tegningen steampunk
inal adobe cut cs3 til nå... den daglige tegningen webside indesign indesign komposisjon dreamweaverflash typografi label photoshop Z steampunk Z logo film bridge masse som struktur typografi: Typografi
DetaljerDesign. Manual. Mynte Medier. Svein Erik Rusten
Design Manual Svein Erik Rusten 2. Innhold Logo Mynte medier logoen Logo Farger typografi 3 6 8 Logoen er bygged opp av de to forbokstavene i med spesialtegnede M er inne i en boks, med bedriftens navn
DetaljerMockba. Medium format. f ndustar-23 100mm tl4.5. Aperture: up to tl32. No. 120 film rolls
Mockba 02 No. 120 film rolls Aperture: up to tl32 Medium format f ndustar-23 100mm tl4.5 RAPPORT GRA2 Mandatory Assignment 05 Illustration/Photo Av Robin Severin Fritzon Innledning Denne oppgaven gikk
DetaljerREFLEKSJON PSYKISK HELSE
REFLEKSJON PSYKISK HELSE 1. HVA GIKK OPPGAVEN UT PÅ? Jeg ble bedt om å være med på å markedsføre Verdensdagen for psykisk helse. Det første jeg tenkte var at dette var rettet mest mot jenter. Derfor burde
DetaljerROSSELAND SKOLE LÆREPLAN I KUNST OG HÅNDVERK 5. TRINN
ROSSELAND SKOLE LÆREPLAN I KUNST OG HÅNDVERK 5. TRINN Årstimetallet i faget: 95 Songdalen for livskvalitet Generell del av læreplanen, grunnleggende ferdigheter og prinsipper for opplæringen er innarbeidet
DetaljerProfilmanual. Grafiske retningslinjer for Handel og Kontor i Norge
Profilmanual Grafiske retningslinjer for Handel og Kontor i Norge Vår visuelle profil Formålet med profilmanualen er å sikre en mest mulig helhetlig og konsekvent bruk av Handel og Kontor i Norge sine
DetaljerDESIGNMANUAL. Funksjonshemmedes fellesorganisasjon
DESIGNMANUAL Funksjonshemmedes fellesorganisasjon Innledning Funksjonshemmedes fellesorganisasjon trengte et visuelt ansiktsløft for å virke mer profesjonelle og for å skape seg en kjennemerke ute på markedet.
DetaljerCSS-formatering: stilark med kommentarer
CSS-formatering: stilark med kommentarer /* Demonstrasjon av stilarkregler. Jeg har satt inn forslag til farger og fonter, men du setter inn dine egne valg selvfølgelig. */ /* Stilregler for html-taggen
DetaljerHjem Om oss Kontakt Style sheet. Hjem Om oss Kontakt Style sheet. Hjem Om oss Kontakt Style sheet. Hjem Om oss Kontakt Style sheet.
HJEM OM OSS KONTAKT STYLE SHEET LIMITLESS - SUNN & ENERGIRIK BAGUETT Limitless inneholder en optimal balanse av karbohydrater, fett og protein for aktive mennesker. Vårt mål er å kunne tilby deg sunn,
DetaljerRapport obligatorisk oppgave 06 - Person, product, natural lighting
Rapport obligatorisk oppgave 06 - Person, product, natural lighting Vi fikk oppgaven til å ta 2 bilder for et reklameshoot. Bildene skulle bli tatt med forskjellige innstillinger og i naturlig lys. Etter
DetaljerVisualisering er den nye grammatikken. Levende bilder utkonkurrerer de lange tekstene... Hvordan kommuniserer vi akademisk kvalitet?
Visualisering er den nye grammatikken. Levende bilder utkonkurrerer de lange tekstene... Hvordan kommuniserer vi akademisk kvalitet? Velkommen til EiT: Modul 1 - Visuell kommunikasjon Karianne Arentz Hagen
Detaljer1 SYMBOL 2 LOGO 3 LOGO FARGEVARIANTER 4 FARGEPALETT 5 TYPOGRAFI 6 EKSEMPLER PÅ BRUK 7 WEB
FORUS DESIGNHÅNDBOK 1 SYMBOL 2 LOGO 3 LOGO FARGEVARIANTER 4 FARGEPALETT 5 TYPOGRAFI 6 EKSEMPLER PÅ BRUK 7 WEB SYMBOL Symbolet til Forus er en pin/markør som skal sette Forus på kartet og som indikerer
DetaljerREFLEKSJONSNOTAT FOR WEBPERIODEN
9. 11. 2010 HEIDI BJELLAND 2MKA REFLEKSJONSNOTAT FOR WEBPERIODEN HØSTEN 2010 Webdesign www.omfoto.net23.net Heidi Bjelland Jeg valgte prosjektoppgave C som var å lage en informativ side om foto. Målgruppen
DetaljerHALVÅRSPLAN I KUNST OG HÅNDVERK TRINN BREIVIKBOTN SKOLE
HALVÅRSPLAN I KUNST OG HÅNDVERK 5. 7. TRINN BREIVIKBOTN SKOLE 2011-2012 Lærer: Tonje Svendsen Læreverk: Ingen spesifikke læreverk Målene er fra Lærerplanverket for kunnskapsløftet 2006 og vektlegger hva
DetaljerGUI/ SYSTEM DESIGNHÅNDBOK. Versjon 1.0 December 2014
GUI/ SYSTEM DESIGNHÅNDBOK Versjon 1.0 December 2014 GUI designmanual Innhold Her beskrives layout og grafisk profil for systemer og tjenester i Landbruksdirektoratet. Designmanualen er utarbeidet av Ciber
DetaljerRetningslinjer for bruk av logo. Norsk Jernbaneklubb
Retningslinjer for bruk av logo Norsk Versjon 2a 24. mars 2004 1. Formålet med dette dokumentet Norsk har mange avdelinger og fora som benytter klubbens profil. For å ha en helhetlig profil og virke som
DetaljerHvordan kan jeg skape en tydelig identitet for Amygdala Design som gjør at aktuelle kunder vil legge spesielt merke til dette fi rmaet?
FORORD Amygdala Design er et nylig oppstartet enkeltmannsforetak som skal utføre tjenester innen webdesign, logodesign og digital kunst. I denne rapporten beskriver jeg identitetsutviklings-prosessen for
DetaljerPROFILHÅNDBOK Versjon 1.13 Februar, 2013
PROFILHÅNDBOK Versjon 1.13 Februar, 2013 INNHOLD INTRODUKSJON 3 LOGO 4 Plassering 5 Varianter 6 Profilering 7 FARGER 8 TYPOGRAFI 9 KONVOLUTTER 10 BREVARK & VISITTKORT 11 BILDER 12 POWERPOINT 13 NETTSIDE
DetaljerRefleksjonsnotat Web.
Refleksjonsnotat Web. www.kildebruk.host22.com Mariell Hagen Hovedoppgaven i Web Webdesign: opphavsrett og bruk av kilder Vi har hatt prosjektperiode i litt over 2 uker. Oppgaven var at vi skulle lage
DetaljerÅRSPLAN I KUNST OG HÅNDVERK 5. 7. TRINN BREIVIKBOTN SKOLE 2011-2012
ÅRSPLAN I KUNST OG HÅNDVERK 5. 7. TRINN BREIVIKBOTN SKOLE 2011-2012 Lærer: Knut Brattfjord Læreverk: Ingen spesifikke læreverk Målene er fra Lærerplanverket for kunnskapsløftet 2006 og vektlegger hva elevene
DetaljerHvordan bruke profilmanualen
Visuell identitet Versjon 1 2016 Introduksjon Hvordan bruke profilmanualen Denne profilmanualen gir retningslinjer for hvilke elementer Friluftslivets uke inneholder og hvordan elementene kan brukes. Retningslinjene
DetaljerROSSELAND SKOLE LÆREPLAN I KUNST & HÅNDVERK 7. TRINN
ROSSELAND SKOLE LÆREPLAN I KUNST & HÅNDVERK 7. TRINN Årstimetallet i faget: Songdalen for livskvalitet Generell del av læreplanen, grunnleggende ferdigheter og prinsipper for opplæringen er innarbeidet
DetaljerRapport Obligatorisk oppgave 03
Rapport Obligatorisk oppgave 03 Obligatorisk oppgave 03 : Door to Door Organics Oppgaven gikk ut på å lage en ny logo og visuell profil for Door to Door Organics i forbindelse med at de skulle starte opp
DetaljerDen profesjonelle standarden for digital bildebehandling.
ADOBE PHOTOSHOP CS2 Den profesjonelle standarden for digital bildebehandling. Adobe Photoshop CS2 er den profesjonelle bilderedigeringsstandarden og det ledende produktet i Photoshops serie for digital
DetaljerGRAFISK PROFILHÅNDBOK
GRAFISK PROFILHÅNDBOK Revidert april 2016 INNHOLD Introduksjon Brand Grafiske elementer Typografi Farger Maler Profilering Digitalt INTRODUKSJON Dette er en revidert versjon av Ifocus Optikk sin profil
DetaljerLæringsstrategi Vøl. -Benytte ulike teknikker til overflatebehandling av egne arbeider
4 Design -Benytte ulike teknikker til overflatebehandling av egne arbeider Læringsmål -Lære å pusse tre - Lære å polere tre -Lære å overflatebehandle tre: beise, male med olje, male med maling - Lære å
DetaljerOblig 2: Oppgave 1. section { width: 50%; height: 30%; margin: 5% 0 0 0; } h1 { color:#000000; font-size:2em;
Oblig 2: Oppgave 1 Hva og hvorfor Jeg har valgt å lage et nettsted basert på relative målenheter. Det vil si at jeg tar i bruk prosent og em istedenfor pixler. For eksempel: section { width: 50%; height:
DetaljerProfilhåndbok. for Troms fylkeskommune
Profilhåndbok for Troms fylkeskommune 01.07.2011 Innhold 1. Innledning... 3 2. Identitet... 3 2.1 Hovedelementene... 3 2.2 Fylkesvåpenet... 4 2.3 Logoteksten... 4 2.4 Topplogo... 4 3.0 Farger... 4 3.2
DetaljerProfilering av AnnoDans. -et prosjekt utarbeidet av Annikken Skjæran Rapport
Profilering av AnnoDans -et prosjekt utarbeidet av Annikken Skjæran 2010 Rapport Innhold Forord 3 Oppsummering/Konklusjon 3 Analyse/Research 4 Design 4 Informasjonsdesign 6 Produksjon/Teknisk løsning 7
DetaljerBRUKERMANUAL KOM I GANG... 2 BLOGGINNLEGG... 4 UNDERSIDER... 6 LAST OPP BILDER/VIDEO... 8 KOMMENTARER PÅ INNLEGG... 9 UTSEENDE...
BRUKERMANUAL KOM I GANG... 2 SKRIV ET INNLEGG... 2 LEGG TIL UNDERSIDE... 2 LAST OPP BILDER... 2 REDIGER MENYINNHOLD... 3 LEGG INN SIDEMENY ELLER BUNNTEKST... 3 TILPASS BLOGGENS DESIGN... 3 BLOGGINNLEGG...
DetaljerBRYLLUPSKREASJON. Del 1: IDEUTVIKLING - Digitalt moodboard - Skisser. Del 2: MØNSTER - Analyse av valgt skisse - Enkel mønstertilpasning
BRYLLUPSKREASJON Ut fra stikkordet skal du utvikle og produsere en bryllupskreasjon eller et bryllupsantrekk. Du har stor frihet når det gjelder design og materialbruk. Bare husk at antrekket skal kunne
DetaljerINNHOLD. 2. Farger 3. Font 4. Grafiske elementer - rammen - rammeillustrasjonen - bøsse
VISUELL PROFIL INNHOLD Introduksjon 1. Logo - Hovedlogo - Sekundærlogo - TV-aksjonen separatlogo - TV-aksjonen separatlogo, forenklet 2. Farger 3. Font 4. Grafiske elementer - rammen - rammeillustrasjonen
DetaljerMandatory assignment 05. Illustration/photo.
Mandatory assignment 05. Illustration/photo. Birgitta Serine Kvelland Ferdig produkt: Tolkning av oppgave: Jeg tolker oppgaven slik at vi skal lage en plakat for en gjenstand som viser til den perioden
DetaljerINNLEDNING: -Enkelt nettsted
INNLEDNING: -Enkelt nettsted Dette er en av de største oppgavene hittil føler jeg, hvor vi bl.a. skulle få kunnskaper om grunnleggende scripting og koding, praktiske ferdigheter og kunnskap innen verktøy
DetaljerLæreplan i kunst og håndverk - kompetansemål
ROSSELAND SKOLE LÆREPLAN I KUNST OG HÅNDVERK 5. TRINN Songdalen for livskvalitet Årstimetallet i faget: 95 Generell del av læreplanen, grunnleggende ferdigheter og prinsipper for opplæringen er innarbeidet
DetaljerEKSAMEN. Elektronisk publisering. INNFØRING MED PENN, evt. trykkblyant som gir gjennomslag
Høgskolen i Gjøvik KANDIDATNUMMER: EKSAMEN FAGNAVN: FAGNUMMER: Elektronisk publisering L101G EKSAMENSDATO: 04.01.01 KLASSE: TID: FAGLÆRER: ANTALL SIDER UTLEVERT: TILLATTE HJELPEMIDLER: 99hinga/b, 99hdmua/b
DetaljerMinimanual Kavlifondet s.1
Minimanual Kavlifondet s.1 Varianter av logo og pay-off Hovedlogo finnes i farger og i sort/hvit versjon. På neste side vises også varianter med pay-off. Typografi - Morgan Sans Condenced Medium Italic
DetaljerPROSJEKT EKSAMEN 1.SEMESTER!
PROSJEKT EKSAMEN 1.SEMESTER GRAP RAPPORT AV BLERIM HAVOLLI Innhold Forord 3 1.Innledning 4 1.1 Tolkning av oppgaven 4 1.2 Valg av kunde 5 1.3 Målgruppen 5 1.4 Konsept 5 1.5 Produkter 6 2 Research og arbeidsprosess
DetaljerNettsideplanleggings Guide
Nettsideplanleggings Guide Alt du må ta stilling til når du skal planlegge din smaching nye nettside! Introduksjon Hva denne guiden handler om.. Nettsiden din er en viktig del av ditt foretak om ikke den
DetaljerINNHOLD. Introduksjon 1. Merkevareplattform 2. Logo - Hovedlogo - Sekundærlogo
VISUELL PROFIL INNHOLD Introduksjon 1. Merkevareplattform 2. Logo - Hovedlogo - Sekundærlogo - TV-aksjonen separatlogo 3. Farger 4. Font 5. Grafiske element: bøsse 6. Elektroniske maler - Word 7. Bruk
DetaljerDigitale verktøy Mina Gulla 28/09/10. Grafikk og bilder. Oppgave T4: Digitale bilder
Digitale verktøy Mina Gulla 28/09/10 Grafikk og bilder. Oppgave T4: Digitale bilder 1) Det er i hovedsak to måter å representere digitale bilder, raster (punkter) og vektorer (linjer og flater). Redegjør
Detaljercv for alexander lillevik Født 09.12.1987 i Narvik. Bosatt i Bergen.
cv for alexander lillevik Født 09.12.1987 i Narvik. Bosatt i Bergen. Utdanning Høyere utdanning Bachelor i design ved fagområdet visuell kommunikasjon (2010 2013) Kunst- og designhøgskolen i Bergen ved
DetaljerCASCADING STYLESHEETS (CSS)
CASCADING STYLESHEETS (CSS) HVA ER CSS Stylesheets er en metode for å flytte selve formatteringen av et HTML dokument ut av selve dokumentet og over i et eksternt regelsett. Dette skyldes HTMLs manglende
DetaljerINNHOLD LOGO/FARGER POSTALIA EKSEMPLER PÅ PROFILERING. 04-08: Farger 09-13: Om Logo 14-15: Typografi og dekordetaljer.
PROFILMANUAL LOGO/FARGER 04-08: Farger 09-13: Om Logo 14-15: Typografi og dekordetaljer POSTALIA 16: Visittkort 17: Brevark EKSEMPLER PÅ PROFILERING 14-15: Bildekor INNHOLD Profilmanualen er en veiledning
DetaljerJavascript. Mer om layout
Javascript. Mer om layout Kirsten Ribu 04.10.04 Kirsten Ribu - Webpublisering - HiO -2004 1 Men først. Hvordan går det med klasser og blokker? Hjalp det med mailene? Litt mer om klasser og blokker ;-)
DetaljerRapport prosjekt til fordypning
Rapport prosjekt til fordypning Våren 2009, Solveig Walmann Østerklev, 1mkb Dette halvåret hadde jeg egentlig tenkt å jobbe med journalistikk i Vingernett, men Vingernett var egentlig ikke den type journalistikk
DetaljerWebdesign. Håkon Tolsby Håkon Tolsby
Webdesign Håkon Tolsby 13.03.2017 Håkon Tolsby 1 Hva er det viktigste for å lage et BRUKEVENNLIG websted Don t make me think Steve Krug Webstedet skal være: Selvinnlysende Selvforklarende Ikke rocket science
DetaljerMIN IDRETT ny design web, oktober 2011
MIN IDRETT ny design web, oktober 2011 DE VISUELLE RETNINGSLINJENE Det er ikke utarbeidet visuelle retningelinjer for digitale medier i NIFs designmanual (utover for Powerpoint). Vi har implementert de
DetaljerINNHOLD ABOUT ABOUT 3
PROFILMANUAL INNHOLD ABOUT 3 LOGOEN 4 FARGER 6 TYPOGRAFI 8 DOs 10 DONTs 11 PROGRAM 12 PLAKAT 13 ABOUT Barnas Bokfestival Bodø sin logo og grafiske profil er utarbeidet for å kommunisere med målgruppen
DetaljerGRAP. Rapport. Av Marthine Fjeld
GRAP Rapport Av Marthine Fjeld Innhold Innledning 3 Hoveddel 5 Logo Visittkort Flyers Plakat Genserdesign Foliedesign Avslutning 17 Avvik Konklusjon Kilder Vedlegg 18 Prosjektbeskrivelse Fremdriftsplan
DetaljerViva Designmanual 1. Designmanual
Viva Designmanual 1 Designmanual Versjon 13.06.2017 Viva Designmanual 2 Forord Vestviken interkommunale vei, vann og avløpsselskap (Viva IKS) ble etablert 1. juli 2014. Selskapet eies av kommunene Lier,
DetaljerNoen viktige poenger for deg som er typograf eller designer hos produsenter av Tekna kursbrosjyrer:
Tekna kursbrosjyrer Viktige råd til deg som skal lage kursbrosjyrer 2 Generelt om det nye designet og designmalene 3 Forside-design når Tekna er arrangør 4 Forside-design når det er flere arrangører 5
Detaljer(X)HTML, CSS og JavaScript HTML. Det første dokumentet 26.11.2007. Grunnleggende programmering i Java Monica Strand 26.
(X)HTML, CSS og JavaScript Grunnleggende programmering i Java Monica Strand 26. november 2007 Gr. leggende Java 26. november 2007 1 HTML HTML = Hyper Text Markup Language Strukturerer tekstinnhold HTML
DetaljerLOGO. Logoen er NORWACS primære kjennemerke.
VISUELL PROFIL POSITIV LOGO Logoen er NORWACS primære kjennemerke. NORWACs logo består av navnet NORWAC med undertittel, og et symbol satt sammen av et hjerte og et reinsdyr. Hjertet forteller om NORWACS
DetaljerMILJØPARTIET DE GRØNNE 2014 DESIGNMANUAL. UTVIKLET AV HANDVERK [madebyhandverk.no]
MILJØPARTIET DE GRØNNE 2014 DESIGNMANUAL UTVIKLET AV HANDVERK [madebyhandverk.no] LOGO HOVEDLOGO LOGO GRØNN UNGDOM LOGO GRØNNE STUDENTER BRUK AV LOGO Logo brukes som en del av det grafiske, eksempelvis
Detaljerborealis vignett Øyvind Kristiansen 2MKA Medieproduksjon 15. mars 2010
Øyvind Kristiansen 2MKA borealis Medieproduksjon 15. mars 2010 vignett 2 poor is the pupil who does not surpass his master. -Leonardo DaVinci borealis 2010 Oppgaven var at vi skulle lage en vignett til
DetaljerRØYKEN kommune. Grafisk profilmanual. Revidert januar 2016
Grafisk profilmanual Revidert januar 2016 Logo Hovedlogo Logoen er hovedsignaturen til Røyken. Den består av våpenet og navnetrekket Røyken. Grønn, nær og levende Størrelsesforholdet mellom våpenet og
DetaljerÅrs- og vurderingsplan Kunst og håndverk Selsbakk skole 8. trinn Kompetansemål etter 10.årstrinn
5. september 2016 Selsbakk skole Års- og vurderingsplan Kunst og håndverk Selsbakk skole 8. trinn Kompetansemål etter 10.årstrinn Side 2 av 6 Kompetansemål Visuell kommunikasjon I visuell kommunikasjon
DetaljerSENSORVEILEDNING. Dato: Eventuelt:
SENSORVEILEDNING Emnekode: ITF10511 Emnenavn: Eksamensform: Webutvikling Digital Dato: 03.12.2018 Faglærer(e): Michael A. Lundsveen Eventuelt: Læringsutbytte for emnet KUNNSKAP: Studenten kan forstå nettsteders
DetaljerLOKAL FAGPLAN Kunst og Håndtverk 1.-10. TRINN
LOKAL FAGPLAN og Håndtverk 1.-10. TRINN Grunnleggende ferdigheter Å kunne uttrykke seg muntlig i kunst og håndverk om sitt eget og andres arbeid er en viktig del av faget. Samtalen kan føres på ulike nivåer,
DetaljerOBLIG 2 WEBUTVIKLING
OBLIG 2 WEBUTVIKLING Oppgave 1 Design ved hjelp av skisser eller wireframes et nettsted med et "avansert" design. Lag spesifikke design for ulike skjermstørrelser og utskrift. Fokuser spesielt på å få
DetaljerPROFILMANUAL. Fluid Control
PROFILMANUAL Fluid Control Den visuelle profilen skal sørge for at Fluid Control fremstår gjenkjennelig og helhetlig i all kommunikasjon. For at det skal skje, må profilmanualen følges konsekvent. LOGO
DetaljerGrafisk håndbok. Rødt 2019 v 0.9
Grafisk håndbok Rødt 2019 v 0.9 Logo Varianter Ved sort/hvitt kopering eller trykking skal logoen brukes i sort: Dersom logoen skal legges oppå et bilde eller en farget bakgrunn skal den brukes i hvitt:
Detaljer5. september Års- og vurderingsplan Kunst og håndverk Selsbakk skole 8. trinn Kompetansemål etter 10.årstrinn
5. september 2017 Års- og vurderingsplan Kunst og håndverk Selsbakk skole 8. trinn Kompetansemål etter 10.årstrinn Side 2 av 6 Kompetansemål Visuell kommunikasjon I visuell kommunikasjon er praktisk skapende
DetaljerSteg 1: Vi starter fra toppen
CSS: Layout Skrevet av: Lars Klingenberg Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon Målet med oppgaven er å lære hvordan
DetaljerPLAST, Fyr oppgave TANNKREM& EMBALLASJE
Vedlegg 1. fra ide til produkt PLAST, Fyr oppgave TANNKREM& EMBALLASJE Naturfag & design og handtverk Produktanalyse av Studer pakningen nøye og noter ned en beskrivelse og vurdering av følgende Farger:
DetaljerÅrsplan i Kunst & Håndverk Trinn 8 Skoleåret Haumyrheia skole
Årsplan i Kunst & Håndverk Trinn 8 Skoleåret 2015-2016 Tids rom Kompetansemål Hva skal vi lære? (Læringsmål) Hvordan jobber vi? (Metoder) 35-39 tegne hus ved hjelp av topunktsperspektiv. vurdere funksjonell
DetaljerHva ønsker jeg å utrykke?
Innledning Produktet mitt er en lykt av leire. Den er formet som en blanding av et tre og en skyskraper, dette er et utrykk for hvordan Sande blir en by. Målgruppen er alle som er interesserte i utviklingen
DetaljerRetningslinjer. Retningslinjer for kommunikasjon gjelder for alle oss som arbeider med å synligjøre/profilere Stiftelsen KGJ.
Profilhåndbok Retningslinjer Retningslinjer for kommunikasjon gjelder for alle oss som arbeider med å synligjøre/profilere Stiftelsen KGJ. Hensikten er å gjøre det enklere å gi Stiftelsen KGJ ett uttrykk,
DetaljerBrukergrensesnitt og design av skjermbilder
I dag Brukergrensesnitt og design av skjermbilder Litt om prosjektet og innleveringen Om komposisjon og farger Kirsten Ribu 02.05.2007 Noen ord om prosjektet God design er god kommunikasjon. Hvordan fungerer
DetaljerD E S I G N M A N U A L 1
DESIGNMANUAL 1 INNHOLD Farger s.4 Farger brukt i logo s.5 Logo s.6 Typografi s.8 Dekorelementer s.10 X-avstand s.11 Biprodukt s.12 FORORD er et rusfritt arrangement for ungdom fra 7. klasse og oppover.
DetaljerRapport. Nina Marie Granlund. MMD okt 10
Rapport Prosjekteksamen Grafisk Nina Marie Granlund MMD okt 10 Forord: Oppdragsgiveren min til prosjekteksamen var en bedrift kallt ASP link. Dette er ett underfirma til Roald Talge AS her i Haugesund.
DetaljerÅRSPLAN I KUNST OG HÅNDVERK 5. 7. TRINN BREIVIKBOTN SKOLE 2013-2014
ÅRSPLAN I KUNST OG HÅNDVERK 5. 7. TRINN BREIVIKBOTN SKOLE 2013-2014 Lærer: Kari Kvil Læreverk: Ingen spesifikke læreverk Målene er fra Lærerplanverket for kunnskapsløftet 2006 og vektlegger hva elevene
DetaljerViva Designmanual 1. Designmanual
Viva Designmanual 1 Designmanual Versjon 23.11.2015 Viva Designmanual 2 Forord Vestviken interkommunale vei, vann og avløpsselskap (VIVA IKS) ble etablert 1. juli 2014. Selskapet eies av kommunene Lier,
DetaljerSæremne SMS-språk. Av Camilla Hofstad og Andreas Lien
Særemne SMS-språk Av Camilla Hofstad og Andreas Lien 2007 Innhold Innledning.. S. 1 Problemstilling.. S. 2 Refleksjon/prosess... S. 3 Web design... S. 4-5 Oppsummering. S. 6 Kilder... S. 7 Innledning Vi
DetaljerSKISSER OG PROTOTYPER
SKISSER OG PROTOTYPER Forelesning 17. januar, Utvikling av interaktive nettsteder 17.01.2017 Tore Marius Akerbæk Avdeling for Informatikk 1 Skisser og prototyper Prototype Prototype er en tidlig modell
DetaljerGrafisk håndbok unge venstre
Grafisk håndbok 2016 Introduksjon Unge Venstres grafiske profil skal fremheve ungdomspartiet som en varm, grønn, liberal og kreativ kraft i norsk politikk. Gjennom en helhetlig grafisk profil, i alle fylker
DetaljerÅrs- og vurderingsplan Kunst og håndverk Selsbakk skole 10.trinn Kompetansemål etter 10.årstrinn
5. september 2016 Selsbakk skole Års- og vurderingsplan Kunst og håndverk Selsbakk skole 10.trinn Kompetansemål etter 10.årstrinn Side 2 av 7 Kompetansemål Visuell kommunikasjon I visuell kommunikasjon
Detaljer