Semesteroppgave – Temasymboler

Semesteroppgave – Temasymboler

For å enda bedre kunne markere hvilke artikler som er under samme tema har jeg valgt å designe et symbol for hvert av hovedtemaene. Jeg har tatt utgangspunkt i formene på illustrasjonene i brukerveiledningen (som jeg ikke har designet), og håper på den måten å gjøre disse mer integrert i designet. Ikonene vil jeg plassere både som ikoner ved siden av overskrifter, og som dekorative elementer i layouten.

Under ser du et bilde som viser de ferdige ikonene over den hvite streken, og litt av designprosessen under.

 

Semesteroppgave – Layout- tester

Semesteroppgave – Layout- tester

De siste dagene har jeg jobbet med forskjellige sideoppsett i magasinet. Jeg har tatt for meg brukerveiledning-siden og de to første artiklene i bladet.

Med utgangspunkt i brukerveiledningstemplaten som kommer med Mag+ har jeg jobbet frem et design som stemmer overens med Friele Kaffeblad. Jeg har oversatt teksten fra engelsk til nosk, skiftet fonter, og gått inn i alle illustrasjonene for å gjøre om på fargene. I påvente av bilder fra Friele sitt arkiv har jeg brukt et bakgrunnsbilde jeg har “lånt uten å spørre” fra et søk på Google. Bildet viser kaffeblader og en plante som vokser innimellom dem. Jeg vil sende mail til personen som eier bildet og spørre om brukstillatelse om jeg ender opp med å bruke bildet. Dette gjelder forsåvidt for alle bildene jeg skal bruke i magasinet. Nederst på denne siden har jeg laget plass til at alle ikonene skal forklares. Det hvite litt gjennomsiktige feltet bak teksten og illustrasjonene, er et designelement jeg vil la gå igjen i magasinet. Jeg har valgt å avslutte denne firkantete formen i en vinkel som speiler logoelementets form.

Jeg er fortsatt ikke helt sikker på hvordan jeg skal “vise” brukerveiledningen. Skal jeg ha den som en egen side etter forsiden, eller skal jeg lage et ikon som leder lesere som føler de trenger denne hjelpesiden til den? Jeg tror i hvert fall at en slik side er viktig for mange brukere nå, men om noen år, når magasiner på nettbrett er blitt mer hverdagskost, er dette kanskje en overflødig side. Måten jeg har valgt å legge opp layouten på nå har jeg gjort med utgangspunkt i at siden kan plasseres etter forsiden, men at lesere som ikke føler de trenger lese dette, fort kan se hva siden kan tilby, og så bla videre.

De to artiklene jeg har jobbet med valgte jeg for å utforske to forskjellige layouts. I det ene layoutet er alt innholdet presentert med en gang, på det andre må lesere skrolle for å få frem alt innholdet. På layoutet uten skrolling har jeg testet ut hvordan jeg kan skreddersy layouten ved å få de forskjellige elementene til å flytte på seg når lesere bytter mellom portrett og landskapsfremvisning. I artikkelen med skrolling har jeg laget hotspots som linker til relevante nettsider med mer informasjon om temaet. Bakgrunsbildene på begge disse sidene er også “placeholdere”, men gir et inntrykk av hvordan jeg ser for meg det ferdige resultatet.

Jeg har lagt stor vekt på at alt av tekst går etter samme baselinegriden, og at fontstørrelser/farger/typer stemmer med hverandre. Fonten jeg bruker på overskriftene heter Rosewood Fill. Denne fonten blir brukt i flere sammenhenger hos Kaffehuset Friele, blant annet på nettsidene. Fonten på brødteksten er foreløpig Arial, men dette er ikke en endelig avgjørelse.

 

Semesteroppgave – Ikoner

Semesteroppgave – Ikoner

For å fremme brukervennligheten i Friele Kaffeblad har jeg valgt å designe egne ikoner som skal plasseres ut forskjellige steder i magasinet for å indikere hvor det er mer innhold på en side. Jeg er ikke helt sikker på hvor mange ikoner jeg kommer til å trenge, men har foreløpig designet de jeg ser for meg som mest elementære. Under ser du noen av forslagene jeg har laget.

Jeg syntes ikonene med rammene var veldig fine, men rammene var ikke nødvendig for å formidle ikonets budskap, og de gjorde også at ikonene fort ble litt ruvende i layouten, så jeg kommer til å gå for ikonene uten ramme (på linje 4). Disse ikonene er nette og stilig, og kommer godt frem samtidig som de er diskré nok.

Semesteroppgave – Innholdoversikt, del2 – sideoppsett

Semesteroppgave – Innholdoversikt, del2 – sideoppsett

