Den nya versionen kommer med en hel del nya funktioner. Ett exempel är inläggslås (post locking) som innebär att när en administratör går in och redigerar ett inlägg så sätts ett lås på det. Låset hindrar då andra administratörer från att redigera samma inlägg. Ett annat exempel är att man vid inaktivitet i redigeringsvyn får upp ett varningsmeddelande om att man snart blir automatiskt utloggad. Dessa funktioner kommer som i ett led i att göra det säkrare för dig som administratör att undvika att förlora nedlagt arbete med ett inlägg.

De nya funktionerna, och även den vidareutvecklade funktionen för autosave av inlägg, baseras på att servern har kontinuerlig kontakt med respektive administratörs klient. Syftet med Heartbeat API är just att simulera en aktiv anslutning mellan klient och server.

”The purpose of this API is to simulate bidirectional connection between the browser and the server. Initially it will be used for autosave, post locking and log-in expiration warning while a user is writing or editing.”

Konceptet som Heartbeat API är utvecklat kring kallas för polling. Istället för att servern har en aktiv anslutning till respektive klient hela tiden, skickar varje klient med jämna mellanrum en uppdatering till servern och säger ”Här är jag”. Eller med andra ord: Klienten skickar pulssignaler till servern för att tala om att den fortfarande lever. När klienten skickar sin pulssignal kan servern skicka tillbaka data. När data returneras triggas ett event hos klienten. Dessa event kan kärnfunktioner och plugin lyssna på för att utföra arbete när eventen triggas.

Möjligheten till att använda WebSockets för att åstadkomma aktiv anslutning mellan server och klient har varit uppe till diskussion hos teamet bakom Heartbeat API. Man kom dock fram till att tekniken än så länge är för ny och att den ännu inte stöds av tillräckligt många webbservrar. Därför blev polling-lösningen den väg man valde att gå.

Heartbeat API är en kombination av PHP- och JavaScript-API:er. Det har tillkommit ett antal WordPress-hookar för att exempelvis redigera frekvensen på pulsslagen eller skicka med data vid inkommande pulsslag. Dessutom tillkommer de event på klientsidan som jag nämner ovan. Dessa finns tillgängliga för att ditt JavaScript ska kunna bli notifierad vid inkommande pulssvar.

På vilket sätt tänker DU utnyttja Heartbeat API?

Det ska bli intressant att se vilka användningsområden vi utvecklare kan se med detta API, förutom de som nu initialt implementeras i WordPress 3.6. Mike Hansen på The Mojo Blog föreslår exempelvis att kommentarsflödet för ett inlägg kan uppdateras automatiskt allt eftersom kommentarer inkommer. En annan idé skulle vara en widget som visar i realtid hur många användare som är inloggade på sajten.

Din WordPress-sajt kommer snart få eget liv – hur tänker du utnyttja det?

Kombinerar CSS3 och film för att visa animationer

Hela sajten är en så kallad ”one page website”. Besökaren kan navigera mellan olika sektioner, steg för steg. Vanligast på sådana sajter är att man får scrolla mellan sektionerna. Här har Apple valt att animera övergångarna med en kombination av CSS3 och film. När besökarne inleder en scroll transformeras bildobjekten. Du kan själv testa genom att dra upp och ned några pixlar. När användaren har scrollat tillräckligt långt, tar ett filmklipp över. Detta klipp är övergången till nästa sektion.

Det är en snygg lösning. Problemet är dock att du måste vänta på att filmen har spelats färdigt till du kan navigera tillbaka. Tröskelvärdet för när animationen ska sätta igång är något lågt.

Ingen vanlig scroll

När klippet är slut visas en vanlig container med nästa sektions innehåll. Dock har den sektionen aldrig, i layouten, legat under den föregående. Istället har den varit osynlig och visas nu i fullskärmsläge. Det innebär att någon scrollbar aldrig uppträder. Denna scrollbar hade varit ett hinder i att göra de snygga övergångarna. Den hade ju flyttat sektionen i höjdled vid scroll, vilket hade inneburit konstiga hopp i animationen. Istället detekteras scroll med logik i ett JavaScript, som agerar motor för övergångarna.

Anpassning av datamängd

Apple verkar onekligen ha tänkt på datamängden. Filmklippen levereras sammanfogade i ett klipp, som i sin tur finns i olika storlekar beroende på besökarens plattform. Klippet verkar väga 18.6MB för vanliga desktop-användare.

Vad de väger på min iPhone har jag inte tagit reda på. Även om klippet är ganska stort påverkar det inte sidladdningen nämnvärt. Det behöver nämligen inte laddas klart innan sajten kan visas, eftersom man kan räkna med att besökaren inte navigerar fortare mellan sektionerna än vad som behövs.

