Port-folio

av Stian Bakkaneeller #stianba om du vil

Bakkane Design & Mediawww.bakkanedesign.no

In case of interest, please respond to:

As a reward:

Stian Bakkanestianba@gmail.com+47 936 96 286

Sjekk portfolioen!

4.

Om meg ..................................... 5

Webdesign ................................. 6

PHP / MySQL og AJAX ........... 32

Interaksjonsdesign .................. 34

Grafisk + kunder ...................... 46

Kontakt ..................................... 56

Inn-hold

Hei. Mitt navn er Stian Bakkane, og jeg lager ting. Websider, webap-plikasjoner og design av firmapro-filer.

Sagt med få ord innehar jeg kunnskap om mye rart innenfor feltet design.

Sagt med litt flere ord behersker jeg konsepter som inkluderer: Inter-aksjonsdesign, HTML(5), CSS(3), JavaScript, jQuery, PHP, MySQL, Photoshop, Illustrator og inDesign.

Når det kommer til erfaring har jeg høstet det fra flere kilder. Det hele startet som Medier & Kom-munikasjon-elev ved Risør Vide-regående Skole. Mens jeg studerte i Risør fikk jeg en deltidsjobb ved

reklamebyrået Sell & Syversen. Her jobbet jeg med alt fra små, lokale bedrifter, til større travere. I tillegg til dette grunnla en kamerat og jeg en ungdomsbedrift som fokuserte på oppussing av lokale bedrifters firmaprofil. Dette gikk bra.

Etter dette flyttet jeg til Oslo for å studere Interaktiv Design ved NITH, noe som ga meg jobb som designer for merkevarer som Kva-sir, Proff.no og Telefonkatalogen Bedrift.

For spesifikk info og eksempler an-befaler jeg gjennomlesing av dette dokument.

Ommeg

5.

6.

Når det gjelder webdesign er det alltid vanskelig å definere hva som er bra. Noen synes artisktiske, stil-rene og estetisk vakre sider er de beste, mens andre setter pris på et funskjonelt design som er lett å bruke.

Jeg har vært borti de fleste måtene å designe en nettside på, og derfor har jeg plukket ut noen eksempler som dekker både artistiske nettsid-er, samt store, funskjonelle portaler med høy interaksjonsverdi (la oss lage nye ord).

Poke a Friend

Teknologi: HTML, CSS, PHP, og MySQL.

Hvorfor: Morsomt lite eksperi-ment.

Beskrivelse: Pokeafriend. com var et slags eksperiment / morsomt tidsfordriv. Poenget med siden var å se hvor lang denne listen med pok-ers kunne bli ut i fra en enkelt kilde (meg).

Rent teknisk startet jeg, som web-master, å poke folk ved å skrive inn e-post-adressen til mottakeren. Så fikk mottakeren en e-post med en kode som han/henne kunne bruke til å logge inn og poke sine venner.

Web-design

7.

8.

PhotoshopAid.net

Teknologi: HTML, CSS,PHP, og MySQL.

Hvorfor: Nettcommunity for de-sign-entusiaster.

Beskrivelse: PhotoshopAid.net var den første ordentlig nettsiden jeg lagde, i en alder av 17 år. Her fant man belærende artikler om-handlende multimediadesignpro-grammer som Flash, inDesign, Illustrator og, selvfølgelig, Photo-shop.

I tillegg til disse artiklene var det mulig å bli medlem ved å registrere seg; som medlem fikk man mu-lighet til å lagre favoritt-artikler, skrive egne, samt dele erfaringer med andre likesinnede.

9.

10.

NITHs Studierådgiver

Teknologi: HTML og CSS.

Hvorfor: Skoleprosjekt

Beskrivelse: Eksamensoppgave hvor vi skulle lage en veileder for fremtidige studenter ved NITH.

Vi valgte å gå for en tradisjonell per-sonlighetstest med en moderne vri.

For oss var brukervennlighet og effek-tivitet viktigst. Jeg har stått for:

- Design- Grunnide- Infrastruktur/Oppbygging- Navigasjon

11.

kred.nu

Teknologi: HTML5, CSS3, JavaScript, jQuery, PHP, og MySQL.

Hvorfor: Sosialt nettsted med fokus på ny, kredibel musikk.

Beskrivelse: kred.nu er et prosjekt jeg jobbet med på fritiden, hoved-

saklig for å få brukt JavaScript- og jQuery-kunnskapene mine i prak-sis. Det er en side med stor fokus på burkervennlighet og integrasjon med sosiale medier som Facebook og Twitter.

Om den blir lansert gjenstår å se.

12.

13.

Nations

Teknologi: HTML5, CSS3, JavaScript, jQuery, PHP, og PDOMySQL.

Hvorfor: Rett og slett et spill jeg alltid har hatt lyst til å spille selv.

Beskrivelse: Nations er et so-sialt massivt online nettleserspill

(si det høyt tre ganger) jeg begynte på høsten 2011. Spillet går ut på å styre ditt fiktive land mot makt og rikdom i en verden av andre likes-innede herskere med mer eller mindre samme misjon. Her er det viktig å forvalte naturessurser og militær makt på veien mot å bli en fryktet eller elsket supermakt.

14.

15.

16.

17.

18.

19.

20.

21.

22.

23.

24.

25.

26.

27.

28.

29.

30.

31.

32.

Det er kult å lage fine og vakre nettsider, men det er enda kulere å kunne bruke dem, som jeg pleier å si.