Ut i fra framdriftsplanen skulle jeg egentlig til nå ha laget  alle illustrasjonene som skal være i magasinet. Jeg har valgt å utsette dette da jeg først nå virkelig begynner å få en oversikt over hva jeg kommer til å trenge av illustrasjoner og reklamer. Under ser du en oversikt over over magasinet (med forbehold om endringer underveis). Jeg er nå klar for å utarbeide layout maler, for så å begynne og sette sammen sidene i InDesign.

Semesteroppgave – Ferdig logo

Semesteroppgave – Ferdig logo

Igår oppdaget jeg at jeg har gjort semesteroppgaven min sin første (og forhåpentligvis siste) tabbe. Under arbeide mitt med logoelementet har jeg prestert å lagre de siste arbeidsfilene som .png og ikke .ai filer. Dette resulterte i at jeg idag måtte lage logoelementet en gang til. Resultatet ble ikke på prikken likt, men det ble like bra, om ikke bedre, med tanke på formene i bladet. Logoelementet ser slik ut nå:

Jeg ønsket å videreføre fonten fra Friele-logoen til tekste i Kaffeblad-logoen. Jeg løste dette ved å lage bokstavene jeg manglet med utgangspunkt i bokstavene i Friele-logoen. Under ser du hvordan jeg gikk frem for å finne størrelsesforholdene og mellomrommene mellom bokstavene. Jeg eksperimenterte også litt med forskjellige K’er.

Jeg testet ut noen forskjellige sammensetningene av logoelement og tekstelement. Skulle de to elementene stå hver for seg, eller det ene ligge litt foran det andre? Jeg testet flere variasjoner.

Jeg testet også hvordan det ville sett ut om jeg forenklet logoelementet slik at bare “Friele” sto igjen. Planen var at dette ville gi meg muligheten til å gjøre logoelementet større i forhold til teksten uten at det ble ubalansert. Jeg gikk vek fra denne varianten da jeg syntes logoelementet mistet mye karakter og liv uten detaljene i den litt mørkere fargetonen.

Jeg kom frem til det at tekstelementet var stort i forhold til teksten i logoelementet egentlig bare var positivt, da det gir mer oppmerksomhet til hva dette faktisk er logoen for, nemlig kaffebladet. Jeg måtte også ta hensyn til at logoen skulle stå godt på forsiden av magasinet i både portrett og landskapsformat, så jeg kjørte flere tester på iPad’en underveis.

Jeg testet også ut hvordan bokstavene så ut med en lysere gradering som kan gi illusjonen av at de er blanke. Jeg ønsket å gjøre dette av flere grunner. En av grunnene er at flere av Frieles produkter er blanke, og en blank logo vil i så fall speile (no pun intended) disse. En annen er at de fleste analoge magasiner har en blank forside, og da denne logoen kommer til å stå på forsiden av mitt magasin kan det også gi assosiasjoner til dem. En blank overflate gir også ofte et mer eksklusivt uttrykk, og da spesielt en blank sort eller mørk grå overflate. Her ser du noen av testene:

Selv om jeg i utgangspunktet hadde sett for meg at teksten skulle være sort med grønn “skygge”, ønsket jeg å se hvordan den ville fungere med andre fargekombinasjoner. Noen av grunnene til at jeg ville ha sorte bokstaver er, som jeg nevnte over, at sort ofte gir et eksklusivt uttrykk, og at sort definerer det mørkeste i en komposisjon og gjør de andre fargene klarere og mer fremtredende. Jeg testet også ut logoen på en mørk bakgrunn. Her er noen av testene:

Under ser du den endelige logoen som består av logoelementet med de mørkere detaljene og et sort blankt tekstelement med grønn skygge. Grønnfargen er hentet fra logoelementet. Dette, og at elementene overlapper hverandre litt, gjør at de to elementene fremstår som en samlet helhet.

Semesteroppgave – Innholdoversikt, del1

Semesteroppgave – Innholdoversikt, del1

For å få en bedre oversikt over innholdet i magasinet har jeg “klippet ut” alle tekstelementene jeg kan se for meg at kan være aktuelle å ha med. Jeg har limt inn utklippene i Photoshop for å lettere kunne legge opp rekkefølgen på en måte som setter relaterte tekster etter hverandre, og samtidig gi en god flyt i innholdet. Jeg vil også plassere inn forside, brukerveiledning, innholdsfortegnelse, reklamesider og informasjon om samarbeidspartnere.

Så langt har jeg begynt å organisere etter hovedkategoriene; ansvarlig handel, miljø og klima, sertifisert kaffe, sosiale tiltak, og sporbarhet. Dette er kategoriene  under “samfunnsansvar” på nettsiden til Kaffehuset Friele. Jeg ser for meg at kategoriene kan visuelt skilles fra hverandre med fargekoder og/eller grafiske elementer.

