Vi stod för informationsarkitektur, webbdesign och tog fram 3D tillsammans med Assorted Nuts. Till detta gjorde vi även flashutveckling och en baksida i Rails.

B-reel var också med och gjorde en tidlinje över Sandviks resa de senaste 150 åren.

Du kollar in kampanjen här. 

Bilder

Tillsammans med Amtele har vi arbetat fram en lösning som är anpassad för deras verksamhet, deras mål, utmaning och kommunikation. Vi ser fram emot ett nära samarbete framöver för att fortsätta utveckla Amteles digitala kommunikation. Sidan drivs i grunden av Drupal.

Även Unicef vill säga ett tack för det ni bidragit till det skickade även ett fint litet kort.

Genom inledande workshops med ledningsgruppen på Fiskeby tog vi fram ett koncept för en webbplats som ska agera som ett säljstöd för att ge mer och fler affärer. Det var intressant att lära känna en så anrik organisation och lyssna till deras erfarenheter, möjligheter och utmaningar. Vår uppgift blev sedan att omsätta det till en webbplats. En ny, fräsch design togs fram med fokus på att slussa användaren till information kring Fiskebys produkter. Enkla små funktioner som tex att låta besökaren välja vad hon vill förpacka för att sedan skicka henne till rätt produkt förhöjer och förenklar upplevelsen.

Vi byggde webbplatsen i Drupal, som passade bra ihop med förutsättningarna för uppdraget. För att kunna hålla en informationstung webbplats uppdaterad är det viktigt att administrationen blir enkel och intuitiv för de som ska arbeta med den. Det får inte bli ett hinder att uppdatera innehållet, då görs det som regel inte tillräckligt ofta.

Hela projektet har varit en fröjd, med gott samarbete och ett välpolerat resultat. Vi tackar Fiskeby för att vi fick chansen att arbeta tillsammans och hoppas få arbeta vidare med deras digitala kommunikation under de kommande 400 åren.

Bilder

Idéer, inom vår bransch är kreativitet, bra idéer och lösningar en stor del av hur man når framgång. Kreativa lösningar på problem ger inte bara bättre resultat både för oss och våra kunder utan gör också arbetet roligare.

Ibland är det lätt att fastna, i gamla vanor, vi känner att inspirationen till någon ny och briljant lösning helt enkelt inte infinner sig. Då kan det vara bra att få lite tips på vägen.

En bok om Idéer

Jag valde att grunda min Think Tank på en specifik källa. När jag studerade hade jag turen att få läsa en underbar bok som hette Idéer: kreativa verktyg och metoder för idé- och konceptutveckling av Dorte Nielsen. I boken finns det konkreta metoder & verktyg, inspiration, tips och exempel som har som syfte att kickstarta vårt kreativa tänkande.

Nedan drar jag några exempel på sådant som man kan tänka på när man är på jakt efter bra idéer enligt Dorte Nielsen.

Definiera problemet

I inledningen handlar det om att veta om vad det är för problem du ska lösa. Utgå från problemet och inte lösningen. Fråga dig själv: Vad är syftet med att kommunicera? Vem talar du till? Vad vill du att de ska veta? Vad ska de tänka och känna? När du har ditt problem tydligt kan du börja jakten efter en bra lösning.

Fokusera

För att verkligen kunna fokusera på ett problem gäller det att du har definierat problemet, undersökt det och börja tänka på det. När du har tillräckligt med information kan du börja fokusera och ditt undermedvetna kan ge dig en briljant idé när du inte ens tänker på problemet.

Inspiration

Inspiration kan upplevas genom att du känner dig inspirerad och idéer infinner sig på löpande band eller så blir du direkt inspirerad av något särskilt som löser ditt problem, som en sorts ”aha”-upplevelse. Det viktigaste är samband, att se samband mellan ditt problem och allt omkring dig.
Man kan också slumpartat hitta inspiration genom att leta samband mellan problemet och något du slumpartat valt ut. Inspireras av sådant som är inom ditt yrkesområde, gränsar till det eller är helt avlägset från det.

Metoder och Verktyg

Dorte pratar om olika metoder för att hitta inspiration och komma fram till bra idéer. Hon nämner Mindmaps, Brainstorming, Kombination (se nedan) & Slumpartad inspiration (se ovan). Med Kombination handlar om att dra paralleller mellan olika aspekter av problemet. Gärna aspekter som står i kontrast mot varandra. Metaforer kan också ge dig nya infallsvinklar.
Dorte nämner också en metod för att ge konstruktiv kritik: Ängel, Djävul och Domare. Tre personer tar en varsin roll (alternativt tar en person alla roller). Ängeln ser det positiva med idén, djävulen ser det negativa och domaren avgör om det är  möjligt att utföra idén.