Som vanligt lyckas Apple inte bara imponera på sina fanboys, utan även mig som frontend-utvecklare med sina sajter. Den här är inget undantag. Jag har inte sett den här typen av one page-design tidigare och hoppas fler anammar den. Förhoppningsvis ser någon till att göra den fullt fungerbar även för användare utan JS med. I Apples fall är sajten bara en tom, svart ruta…

Vem talar du med?

Det här hör väl egentligen inte till just detta avsnitt, men jag tar upp det ändå eftersom att det är en så viktig del i skapandet av din text. Vem är det du riktar ditt budskap till? Vem ska förstå och vem ska känna igen sig i det du skriver? Vem vill du påverka med din text?

Handlar din text om något tekniskt avancerat men riktar sig till en okunnig läsare så bör du inte svänga dig med en massa tekniska termer, utan använda ord som även en okunnig läsare kan förstå. Det handlar inte om att visa hur duktig du är på det du gör – det handlar om att få läsaren att förstå.

Budskap avgör story

När du skriver din text bör du vara på det klara med varför du skriver din text. Vill du berätta om vem ditt företag är? Vill du uppmana till förändring? Vill du främja samarbete? Beroende på vilket ditt budskap är behöver du lägga upp din story på olika sätt.

Här följer en kort sammanställning över de vanligaste berättelsetyperna. Dessa är tagna ur boken The Leader’s Guide to Storytelling, skriven av storytelling-gurun Stephen Denning. Det är en bra bok att läsa för dig som är intresserad av att veta mer. Jag avslutar varje berättelsetyp med lite egna reflektioner kring användandet av denna.

Uppmana till förändring – the springboard story

En vanlig anledning till att man berättar en story är att man vill uppmana till förändring. Man behöver få åhöraren att visualisera och genomföra den stora förändring som behövs. Enligt Denning bör man då använda det han kallar ”a springboard story”, en språngbrädeberättelse.

Språngbrädeberättelsen handlar om någon som har genomfört en liknande förändring som man själv står inför, gärna nyligen. Berättelsen har ett lyckligt slut, men även ett alternativt (dåligt) slut med vad som skulle ha hänt om inte förändringen genomfördes.

Den har en ensam huvudperson som åhörarna kan identifiera sig med. Det som är viktigt här är att det inte ska vara för mycket detaljer i berättelsen, det distraherar läsaren från sin egen utmaning.

Är du ledare för anställda och ni står inför exempelvis en omorganisation kan berättelsen alltså handla om ett annat företag som genomgått en liknande omorganisation, hur bra det gick för dem efter detta och vad som skulle ha hänt om de inte genomförde omorganisationen.

Detta används även ofta i reklam och vissa tv-program. Ta till exempel viktminskningsprogram á la Biggest Looser där man visar hur de mådde före och efter, berättar hur personen kämpat och hur det skulle ha varit om personen inte hade gått ned i vikt (besök hos läkaren som berättar om en dyster framtid om inget görs). Det får mig alltid att vilja börja äta bättre, träna mer och bli hälsosammare.

Kommunicera vem du är

För att en person ska följa dig behöver denne lita på dig, och för att lita på dig behöver denne känna dig. Du behöver alltså kommunicera ut vem du är.

En sådan story handlar ofta om en händelse i personens liv som visar på styrka eller sårbarhet – och som visar vad talaren lärde sig av händelsen.

Till skillnad från föregående berättelsetyp har en sådan här berättelse ganska mycket (meningsfulla) detaljer och kontext. Detta gör att man bör se till att läsaren har tid att ta till sig berättelsen.

Vid första anblick kan man tänka sig att detta främst är relevant för ledare som behöver vinna sina anställdas tillit, vilket också är fokus i boken. Men jag tror att det är minst lika viktigt att som enskild person på ett företag vinna sina kunders tillit.

Jag har till exempel två favoritmäklare (en i Stockholm där jag bodde förut och en i Gävle), och det som utmärkte just dem var dels att de var ärliga och dels att de bjöd på sig själva. De berättade om sitt eget liv, vilket gjorde att de blev mänskliga och lite mer ”vänner” än ”person i kostym och slips”.

Kommunicera vem företaget är

På samma sätt som du behöver ha en persons tillit för att kunna leda denna, behöver ditt företag (och du) kundernas tillit för att de ska köpa av dig. Och på samma sätt behöver de då känna ditt företag – vilka värderingar och vilken kundservice det har. Ditt företag ger kunderna ett löfte.

Denna story skapas ofta av kunderna själva, och sprids via ”word-of-mouth”, eller så sprids den via produkterna själva. Det viktigaste här är att när man har bestämt sig för sitt företags ”löfte” till kunderna – så håller man det!

Se till exempel Body Shop som skapade sitt starka varumärke utan vanlig annonsering. De låter sina produkter tala för sig själva med naturliga, icke-djurtestade, ingredienser förpackade i enkla återvinningsbara förpackningar. Dessutom är de starkt engagerade i miljöfrågor, använder små lokala producenter och mycket mer.