På bildet under representerer alle overskriftene en artikkel (side) i magasinet, og de grå vertikale linjene skiller hovedtemaene fra hverandre. Oversikten viser også hvilke artikler som har en tilhørende video. Helt til høyre har jeg plassert intervjuet. Rekkefølgen er ikke endelig.

 

Semesteroppgave – Mag+ Reviewer App – Oppdatering

Semesteroppgave – Mag+ Reviewer App – Oppdatering

Igår var jeg så heldig at jeg fikk låne iPad’en til min eminente medstudent Michael Mehlum. På denne fikk jeg Mag+ Reviewer Appen til å virke på første forsøk både sammen med Mac’en på skolen og PC’en hjemme. Dette satt meg i et lite dilemma. Skal jeg gi opp på å finne løsningen på problemet med den første iPad’en, eller skal jeg fortsette letingen? Spørsmålet jeg la inn på Mag+ forumet har ikke gitt noen videre svar enda, men det er en annen persom som også sliter med samme problemet. Det hadde jo vært både veldig kjekt og lærerikt å finne svaret, men på den andre siden så er det jo også viktig å bruke den resterende tiden på en effektiv måte.

Jeg har kommet frem til at jeg ikke skal fortsett letingen etter en løsning nå, men heller ta den utfordringen en annen gang.

Igjen, tusen takk til Veronica Sophia Poer for lånet av iPad’en. Og tusen takk til Michael Mehlum for at jeg nå får bruke din iPad.

En av syv bannere jeg lagde under utplasseringen hos Kaffehuset Friele.

Semesteroppgave – Logoelementet

Semesteroppgave – Logoelementet

Idag har jeg jobbet med logoen i Illustrator. Først testet jeg ut en mørkere rød “oppbrett” for at bretten ikke skulle være for fremtredende men likevel ikke forsvinne. Jeg syntes det så ganske fint ut, men det ble kanskje litt monotont.

Jeg testet deretter ut en grønn oppbrett for å trekke assosiasjoner til bladene på et kaffetre. Komplimentærkontrasten i det røde og det grønne ga logen et friskt uttrykk. Den grønne fargen assosieres jo også med natur og naturvern, og det er jo veldig passende da Kaffehuset Friele er en veldig miljøbevisst bedrift. Jeg var litt redd for at kombinasjonen mellom de to fargene skulle få logoen til å se ut som en juledekorasjon, men det gorde den heldigvis ikke.

Jeg ønsket å gi det grønne feltet en bladtekstur både for å understreke bladassosiasjonen, og for å gi logoen litt mer liv. Først lagde jeg noen enkle streker som skulle minne om stripene på et blad. Jeg likte ikke helt uttrykket dette ga, så jeg bestemte meg for å prøve meg på en tekstur med mykere overganger. For å lage denne teksturen fant jeg et bilde av et  kaffeblad og importerte det til Illustrator. Med utgangspunkt i bladets farger brukte jeg Mesh Tool til å forme en bladtekstur. På bildet under ser du referansebildet, den ferdige mesh’en, og gridden til mesh’en:

For å forme blade-mesh’en etter bretten brukte jeg en metode jeg har jobbet frem til ved tidligere prosjekter. Da det er vanskelig å vri og venne på en hel mesh, laget jeg en firkant som dekket hele formen, la den over mesh’en, markerte begge elementene, og trykket på Object –> Envelope Distort –> Make with Top Object. Dette gjør at man nå kan forme hele mesh’en. For å “klippe til” mesh’en etter bretten, la jeg brett-formen over mesh’en –> passet på at bretten var farget hvit (uten stroke) –> markerte begge elementene –> gikk inn i Transparency panelet –> trykket på den lille dropdown menyen øverst til høyre, og valgte Make Opacity Mask. Dette gjør at kun det av mesh’en som er dekket av noe hvitt er synlig. Jeg eksperimenterte med forskjellige utsnitt og plasseringer av meshen, og kom frem til at jeg likte best utsnittet hvor bare ene halvdelen av bladet synes.

Jeg lagde en lysstripe på bretten for å få en blank overflate. Dette gjorde jeg både fordi det gir bretten mer form, og fordi det kan minne et analogt magasins blanke papir på forsiden.

På bildet under ser du først den originale logoen til Friele, så skissen jeg har tatt utgangspunkt i, og så de forskjellige logoene jeg har jobbet med. Det er logoen nederst til høyre jeg har bestemt meg for å bruke videre.

Semesteroppgave – Logoskisser

Semesteroppgave – Logoskisser

Etter å ha bestemt meg for magasinets navn skrev jeg en liste over forskjellige ideer til logoelement. Noen av ideene tar utgangspunkt i ordspillet i “kaffeblad”, noen i den eksisterende logoen til Friele,  og noen i elementer som assosieres med kaffe. Her er listen med de forskjellige ideene:

Jeg ser for neg at logoen skal bestå av både et tekstelement og et symbol. Det er viktig at begge disse fungerer sammen med Frieles eksisterende logo.

Etter å ha tegnet noen skisser kom jeg frem til at det lett ville blitt rotete om oppsettet av logoen først skulle vise Friele’s logo, deretter tekstelementet “Kaffeblad”, og tilslutt et symbol for magasinet.

Jeg besluttet at jeg ville jobbe med å videreutvikle Friele’s eksisterende logo slik at magasinets logo på en stilfull og elegant måte kan “erstatte” Friele-logoen. Oppsettet blir da en spesialdesingenet Frielelogo og tekstelementet.

Skissen nederst til høyre (på bildet under) er den skissen jeg kommer til å jobbe videre med. Tanken her er at formen på Friele-logoen er som den er fordi den er blitt brettet opp som om det var forsiden på et magasin. På denne måten få logoen et ryddig utrykk med en konkret og direkte assosiasjon til Kaffehuset Friele.

Jeg leker nå med tanken på hvordan det ville sett ut om “undersiden” av logoen gir assosiasjoner til et blad(løv), og på hvordan denne logoen kanskje kan animeres for å få mer interaktivitet i magasinet.

Semesteroppgave – Navn

Semesteroppgave – Navn

I følge fremdriftsplanen for semesteroppgaven skulle jeg i løpet av den første uken ha ferdigstilt navn og logo for magasinet. Dette har jeg valgt å nedprioriter, og heller fokusere på å få alt det tekniske til å stemme først. Denne fremgangsmåten har egentlig fungert veldig greit, da jeg nå ser at det uansett ville vært vanskelig å bestemme seg for et navn så fort. Samtidig som jeg har jobbet med andre deler av oppgaven har jeg hele tiden tenkt på mulige navn som kunne passe. Jeg har også nå fått muligheten til å delta i flere diskusjoner med medstudenter om hva deres oppgaver skal hete, og på den måten fått mye god inspirasjon fra dem.

Navnet jeg har bestemt meg for å bruke er “Friele Kaffeblad” (eller bare “Kaffeblad”, men med Friele logoen som et tilhørende element). Valget falt på dette da jeg føler dette navnet både er anvendelig, lett å uttale, og lett å huske. Jeg liker ordspillet (‘et blad man kan lese til en kopp kaffe’ og ‘et blad fra kaffetreet’), og jeg ser for meg at den doble betydningen kanskje kan videreføres i logoen. Navnet er litt morsomt, samtidig som det ikke fremstår som useriøst. De fleste leserne av magasinet kjenner nok til begrepet “Friele Kaffe”, så det at de nå leser i et blad som omhandle det, og heter “Friele Kaffeblad”, kan oppfattes som helhetlig.

Friele har ikke noen andre produkter som bruker dette navnet, så det er ikke fare for at leserne skal tro at magasinet kun omhandler enkelte av produktene. “Friele Kaffeblad” vil fungere på alle utgivelsene av magasinet, selvom temaet forandres.

Under har jeg skrevet opp noen av de andre forslagene til navn jeg har tenkt på, men som jeg av forskjellige grunner har valg vekk.

  • Friele Magasinet
    - dobbel betydning Magasin = blad/lager (kaffelager)
    - ordspillet er ikke like fengende som “kaffeblad”
    - kanskje litt for formelt
  • Instant:
    - Noe som skjer med en gang, akkurat nå
    - Forteller om at innholdet i magasinet er aktuelt
    - Friele har et produkt som heter Instant, dette kan være misvisende
    - Engelsk ord (ikke nødvendigvis negativt)
  • MMMM:
    - Kravene for å lage god espresso er oppsummert av 4 “M”er: Macinazione (riktig maling av kaffe), Miscela (kaffe blend), Macchina (espresso maskin), og Mano (Barista)
    - Navnet kan være kinkig å uttale
    - Lyden av ordet assosieres med noe godt, eller noe man er skeptisk til (kommer ann på tonefallet)
    - Leseren vet ikke hva M’ene står for
  • Barista:
    - Betyr «den som tilbereder kaffedrikk»
    - Det er allerede et annet blad om kaffe som heter Barista
    - Friele har en serie produkter som heter Barista, så det kan oppfattes som om magasinet bare handler om det
  • Mano:
    - En av M’ene – det å tilberede og servere en kaffedrikk
    - Betyr “hånd” på spansk
    - Leserne vet ikke hva det betyr i denne sammenhengen

 

En av syv bannere jeg lagde under utplasseringen hos Kaffehuset Friele.