Ställ frågor

I boken uppmanas man att ställa frågor under den kreativa processen och i brainstorming o.s.v. Det är viktigt att veta att en fråga inte bara har ett svar. Ställ frågor som: Vad händer om…?, Varför inte…? Hur skulle en känd person/karaktär lösa ditt problem? Det kan också hjälpa att se ditt problem som själva frågan.

Förbättra kreativiteten och kom i rätt stämning

För att komma i rätt stämning är det läge att tänka på olika Stimuli som kan få inspiration att infinna sig eller få igång ditt kreativa tänk. Humor kan stimulera, även intressanta fakta, citat, gåtor m.m.
Tänk på att se till att din arbetsmiljö känns inspirerande och rätt för dig, hur vill du ha ditt skrivbord t.ex.? Samla på sådant som inspirerar dig och som du tycker om i klippböcker så att du inte glömmer och kan inspireras av detta igen. Funkar ju självklart att samla inspirationen digitalt också: bra webbsidor, bilder, artiklar m.m.

Webbdesign inspiration

Som webbdesigner och grafisk formgivare så hittar jag mycket inspiration i de metoder och verktyg som Dorte nämner i sin bok. I vår bransch kan tiden ibland vara knapp och då kan man behöva några bra inspirationskällor som leder en på rätt väg.

Här nedan hittar ni några bra bokmärken för designinspiration:

• webcreme.com
• webdesignfile.com
• awwwards.com
• cssawards.net
• siteinspire.com
• designspiration.net
• bestwebgallery.com
• dribbble.com
• colourlovers.com

Hoppas nu att jag har kunnat inspirera er. Om ni dessutom kommer över Dorte Nielsens bok så tycker jag definitivt att ni ska läsa den. Oavsett om man är designer, copy, webbutvecklare eller projektledare så är vi alla i behov av bra idéer för att lösa våra olika utmaningar på bästa sätt.

/Sofie Jonsson, Webbdesigner på Noc

Lyssna och mixa till det på thearcists.com

Bilder

Ska det göras så ska det göras ordentligt.

Vi bestämde oss tidigt att ta oss an byggandet av vår nya webb enligt konstens alla regler. Det kan låta som en självklarhet men när man knappt har tid med alla kundprojekt som det är, då är det inte så lätt att ge ett internt projekt den fokus och tid det förtjänar. Vi började med en grundlig analys av oss själva och vår dåvarande webb. Vi definierade ett syfte för vår webb och diskuterade noggrant våra målgrupper och vad vi vill att de ska veta, känna och göra när de besöker vår webb. Sen var det dags att bli kreativ och börja definiera hur vår nya webb skulle fungera och vad den skulle innehålla för att uppfylla syftet. Under den kreativa fasen var vi ömsom helt fria att spåna och ömsom kritiska och realistiska. Det skulle vara en webb som vi kunde leva med och underhålla, det var viktigt att vi inte tog fram något som vi sedan inte mäktade med att hålla liv i. Till slut hade vi konceptet klart för oss och gick vidare mot design.

Lite gammalt, lite nytt. Lite lånat, lite bytt.

Vi har haft samma grafiska profil ända sen aktiebolaget Noc bildades 2007. Det har varit en ganska fri grafisk profil, och vi har tillåtit variation för att spegla vår lekfulla och avslappnade natur.  Självklart inom vissa ramar. Svart, vitt och grönt har det mest varit. Fonten TW Cen MT har varit vår trogne följeslagare. Noc har färdats en lång väg sedan 2007. Växt, flyttat och utvecklats. Så i samband med designen av nya sajten passade vi på att piffa upp den gamla profilen lite. De som varit på vårt Linköpingskontor känner igen träväggen från vårt kreativa rum (det med klätterväggen) som kommer användas i en del av vårt material framöver. Trästrukturen med sina varma färger hintar också till kärleken till naturen som ligger Nocarna varmt om hjärtat.

Vi valde ett nytt typsnitt, Steelfish, för våra rubriker. Stiligt och uttrycksfullt i stora storlekar. I övrigt ville vi ha en ren design som gav innehållet plats, lättlästa brödtexter och stora bilder. De flesta på Noc är flitiga Instagrammare och allt bildmaterial är taget av oss själva i vardagen. Det ger en genuin känsla med mycket personlighet. Ingen fasad, vi vill visa vilka vi är.

Likt alla förändringar tar det ett tag att vänja sig, men med tiden och i samspel med annat material kommer den nya profilen bli en självklar visualisering av vad Noc är och står för. Loggan har vi inte rört dock, den är fortfarande Noc på alla sätt.