Man kommunicerar alltså inte nödvändigtvis sitt löfte uttryckligen i ord, utan man kan som sagt även visa den genom sina produkter och sitt agerande.

Överföra värden

Ett område där storytelling är väldigt effektivt är när man ska överföra värden för att skapa tydliga regler. I dessa berättelser använder man sig ofta av liknelser som utspelar sig i någon generell historisk tid samt att man även här använder sig av väldigt lite, relevant, kontext. Fakta i berättelsen kan vara hypotetisk, men den måste vara trovärdig.

Man kan, och bör, självklart även använda detta i kommunikationen med kunderna. Jag kan ta en text jag själv skrev till mitt (fd) företags hemsida som exempel. För att föra fram vad jag menade med värdeordet hållbarhet skrev jag följande:

”När min man skulle köpa en varm och skön tröja för någon vinter sedan hittade han en tröja i ull som han tyckte jättemycket om. Den var dessutom på REA! Men även då kostade den 800 kr då den var av ett märke med bättre kvalitet.

Efter lite dividerande kom vi dock fram till att detta köp skulle bli mer hållbart än om han skulle köpa en billig tröja med sämre kvalitet. Långsiktigt skulle det dyrare köpet vara bättre både för plånboken och miljön – och säkert även arbetsförhållandena.

Det är detta som jag strävar efter: att bidra till ett hållbart samhälle genom att erbjuda äkta hantverk som värnar om såväl natur som medmänniskor. Att du dessutom vet exakt vem som gjort din vara ser jag dessutom som ett stort plus!”

Det är självklart även extremt viktigt att du lever som du lär. Skulle jag skriva ovanstående text och sedan sälja billiga smycken som går sönder efter några användningar skulle det inte vara mycket värt.

Främja samarbete

Denning säger att man kan främja samarbete genom att skapa ett gemensamt berättande kring en grupps oroligheter och mål. Man kan då börja med en gruppmedlems berättelse, som bör vara rörande nog att inspirera andra att berätta sina berättelser. På detta sätt bygger man upp en känsla av samhörighet genom sitt delade perspektiv.

Detta handlar dock främst om muntligt berättande så det är inget jag går in mer på här.

Tämja djungeltrumman

Rykten och skvaller finns i alla organisationer. Ignorerar du dessa riskerar de att skada företaget och distrahera personalen eller externa investerare.

För att möta ryktet kan du använda dig av en story som får det att verka osant eller orimligt. Du kan här använda dig av enkel satir för att underminera ryktet, ryktets skapare eller sig själv. Men håll dig ifrån illvilligt förlöjligande vilket kan få motsatt effekt – med all rätt.

Är ryktet däremot sant, eller troligt, kan du inte göra så mycket mer än att erkänna ryktet, sätta det i perspektiv och gå vidare.

Jag tar ett exempel från boken, fritt översatt till svenska.

Under 1992 års presidentkampanj i USA attackerade president George H. W. Bush obevekligt Hillary Clinton för att han ansåg henne olämplig som Landets första dam (First Lady, aka presidentens fru). Detta baserade han på att hon medgett att hon inte hade ägnat sitt vuxna liv till att baka kakor. Vita husets attack avslutades dock när Clintons kampanj svarade med följande: ”George Bush isn’t running for President – apparently he’s campaigning to become First Lady”.

Dela kunskap

Massor av den kunskap som finns i företag finns endast i de anställdas huvuden. Den är inte nedskriven någonstans utan kommuniceras genom berättelser.

En sådan berättelse, där målet är att dela kunskap, skiljer sig från vanliga berättelser genom att de saknar hjälte och intrig. De handlar mer om problem och hur (och varför) man löste dem – eller inte löste dem.

I berättelsen hittar man en beskrivning av problemet, omständigheterna, lösningen och förklaringen. Detta ger berättelsen en ganska negativ ton och fokusen på detaljer för varför någonting fungerade gör att berättelsen är ganska ointressant för en utomstående.

Samlar man in dessa berättelser är det viktigt att de sprids, och att de sprids på ett sätt så att de faktiskt används. Mängder med information som inte används gör ungefär lika mycket nytta som den som är fast i enskilda individers tankar.

Leda in i framtiden – dela dina visioner

Genom att berätta en story kan man få människor att känna sig bekanta och bekväma med framtiden som berättas, för att på så sätt förenkla förändringsprocessen.

Detta är dock en väldigt svår story att klara av. Man måste ge lyssnaren/läsaren nog information för att de ska kunna föreställa sig framtiden så som man vill, men inte för mycket detaljer som kan tänkas förändras och därmed bli felaktiga. Storyn måste kunnas omformas i mottagarens tanke vartefter tiden går.

Ett alternativ till denna story är den berättelse som uppmanar till förändring (the springboard story).

Text för webben