Jeg har gode kunnskaper i både PHP og MySQL, og tar i bruk begge teknologiene i de fleste net-tløsningene mine.

For å eksemplifisere dette slenger jeg med noen eksempler:

PhotoshopAid.net

- Publiseringssystem.- Sikker brukerregistrering.- Mulighet til å forandre design på brukerprofil.- Brukerblogger.- Brukergenererte RSS-feeds.

- Søkefunksjon.- Mulighet for å se hvem som er online og aktive.- Personlige bildegallerier.- Trophy- og Achievementsystem (Lenge før XBOX ).

kred.nu

- Omfattende og smart AJAX-au-tocomplete-søkefunksjon.- Facebook connect.

Nations

- AJAX i alle ledd- Databaser og tilhørende spørrin-ger med tusenvis av transaksjoner, kamper og andre interaksjoner mellom nasjonene- Brukervennlig design ulikt mange andre nettleserbaserte strategispill

PHP / MySQL og AJAX

33.

34.

Nettsider, apps, mobiltelefoner, PCer, Macer, iPhone! Disse begre-pene har én ting til felles. Kanskje til og med fler. Men i dette tilfellet er det bare ett spesielt konsept som passer seg: interaksjonsdesign!

Hva er det som gjør Apples iPhone til verdens mest populære telefon? (Kilde mangler, men for eksempelets skyld kan vi anta såpass.) Er det tele-fonens design? Ja. Er det app-man-gfoldet? Jupp. Er det symbiosen mellom Apples andre produkter, som Mac og iPad? Yes, helt sikkert.

Selv om alle disse eksemplene er gode argumenter for å velge seg en iPhone ved neste mobi-linnkjøp er de verdiløse uten et helt kritisk, überviktig og majest-

etisk avgjørende element; nemlig et skikkelig godt brukergrensesnitt.

Jeg har studert interaksjonsdesign ved NITH i tre år nå, og fullførte min bachelorgrad ved å utvikle en sosial kommunikasjonsplattform for NKI Nettstudier. I tillegg til tegning av wireframes/mockups og utvikling av brukergrensesnitt ko-det jeg store deler av applikasjonens front- og backend (HTML, CSS, JavaScript, PHP og databasespørringer).

Kommunikasjons-plattform for NKI

Steg 1 (Første mockups): Klikkbare wireframes tegnet jeg i Cacoo.

Steg 2 (HTML-prototype): For å kunne brukerteste de avanserte funksjonene trengte vi mer enn en klikkbar mopckup. Derfor utviklet jeg en HTML/JavaScript-proto-type.

Steg 3 (Brukertesting av prototype): Testingen ble gjort av et utvalg tilfeldige NKI-studenter. Tilbake-meldingene la grunnlaget for vi-dere utvikling av prototypen.

Steg 4 (Design og utvikling av ferdig løsning).

Interaksjons-design

35.

1.

2.

3.

36.

4.

37.

JazzPicker from JazzScene.fm

Som del av en skoleoppgave våren 2012 designet jeg konsept og grens-esnitt for en mobilapplikasjon med navn JazzPicker. Dette er en app ment for å skape økt interesse rundt jazzmusikk.

Konseptet går ut på at applikas-jonen genererer spillelister med jazz utifra hvilken stemning du ønsker å oppnå.

I utviklingen av konsept og mock-ups forfattet jeg brukerscenarier for å kartlegge behov i forhold til de situasjoner som oppstår når jazz-musikk hadde vært på sin plass.

38.

SKISSE.

39.

SKISSE.

Redesign av Kvasir

Mitt største oppdrag da jeg job-bet med Kvasir var redesignpros-essen som skulle ta søketjenesten inn i 2013 med forbedret lesbarhet, brukervennlighet og kompatibilitet med mobile enheter.

Ved å tilføre mer luft, samt opti-

malisere fontstørrelse, -forhold og linjeavstand gikk Kvasir fra å være overveldende og rotete til enkel, oversiktlig og responsiv tilpasset iPad og mobil såvel som desktop.

40.

iPad

41.

42.

43.

44.

SKISSE.

45.

SKISSE.

46.

Jeg har alltid hatt en sterk interesse for farger og typografi. Jeg kan sitte i timesvis på fritiden og lete etter den perfekte fonten. Det samme gjelder farger.

REAS

Før jeg flyttet til Oslo jobbet jeg en del med firmaet REAS. For dem har jeg designet profil, visittkort og nettside.

I utgangspunktet het dette firmaet Risør Engineering AS, men de øn-

sket et litt mer internasjonalt snitt så jeg anbefalte dem å endre navn til REAS.

REAS ville ha en logo som spiller på det faktum at de er fra sørlands-byen Risør. Siden firmaets grunn-legger er en ivrig seiler ville han også ha med noe maritimt i logoen.

Hydor

Hydor er et annet firma jeg har jobbet en del med. De startet opp i 2010 og driver med Marine & En-ergy Insurance.

For dem utformet jeg firmaprofilen og nettsiden.

Logoen representerer maritim for-sikring. Noe tverrsnitet av en kjøl understreker.

Grafiskog kunder

47.

48.

49.

50.

51.

52.

53.

54.

55.

Og takk til deg for at du tok deg tid til dette dokumentet. Jeg håper du fant innholdet interessant.

Hvis det er tilfellet, kan jeg kontak-tes ved hjelp av disse moderne me-toder:

Stian Bakkanestianba@gmail.com

+47 936 96 286

Takkfor meg