WordPress och responsive design.

Vår gamla sajt var byggd i WordPress. Vi valde att ligga kvar där eftersom sajten till stor del består av olika typer av blogginlägg och därför lämpar sig bra i WordPress. Det gjorde det även enkelt för oss att få med allt gammalt innehåll, som vi bara behövde skriva om lite och fixa nya bilder till. Sajten använder sig av HTML5 Boilerplate 2.0, CSS transitions, Media queries och massor av annat godis för oss tech-nördar. De som inte har stöd för det allra senaste får en något mindre effektfull men fortfarande fungerande upplevelse.

Självklart kunde vi inte lansera en ny webb utan att göra den responsive. Vi vill att sajten ska vara en njutning att besöka oavsett vilken enhet våra besökare använder för tillfället. Missa inte att läsa mer om Responsive design här. För touch-enheter har vi dessutom lagt in lite skön interaktion på startsidan och jobbsidan där man kan bläddra i sidled genom swipe. Till detta använde vi Swipe 1.0 som vi tycker funkar riktigt bra.
Utvecklingsfasen av projektet har varit en underbar iterativ process där hela Noc har varit inbladade. Alla har jobbat i en härlig symbios, utvecklat idéer, kodat, förbättrat designen, filat på innehåll och hjälpts åt på alla sätt.

Vi har även involverat några av er. Vi har smygvisat sajten för vänner, kunder, praktikanter och samarbetspartners för att få hjälp med att göra vår webb så bra som möjligt för våra målgrupper. Den feedback vi har fått har varit ytterst hjälpsam och har hjälpt oss förbättra sajten mycket mer än vi kunde gjort själva. Stort tack för att ni tog er tid att hjälpa oss!

Lansera då!

I vår iver att visa upp vårt verk för världen försökte vi vid flera illa valda tillfällen lansera webben. Eller vad sägs om när Emil och Johan, med André på telefon försökte lansera från flygplatsbaren 15 minuter innan boarding. Eller när vi försökte ”pub”lisera sajten från en pub i Dublin trots att Fredriks dator inte hade något av de lösenord vi behövde. Så säkra var vi på vårt beslut att vi till och med twittrade ”Nu lanserar vi!”. Något vi sedan snabbt fick dra tillbaka när det visade sig vara omöjligt. Vi ber om ursäkt till våra followers för att vi ropade varg.

Såhär i efterhand är vi glada att vi fick några extra dagar på oss att fila och till slut kom dagen då vi kunde trycka på knappen i lugn och ro. Nu är den ute och vi hoppas att ni gillar den lika mycket som vi gör. För hela poängen är ju att den är till för er. Vi hoppas att den ger en tydlig bild av vilka vi är, vad vi kan och vad vi har gjort. Och sen hoppas vi förstås att den får dig att vilja jobba med oss, jobba hos oss och hänga med oss.
Vi kommer fortsätta att fila och förbättra sajten framöver och tar gärna emot tankar och feedback från alla er. Den nya kontaktsidan kan vara lämplig att kolla in härnäst. Eller varför inte kolla runt bland våra jobb, läsa om Noc eller träffa The Noccers. Och håll ögonen öppna, för det kryllar av små gömda godbitar överallt!

Vi hörs!

Tidigare i veckan lanserade vi ett av de större projekten vi jobbat med på länge, nämligen nya realgymnasiet.se. Vi har jobbat med Real under många år och när de i våras gav oss möjligheten till en total remake av deras sajt satte vi tänderna i utmaningen med kraft! Vi gick igenom innehållet och skapade en ny lättbegriplig struktur, vi tog fram idéer kring funktionalitet och flöden, vi designade och vi utvecklade järnet.

Mest utmärkande i projektet var den spännande designen. Detta var nämligen vårt första skarpa projekt där vi gjorde en responsive design! Enkelt sammanfattat innebär det att layouten skalar om och förändras utifrån storleken på besökarens skärm. På så sätt funkar den i allt från en mobil till en stor datorskärm. Responsive design är en otroligt intressant och spännande approach som redan har förändrat mycket kring hur vi kan anpassa webben för den uppsjö av nya enheter som ständigt dyker upp. Det var utmanande att få grepp om de nya principerna, både designers och utvecklare slet hårt med att få det hela att lira. Men det var värt det när man fick se slutresultatet. Ni kommer att höra mer om responsive design framöver, det garanterar vi!

Vi vill också passa på att berömma gänget på Realgymnasiet som gjort ett fantastiskt bra jobb med innehållet, för det är ingen liten sajt att fylla.