En sista sak jag vill poängtera är att det är två helt skilda saker att berätta dessa storys muntligt och skriftligt (även om ovanstående gäller för båda), och det är två helt olika saker att skriva för print och att skriva för webb.

När du ska skriva texter till din hemsida behöver du tänka på exempelvis att hålla texten kort, ha relevanta rubriker, skriva det viktigaste först och lyfta fram viktig information på rätt sätt.

Du kan läsa mer i internetguiden Skriva för webben av Erik Geijer (pdf-fil).

Nå fram med ditt budskap

Enligt Stephen Denning är en av de saker som skiljer storytelling från vanligt berättande att storytelling har ett tydligt syfte. Du berättar inte om ditt företag bara för att roa, utan har ett syfte med att berätta om det. Du vill att de ska lita på dig, och i längden bli din kund.

Se till att få ut det mesta av din text genom att se till målgrupp, typ av budskap, forum för texten – och för guds skull, lev som du lär!

Nästa inlägg

Det var det sista inlägget om storytelling för denna gång. Har du några bra exempel på användning av storytelling, har du använt det själv, har du frågor eller är du intresserad av att veta mer? Skriv gärna en kommentar, eller hör av dig!

I nästa inlägg kommer jag att skriva om WordPress-pluginet WooCommerce, tills dess får ni njuta av sommaren som äntligen infunnit sig!

Och så ett citat av Blake Mycoskie, VD på Tom’s Shoes:

Tidigare var man tvungen att manuellt ladda ner typsnitten som man ville använda i designarbetet, vilket egentligen inte har varit något problem – ända tills man insåg att det fanns en bättre lösning.

Vad är Sky Fonts?

Sky Fonts är en tjänst som låter dig temporärt installera de typsnitt du vill använda. Använder du flera datorer så synkroniseras de mellan dem. Tidigare var det enbart kopplat till biblioteket Fonts.com, där man genom Sky Fonts kunde hyra de typsnitt man ville använda. Men nu finns också en koppling till Google Fonts, vilket öppnade mina ögon för tjänsten. Sky Fonts synkar inte bara teckensnitten mellan datorer, utan ser också till att de är uppdaterade till den senaste versionen.

Sky Fonts har främst kortat ner ledtiderna, från att man hittar ett typsnitt till det att man kan använda det i ett program. Efter installationen dyker en ikon för programmet upp i menyn hos OSX där man lätt kan se över sitt urval hos Google. Vyn visar hela katalogen ur Google Fonts och genom att klicka på ”Add” laddas det valda typsnittet ner och installeras  automatiskt.

I framtiden skulle jag också vilja se möjligheten att jobba med typsnitten direkt, utan att behöva ladda ner dem lokalt. En integration i exempelvis Sketch eller Photoshop som låter dig välja direkt ur Googles bibliotek hade varit otroligt smidigt. Jag tror också att det hade fungerat ganska bra, med tanke på att man ständigt är uppkopplad mot internet.

Om du är sugen på att prova Sky Fonts rekommenderar jag att du besöker deras hemsida och laddar ner det. Programmet finns både för Mac och PC. Skriv gärna vad du tycker om det i kommentarsfältet.

Idag kommer jag gå igenom två förslag till lösningar på detta, ett som utnyttjar body_class()-metoden och anpassad CSS samt ett där du lägger till ett filter till hooken nav_menu_css_class.

Båda metoderna som jag idag går igenom förlitar sig på att administratören anger en CSS-klass i adminpanelen för det menyval som ska markeras. Det fungerar fint för den här genomgången, men är ärligt talat inte särskilt användarvänligt. I slutet av den här artikeln går jag igenom alternativ till detta som jag tycker är bättre ur administratörens synvinkel.

Projektmiljö för demonstration

Till att börja med behöver du en projektmiljö där du kan laborera med de olika metoderna för markering av menyval. Om du är ivrig att få höra om lösningsförslagen kan du hoppa över detta stycke och gå vidare till nästa del.

Jag har tagit en ren WordPress 3.5.1-installation och skapat ett nytt tema. I temats style.css ser jag till att ange hur jag vill att det aktiva menyvalet ska se ut genom att ange regler för .current-menu-item.

I functions.php registreras en meny som heter ”main-menu” och en Custom Post Type med namnet ”event”.

Och i header.php ser vi till att skriva ut menyn ”main-menu”:

I mitt exempel har jag valt att menyn ska innehålla alternativen ”Start”, ”Kalender” och ”Om oss”. ”Om oss” ska vara en vanlig artikelsida, ”Kalender” är tänkt att visa de inlagda eventen och ”Start”, ja det är startsidan.

Vi skapar sidorna och lägger till respektive menyalternativ. Som jag nämnde tidigare ska vi också använda oss av WordPress funktionalitet för att ange egna CSS-klasser för menyalternativ. För att få tillgång till dessa måste du på adminvyn för menyer kryssa för ”CSS Classes” under ”Screen Options” > ”Show advanced menu properties”.

Här anger vi CSS-klassen ”events” för kalenderalternativet:

Går jag in på Kalender-sidan ser menyn ut så här:

Klickar jag mig vidare till ”Ett kommande event” blir det dock inget menyalternativ som är markerat, vilket kan vara förvirrande för dig som besökare. Var på sajten har jag egentligen hamnat nu?

 Målet idag är att få ”Kalender” att markeras även när man är inne på ett specifikt event.

Alternativ 1: body_class() och CSS

Som du ser på rad 11 i header.php ovan anropar jag WordPress inbyggda metod body_class() i <body>-taggen. Det den metoden gör är att skriva ut ett class-attribut med ett antal klasser som är aktuella för den vy som besökaren är inne på. Om du vill lägga till egna klasser kan du göra det med ett sträng- eller array-argument till body_class().

När besökaren är inne på ett av våra event lägger WordPress automatiskt in body-klassen ”single-event”. Det gör att vi i vår CSS-fil kan ange att menyalternativet med klassen ”events” ska markeras som aktivt om det ligger i body-taggen med klassen ”single-event”

Vi uppdaterar style.css:

Notera rad 11 som just lagts till. Ladda om singelvyn för ”Ett kommande event” och du får ”Kalender” markerat som aktivt menyalternativ.

Alternativ 2: Filtrera menyalternativens klasser med nav_menu_css_class

Vill du istället lösa problemet med PHP-kod går det faktiskt lika bra. Då använder du dig av filterhooken nav_menu_css_class.

Metoder som filtrerar nav_menu_css_class kan ta emot två argument: $classes och $menu_item. Det förstnämnda argumentet är en array med alla CSS-klasser för aktuellt menyalternativ, och argument nummer två är specifikationen av menyalternativet som ett WP_Post-objekt. Returvärdet från filtermetoden ska vara den filtrerade $classes-arrayen.

Det vi vill göra i vår filtermetod är att (1) kolla om vi är inne på en singelvy för event och (2) kolla om aktuellt menyalternativ har klassen ”events” angiven. Om båda stämmer så lägger till ”current-menu-item”-klassen till $classes-arrayen så att menyalternativet markeras som aktivt.

Vi återställer den ursprungliga style.css och lägger istället till lite kod i functions.php. Vår uppdaterade functions.php ser ut som följer. Den nya koden ser du från rad 35 och framåt:

Men användarvänligheten då?

Ja, hur var det nu med användarvänligheten med dessa lösningar? Att förlita sig på att administratören ska hitta Screen Options-knappen, aktivera ”CSS Classes” och därefter fylla i rätt värde i fältet för CSS-klass är rent utsagt dumt i mina ögon. Alla lösningar som kräver att man lägger till stycken i sin manual tycker jag är ett användarmässigt bakslag.

Jag har sett andra förslag på lösningar där man har hårdkodat kopplingen mellan en posttyp och ett menyalternativ eller artikelsida (exempelvis mot post-ID eller slug), men det är ju ännu sämre än CSS-klasserna. Var ligger modulariteten där?

Andra har föreslagit att ha en inställningsvy för sitt tema där man helt enkelt väljer en artikelsida för respektive posttyp i en dropdownmeny. Här börjar vi närma oss en bra lösning även för en mindre teknisk administratör. Det jag dock inte gillar med den lösningar är att det är en väldigt ologisk placering av en sådan inställning. Ska jag koppla samman en artikelsida med en posttyp gör jag det givetvis hellre i ett metafält för min sida.

I slutändan har jag dock ett sista förslag som jag antar att ett plugin med fördel kan lösa. Vilket problem var det egentligen vi utgick ifrån? Jo, vi vill att ett menyalternativ ska markeras som aktivt när man är inne på en singelvy av en posttyp. Var är det då mest logiskt att en sådan inställning ligger? Givetvis i vyn där du redigerar dina menyalternativ, något i stil med mitt förslag nedan. Du håller väl med?

I mitt förra blogginlägg gav jag dig fem mer konkreta tips på grundläggande saker du bör göra och tänka på för att komma igång med storytelling i ditt företag.

I detta blogginlägg kommer jag att berätta hur du bygger upp en berättelse, och vad som gör berättelsen bra. Detta kan du sedan använda för att till exempel skriva företagets skapelseberättelse till hemsidan. Mer om vilka olika berättelser du kan använda dig av kommer i nästa inlägg.

Narratologi – berättelsens uppbyggnad

Narratologi är studiet av berättandet och berättandets natur, funktion och struktur. Aristoteles definierade en berättelse så som en serie handlingar och/eller händelser som tillsammans bildar en enhet så att man kan urskilja en början, en mitt och ett slut. Fler har definierat berättelser på liknande sätt, men utöver det har det varit svårt att hitta universella strukturer. Det finns dock fyra element som återfinns i alla berättelser: budskapet, konflikten, rollfördelningen och handlingen.