Här kan man njuta av resultatet av allas hårda arbete. Tips: Dra i hörnet på webbläsaren och se layouten förändras!

Bilder

Resan tog oss från mysiga fik där vi pratade om hur vi kan bli ännu bättre för våra kunder, till vackra Howth utanför Dublin där vi hade fototävling.

Vi hade även turen att få hälsa på gänget på Ebow (Här kommer lite engelska så att de kan förstå vad vi säger om dem). Ebow is a leading digital agency in Dublin. They where kind enough to welcome us to their cool gallery for a little friday afternoon hangout. In the gallery, Ebows clients get the chance to show of their products. We loved the idea, something we have never seen before. We talked about our agencies, our work and our passions. And found that we shared many of the same ideas and challenges. All the way down to a shared client, Volkswagen! Having hit it off with our new Dublin-friends we continued on to the pub for more beers and talking about nerdy things. We had a great time and hope to see the guys from Ebow here in Sweden soon! Check out Ebow’s website, and have a look at their impressive work. We especially like the work they have done for the Irish museum of modern art. Thanks for the Guinness guys!

På tal om Guinness och muséer, så kunde vi självklart inte besöka Dublin utan att spana in Guinness-muséet. Det var en intressant vandring genom historien och en imponerande storytelling kring varumärket. Historien om hjälten Arthur Guinness som med sin ”hemliga ingrediens” lade grunden för ett anrikt varumärke. Inblicken i tillverkningsprocessen och betoningen på kvalitetsråvaror och expert-personal förhöjer ytterligare mystiken kring den svarta drycken. Besöket avslutades självklart med ett smakprov i skybaren.

Efter att nästan ha missat vårt flyg hem landade vi till slut glada och inspirerade, om än lite trötta i Sverige igen. Men efter några timmars sömn var vi redo att köra på, berikade med upplevelser och nya vänner. En lyckad resa helt enkelt!

Vad är det?

Enkelt förklarat kan man säga att en responsive design ”svarar” på besökarens skärmstorlek genom att skala och/eller ändra layout. Bilder och kolumner blir smalare eller bredare. När storleken går förbi en viss gräns där endast skalning inte räcker, då ändras layouten för att passa den nya storleken. Tex kan kolumner staplas under varandra istället för brevid varandra, en meny kan gå från horisontell till vertikal för att få plats bättre osv. Det är svårt att förklara i ord, men enkelt att förstå när man ser det in action. Allt du behöver göra är att dra i din webbläsares nedre högra hörn och ändra storleken på fönstret så kommer du se den här sajten förändras. Testa lite och så väntar vi sålänge…

Testat? Häftigt va? Och inte minst praktiskt. En stor fördel med responsive design är dess framtidsäkerhet. Eftersom layouten skalas så kommer små skillnader i skärmstorlekar inte kräva något nytt arbete. Om nästa iPhone eller Android-telefon har en lite annorlunda skärmstorlek och upplösning så anpassar sig ändå layouten snyggt.

En annan fördel är att allting är en och samma webb, oavsett enhet. Det är bara designen som förändras. Man undviker då att behöva administrera tex en separat mobilwebb.

Alternativ?

Det finns alternativ till responsive design som ger en del av vinsten med något mindre ansträngning. Det man kallar för ”adaptive design” innebär att man har ett antal fasta layouter och beroende på besökarens skärmstorlek så serveras mest passande layout. Detta är alltså responsive men utan skalningen. Det innebär att layouten inte kommer passa perfekt i de stolekar som ligger mellan de fasta layouter man har definierat. Man är då inte lika framtidssäkrad inför kommande nya enheter. Det är ett steg i rätt riktning och kan vara ett något enklare sätt att implementera principerna på en redan befintlig webbplats.

Lästips

Myntaren av uttrycket Responsive design heter Ethan Marcotte. Han är den som såg sambandet och potentialen i att kombinera de olika teknikerna och principerna som innefattas av Responsive. Hans artikelserie på A list apart är  bästa stället att börja på om man vill lära sig mer. Det är ganska tekniskt men förklarar även tanken med principerna på ett bra sätt.
Ett annat läs/lyssningstips är Paul Boags intervju med Ethan Marcotte som är lite mindre tekinsk och fokuserar mer på principerna och problemen man kan stöta på när man försöker göra sin sajt responsive.

Vi tycker det här är en otroligt spännande teknik som har stor potential att förändra vårt tänk kring webben och de enheter vi använder för att surfa den. Om du också tycker det låter intressant så varför inte komma förbi oss och snacka lite om det? Kontaktsidan lotsar dig vidare.