Budskapet

Budskapet, eller berättelsens sensmoral som det också brukar kallas, är det budskap eller kärnvärde som ska förmedlas och förtydligas genom berättelsen. Utan budskap kan du lika gärna låta bli att berätta din historia.

När det handlar om vardagliga berättelser kan det vara till exempel att man inte ska ropa på hjälp om man inte behöver den (pojken och vargen) eller att kärleken övervinner allt – även döden (Romeo & Julia). I företagandet handlar det mer om att berätta något om ditt företag eller dess produkter.

När du berättar en berättelse om ditt företag, en produkt eller liknande behöver du alltså fundera på vad som är ditt budskap. Vad är det som ska förmedlas via berättelsen? Är det att ditt företag har extremt bra kundservice? Eller kanske att produkten du berättar om är väldigt miljövänlig? Eller något helt annat?

Kom bara ihåg – ett budskap per berättelse!

Konflikten eller hindret

Utan konflikt blir det ingen bra historia – bara tråkigt och förutsägbart. Eftersom att människan strävar efter balans och harmoni gör en konflikt att vi vill finna en lösning på problemet, vilket gör att vi agerar. Det är alltså konflikten som för berättelsen framåt. En vanlig konflikt är till exempel kampen mellan det goda och onda, vars kamp förmedlar budskapet till åhörarna. Det kan även handla om ett hinder som måste övervinnas, till exempel att huvudpersonen måste göra något denne inte själv tror att hen kan.

I din berättelse kan en konflikt exempelvis handla om en missnöjd kund (och hur du vänt detta till en nöjd kund) eller motstånd du mött i form av regler, tillstånd, byråkrati, kostnader, resursbrist eller liknande. Ett hinder kan vara hur du övervunnit någon rädsla (till exempel att sälja) för att lyckas, eller kanske hur du fått kämpa för att samla ihop pengar för att kunna starta företaget.

Rollfördelningen

För att kunna levandegöra konflikten eller hindret krävs det karaktärer i din berättelse. Det finns sju karaktärer, eller typroller, som används av i stort sett all senare narratologi. Dessa är: skurken, givaren, hjälparen, den eftersökta personen, sändaren, hjälten och antihjälten. I boken Storytelling – Branding in Practice av Fog et al använder man något andra roller i den så kallade Sagomodellen. Där talar man om motståndare, hjälpare, mål, välgörare, hjälte och förmånstagare.

Flera av dessa roller eller karaktärsdrag kan finnas i en och samma person, eller så kan flera personer ha samma karaktär eller roll. Även djur, företag, känslor eller liknande kan inneha dessa roller.

Här är ett exempel på en företagsberättelse (här översatt till svenska) från ovan nämnda bok:

”Det var en vanlig morgon och människor började dyka upp till jobbet på ett av Amerikas ledande IT-företag. En stor svart limousin körde långsamt upp och parkerade utanför den imponerande entrén. Företagets VD klev ur bilen. Han var en av grundarna till företaget, och som vanligt gick han upp för trapporna till huvudentrén. Han skulle precis gå in genom de stora glasdörrarna när han hörde en röst säga, ”Jag är väldigt ledsen herrn, men jag kan inte släppa in dig utan ett ID.” Säkerhetsvakten, som hade jobbat för företaget i många år, såg hans chef rakt i ögonen utan att visa några känslor. VD:n var mållös. Han kände lönlöst i sina fickor. Troligen hade han glömt ID-kortet hemma. Han såg ännu en gång på säkerhetsvakten, kliade sig på kinden och funderade. Sen gick han tillbaka till limousinen. Kvar stod säkerhetsvakten – ovetandes om att han morgonen efter skulle vara befordrad till säkerhetschef.”

Här är säkerhetsvakten både hjälten och välgöraren, VD:n är motståndaren, hjälparen är säkerhetsvaktens engagemang, målet är ett säkert företag där regler upprätthålls och förmånstagaren är företaget och dess anställda.

I din berättelse är hjälten troligen företaget, en anställd, en produkt eller kanske du själv. Motståndaren kan till exempel vara en missnöjd kund, en anställd som inte tror på sig själv, en chef eller liknande. Denna person ska driva berättelsen genom att tvinga hjälten att jobba mot personlig utveckling och att lösa konflikten.

En viktig sak att tänka på när du skapar din berättelse är att de som läser berättelsen behöver kunna känna igen sig i, identifiera sig med och känna empati med dessa karaktärer. Detta gör att du måste vara noga med att redan innan reda ut vem som är din målgrupp.

Handlingen

Det finns olika sätt att bygga upp själva handlingen på. Två vanliga sätt är att antingen berätta en sak i taget enligt en stram struktur, eller att dela upp berättelsen i en början, ett klimax (upptrappning av konflikten) och ett slut (konflikten löses).

En mer omfattande berättelse börjar med ett anslag där du ska fånga läsarens uppmärksamhet och hjälten presenteras. Sedan kommer en presentation av konflikten vilket visar riktningen på resten av berättelsen, samt att målet ofta blir tydligt och vi presenteras för motståndaren. Konflikten trappas upp och når snart ”point of no return” där hjälten tar ett avgörande beslut, för att sedan fortsätta eskalera tills den når sitt klimax. Där konfronterar hjälten motståndaren och konflikten löses (förhoppningsvis), för att historien sedan ska mattas av och avslutas.

Berättelsen behöver inte följa en kronologisk ordning utan kan hoppa i tiden.

Din berättelse är din

Det som är så bra med storytelling är att berättelsen är din. Det är inte så troligt att någon annan har varit med om exakt samma sak som du, vilket gör det till ett utmärkt sätt att särskilja dig från konkurrenter, även om ni är väldigt lika på andra sätt.

Se till att utnyttja detta och visa vad som har gjort att du och ditt företag är de ni är i dag.

Denna veckas uppgift och nästa inlägg

Till nästa inlägg i serien, som kommer den 7 juni, kan du fundera på vilka berättelser du skulle vilja berätta om dig och ditt företag. Ta gärna förra inlägget i serien till hjälp.

I mitt nästa blogginlägg om storytelling, som även blir det sista för denna gången, kommer jag att skriva just om vilka olika sorters berättelser man kan använda sig av inom corporate storytelling. Då kan du se hur du bör anpassa dina berättelser beroende på syftet med den.

Min vana trogen avslutar jag med ett citat, denna gång från Strunk och White som skrev stilguiden The Elements of Style:

”Who knows why certain notes in music are capable of stirring the listener deeply,
though the same notes slightly rearranged are impotent?”

Referenser och lästips

Dennisdotter, E. & Axenbrant, E. (2008). Storytelling – Ett effektivt marknadsföringsgrepp. Liber AB: Malmö.

Fog, K., Budtz, C., Munch, P. & Blanchette, S. (2010). Storytelling – Branding in Practice. Samfundslitteratur Press: Frederiksberg C.

Mossberg, L. & Nissen Johansen, E. (2006). Storytelling – Marknadsföring i upplevelseindustrin. Studentlitteratur AB: Lund.

Fresh UI-kit

Fresh UI-kit är en snygg samling element till för att skapa ett eget användargränssnitt. Här finns knappar, sökfält, sliders och ett väldigt snyggt volymreglage. Ladda ner  Fresh UI-kit här.

Wired

Wired är ett väldigt enkelt – men gediget – wireframepaket, skapat av Mark Collins. Här finns väldigt många element att välja mellan och det är sällan man upptäcker att något saknas när man skapar wireframes med detta paket. Den mjuka framtoningen gör att man kan skapa tydliga wireframes, som också är behagliga att titta på. Ladda ner Wired här.

Två mallar till iPhone 5

Denis Rojčyk har skapat en samling användbara mallar för iPhone 5, vilket kan vara användbart när du designar mobila appar och webbsidor. Du kan ladda ner Denis mall. Om man gillar att designa appar för iPhone så får man inte heller missa Bryan Clarks uppsättning av UI-element från iOS6. Här finns det mesta från iOS standardutförande, återgivet i Sketch. Bryans mall hittar du här.

Det är kul att verktygslådan för oss som använder Sketch växer. Jag blir själv väldigt inspirerad och ska försöka bjuda på lite eget material under de kommande veckorna. Har du tips på något bra UI-kit, eller annat bra så är du självklart välkommen att tipsa om det i kommentarsfältet.

Sthlm Startup Hack är ett öppet hack i den mening att det inte finns något speciellt tema eller en bestämd teknik att använda. Det är helt enkelt bara deltagarnas fantasi som kan sätta gränserna. Okej, det och att man har tio timmar på sig.

Feels.io

Feels.io är en iPhone-app där man tillsammans med vännerna runtomkring sig spelar in korta videoklipp för att fånga stundens känsla.

Jag gillade skarpt det man fick se av appen när laget hade sin presentation. De hade verkligen lyckats ta fram ett tilltalande och snyggt gränssnitt, vilket känns viktigt när funktionaliteten handlar om att förmedla känslor.

Sunny Runner

En löpningsapp till mobilen med ett enda syfte: Att tala om för dig vilka dagar det passar dig bäst att sticka ut och springa, sett ur väderlekssynpunkt. Appen kombinerar användarens kilometermål för veckan med väderleksutsikter från forecast.io.

Jag tycker det här var en rolig idé, och något som ligger rätt i tiden i och med den tränings- och löpningshype som råder landet runt. Sunny Runner hade kanske några lunchrumsgrannar behövt igår, då de ställde in sin planerade lunchlöpning på grund av några regnskvättar. Själv gillar jag att löpa i lätt regn, så en inställning för väderpreferenser i appen skulle vara att föredra.

Code Volley

Laget bakom Code Volley gick till botten med ett problem som varje utvecklare kan ställas inför: Jag behöver få någon att granska min kod, men vem ställer upp? Code Volley löser detta genom att låta användarna genomföra code reviews på varandras kod. Kickern är att du kan bara få en code review om du själv har utfört en åt någon annan.

Det jag gillade främst med det här hacket var deras presentation. På den minut man hade på sig att presentera hann de både måla upp problemet de såg, diskutera lösningsförslag och sedan visa sin lösning på problemet.

Detta var tre exempel dragna ur en hel uppsjö av kreativa projekt från SHTLM Startup Hack. Om du vill läsa om fler projekt, ta en titt på Hacker League.

Målen för hackathons är inte alltid ett körbart resultat. Ibland passar många team på att lära sig nya tekniker, utveckla sina kunskaper eller bara lattja med koden. Vi ville dock nå fram till en färdig produkt. För att lyckas med det behövde vi identifiera de största hindren och ta oss förbi dem. I det här inlägget tänkte jag berätta om några delar av vår strategi.

Upprätta en backlog med tydliga och korta aktiviteter

Planeringen av projektet inleddes med ett möte där vi upprättade en backlog. Vi visste att hela scopet inte skulle kunna täckas, utan såg till att endast ta med de fundamentala funktionerna i v1.0. Andreas utsågs till projektledare. Han förde in alla aktiviteter i loggen. Därefter bestämde vi vilka aktiviteter som skulle ingå. Genom att hålla scopet smalt så att vi kunde ha en releasbar version med några timmars marginal innan deadline. Denna backlog skulle vi även komma att jobba utifrån vid eventuell tid till vidareutveckling.

Ha en färdig infrastruktur

Ett sånt här projekt är beroende av en tydlig infrastruktur. I vårt fall är den ganska rudimentär. Vi kör en VPS med webbserver och databas. I vilket fall som helst ville vi ha den på plats innan hackets start. Dessutom behövde vi ha utvecklingsmiljöer på samtliga team-medlemmars datorer. Att sätta upp dem under hacket skulle bara ta onödig tid och leda till frustration om (oftare ”när”) något krånglade. Fokuset kunde nu istället ligga på aktiviteterna i backloggen.

Korta och många sprintar för att kunna anpassa planen efter behov

En planering brukar oftast inte kunna följas slaviskt. Det händer att man behöver prioritera om och eventuellt göra avkall på viss funktionalitet till fördel för annan. Dessutom ville vi hela tiden kunna ha en uppdaterad status av hur nära release vi var. Därför bestämde vi att ha många sprintar som avslutades med gemensam genomgång. Vid avslutet planerade vi även nästkommande sprint.

De tio timmarna delades in i fem sprintar á två timmar. Vår backlog innehöll inga aktiviteter som behövde ta längre tid än så. Ofta är en aktivitets scope subjektivt. Här krävdes den minsta insatsen för att nå målet men samtidigt vara hållbar. Varje sprint avslutades med en genomgång om 15 minuter. Vi presenterade vad varje person hade gjort. Som produktägare kunde Anders prioritera aktiviteterna och välja vilka som skulle göras under nästa sprint. Högst prio hade dock alltid aktiviteterna för v1.0.

Skulle en aktivitet vara för kort för en hel sprint var det bara att vända sig till backloggen för att hitta en ny.

Internetuppkopplingen gör att man inte kan dela för stor data

På ett hackathon brukar Internetuppkopplingen inte vara alltför tillförlitlig. Med lokala utvecklingsmiljöer och versionshantering i git behövde vi inte dela stora datamängder med varandra. Det enda som krävde extra mycket bandbredd var databasen med alla näringsvärden. Vi valde att distribuera den via ett USB-minne. När vi skulle deploya till produktionservern fick vi passa på att ta en kopp kaffe när den laddades upp.

Det finns ingen tid för testning – låt andra göra det

Under ett hackathon är man väldigt ivrig att beta av aktivitet för aktivitet och hinner inte testa koden så noga som man skulle önska. Det behöver dock inte vara något problem. Är målsättningen att nå en prototyp gör det inget. I ärlighetens namn var vi också ganska slarviga med testningen. Ingen code review eller unit testing fanns med i planen. Däremot hade vi nytta av att göra en tidig release. Det fanns flera personer ute i cyberrymden som läste vår dokumentation och testade API:t. Redan under minglet hann vi med att träffa Peter Hellberg som hade skrivit ett Ruby-gem för API:t. Han hade mycket konstruktiv feedback om både dokumentationen och funktionerna. Vårt tips är alltså att förbereda vänner och bekanta på att vara standby under dagen och beredda att testa.