Medievärldens redaktionsblogg

Utveckling av sajten – och övriga plattformar

Formgivarna har ordet

Mitt namn är Patrik Engberg och jag jobbar på en webbyrå som heter Burro. Det är vi som har gjort den nya designen för Medievärldens sajt och jag tänkte i detta blogginlägg dela med mig lite av hur designprocessen har sett ut.

Vanligtvis när vi gör ett designuppdrag så brukar vi först göra ett informationsdesignjobb där vi listar all information på siten och sedan delar in den i kategorier och utifrån dom identifierar och skissar upp så kallade “wireframes” för alla nyckelvyer. På Medievärlden var detta arbetet redan gjort så vårt åtagande började direkt i den grafiska designfasen.

Det första vi gjorde var att vi skrev ut alla unika vyer som Medievärlden hade och tejpa upp dom på en vägg. Sedan skrev vi ner alla intryck vi fick på post-it lappar och satte upp på våra utskrifter. När vi gick igenom alla lapparna kunde vi konstatera att den gamla designen var väl uppstyrd när det kom till avstånd, läsbarhet på texter, och skalbarhet men mindre bra när det gällde tempo på artikellistningar, dynamik mellan olika innehållstyper och framför allt saknades det en tydlig grafisk profil som gav liv åt innehållet.

Nästa övning vi gjorde var att vi skrev ut 10-15 andra siter med liknande innehåll som Medievärlden och satte post-it lappar på dom med saker vi gillade och saker vi inte gillade. När vi tittade på våra lappar kunde vi konstatera att färgkodat innehåll ofta lyfter en site och är ett tacksamt sätt att få in mer färg. Vi kunde också konstatera att varierande rubriksstorlekar i artikellistningar skapade ett behagligare tempo och gav mer fokus på artikellistningen.

Detta och massor av andra synpunkter och intryck tog vi med oss när vi satte oss och började skissa.

Min kollega Fredrik Anvin började titta på startsidan medan jag började titta på hur man kunde särskilja dom olika undersidorna från varandra och ge dom mer individuell identitet. Eftersom den tekniska plattformen var så välbyggd kunde vi med små designändringar åstadkomma stora förändringar i hur man upplever siten. Sakta men säkert började en identitet och ett grafiskt koncept växa fram som byggde på tydlighet, fokus på funktionalitet och ett färgkodningssystem som blev genomgående för alla undersidor.

Efter en lyckad implementation med i stort sett inga kompromisser så ligger sedan en tid tillbaka den nya designen online tillsammans med en för webben uppdaterad logotype. Hoppas ni som besökare gillar den lika mycket som vi som kreatörer är nöjda med den!

Stort tack till Per SandströmKollegorna och Tommie NordholmA Pretty Different Factory som båda gjort fantastiska jobb med implementation och strategi/koncept. Och såklart Axel Andén som gett saklig och värdefull feedback under arbetets gång. Har ni frågor eller synpunkter får ni gärna maila mig på patrik@burro.se Tack för ordet! Patrik Engberg Art Director Burro

Written by Axel Andén

juni 8, 2010 at 2:30 e m

Publicerat i form, utvecklingsarbete

Tagged with ,

Medievärlden 6 månader senare

Nu har det gått ett halvår sedan Medievärlden blev digital, tre månader sedan vi fick en ny sajt byggd i Drupal, och tre veckor sedan vi fick en ny form. Med dessa processer bakom oss har vi kunnat fokusera ännu mer på journalistiken.

De senaste veckornas teman om Tryckeriernas framtid och Medborgarjournalistik har varit mycket uppskattade, att döma av de reaktioner vi fått. Och artiklarna om Södra Sidan visade att det går att hitta bra former för långa och fördjupande reportage även på webben.

Vi har också uppnått en hygglig balans mellan de snabba obearbetade nyheter, de genomarbetade egna nyheterna och de större och mer tidlösa tema-jobben.

Den senaste månaden har genomsnittlig tid på sidan ökat från 2 till 3 minuter och vi har varit uppe och nosat på 10 000 unika besökare. Nyhetsbrevet har drygt 5 000 prenumeranter och på Twitter har vi knappt 2 000 följare.

Vi har också märkt en kraftig ökning i efterfrågan på annonser, framför allt platsannonser, och har därför fått tredubbla antalet annonsplatser i högerspalten.

Samtidigt fortsätter givetvis det tekniska utvecklingsarbetet och vi kommer snart att lansera våra bloggar.

Written by Axel Andén

juni 7, 2010 at 10:39 f m

Publicerat i arbete och metoder, utvecklingsarbete

Tagged with

Medievärlden – i ny skrud idag

I helgen har vi smugit ut Medievärldens nya form. Den har skapats av Patrik Engberg och Fredrik Anvin på formbyrån Burro och implementerats av Per Sandström på Kollegorna.

Undersidorna har fått egna färger. Sidorna för Tema och Diskussion har fått ett eget utseende med en slide i topp, och på förstasidan presenteras fördjupande material i tre olika slides: Tema, Diskussion och Mediefolk.

I artikelspalten på förstasidan kan vi nu ha olika rubrikstorlekar för att markera tyngden i materialet.

Vi har också fått en tydligare koppling mellan en artikel och det Tema den är kopplat till, ett diskussionsinlägg och den diskussion den är kopplad till, och en artikel och det Mediefolk den är kopplad till genom att de senaste artiklarna i Temat / Diskussionen / Mediefolket visas ut i högerspalt på artikelnivå.

Vi kommer att beskriva formarbetet mer detaljerat i ett senare inlägg!

Kom gärna med synpunkter!

Written by Axel Andén

maj 17, 2010 at 10:47 f m

Publicerat i form

Tagged with , ,

m.medievarlden.se – en startpunkt i mobilen

På m.medievarlden.se finns de senaste nyheterna från Medievärlden men också från ett 30-tal andra svenska källor, under fliken ”Externa”. Det gör m.medievarlden.se till en perfekt startpunkt för dig som snabbt vill bli uppdaterad – var du än befinner dig!

Medievärldens nyheter finns under fliken ”Nyheter” som också är öppen när du kommer in på sidan. De övriga källorna ligger under fliken ”Externa”. Där ingår:

Anders Mildner

Anna Serner

Beta Alfa

Dagens Media

DN.se-bloggen

Elisabeth Sandlund

Emanuel Karlsten

SR:s Framtidsutredning

Jan Helin

Jardenberg Unedited

Journalisten

Lars Johansson

Lasse Bernfalk

Martin Jönsson

Mediestudier

Mer om medier

Mindpark

Per-Åke Olsson

Quick Response

Resumé

Same same but different

Second Opinion

Sundsvalls Tidnings redaktionsblogg

SvD Utvecklingsbloggen

SvD.se-bloggen

Sören Karlsson

Thomas Mattsson

Tidningsliv

TU Framtid

Typograf Borg

Vassa Eggen

Saknar du någon mediekälla, säg till i så fall!

Samtidigt fortsätter arbetet med vår iPhone-applikation som nu är i det närmaste färdig. Återstår bara att få den godkänd i App Store!

Written by Axel Andén

maj 11, 2010 at 12:16 e m

Publicerat i Uncategorized

Medievärldena första bidrag till open source-communityn

Nu finns en första release av modulen Reactions drupal.orghttp://drupal.org/project/reactions. Modulen togs fram av Tobias SjöstenKollegorna för att samla reaktioner på Medievärldens innehåll från olika sociala medier.

Se exempelvis längst ner på: http://www.medievarlden.se/nyheter/2010/05/gunilla-herlitz-arets-branschpersonlighet

Written by Axel Andén

maj 6, 2010 at 2:32 e m

Medievärlden får form

Detta bildspel kräver JavaScript.

När vi lanserade sajten i mars hade Per Sandström, Viktor Miranda och Tobias SjöstenKollegorna haft ett tydligt direktiv: Skapa inga formelement som sätter sig. Det är därför vår sajt just nu är så funktionell, stilren och strukturerad. Men saknar liv. (Vilket också varit den vanligaste invändningen mot den nya sajten)

Sedan några veckor tillbaka jobbar Patrik Engberg och Fredrik Anvin på formbyrån Burro med att blåsa liv i sajten, och ge den en identitet. Sajten ska bli mer dynamisk, egentligen i varje beståndsdel. De olika innehållstyperna ska färgkodas. Undersidorna Diskussioner och Tema får egen design som skiljer sig från förstasidan. Vi kommer också att på ett mer kraftfullt sätt puffa för sådant material som inte är dagsfärskt. Dessutom uppdateras logotypen.

Även nyhetsbrevet och kommande mobilsajt och Iphoneapp får en ny form baserad på nya medievarlden.se.

Burro har skissat klart och det ser riktigt bra ut! Nu längtar vi bara efter att få se vår sajt in action! Den 17 maj ska formen, samt en hel del utvecklingsarbete, vara färdigt. Då är det också hög tid att fira Medievärldens nya sajt. Mer info kommer!

Written by Axel Andén

maj 5, 2010 at 10:05 f m

Publicerat i form, utseende

Tagged with , , , , ,

Externa tjänster på medievarlden.se

Vi använder ett antal externa tjänster på nya medievarlden.se (även om vi valt bort Disqus för kommentarerna). Här en lista följt av lite funderingar kring problem med att använda så många tredjepartstjänster.

OpenX – för annonserna

Ett annonssystem som är open source. Vi använder den hostade lösningen. Den ger stora möjligheter att skräddarsy trafiken för kampanjerna och skickar automatiskt ut statistik till annonsören. Det enda problemet är att administrationen stundtals kan vara väldigt långsam, och det kan ta upp till 30 minuter innan förändringar får genomslag på sajten. Sandin solutions har skrivit en del om Open X.

Mailchimp – för nyhetsbrevet

Smidigt att använda och det går väldigt snabbt att få ut både det dagliga nyhetsbrevet och extra utskick. Dessutom har integrationen med Drupal kommit så långt att vi kan bygga och förhandsgranska nyhetsbrevet i Drupal-administrationen. (Det verkar även vara bra integrerat med WordPress, vilket Andreas Karman från We up north skriver om på sin blogg) Formuläret för nyregistreringar på sajten har vi kopplat till prenumerantlistan hos Mailchimp. Det enda problemet är att Mailchimp rensar ut mjuka studsar efter femte studsen, vilket kan skapa problem när folk är lediga. Vi har påtalat problemet och hoppas på en snabb lösning!

Cloudmade – för kartorna

Via Drupal skickar vi adressen till Google Maps som skickar tillbaka koordinaterna som vi sedan skickar till Cloudmade. Tjänsten skapar en enklare och mer skalbar karta än Google Maps skulle ha gjort, och ger oss lite mer frihet. Kartorna använder vi till att lägga in Medieföretag i nuläget, men i framtiden finns det många andra användningsormåden (allt vi lägger in adress för kan läggas in på kartor). Nästa innehållstyp att placeras ut på en karta blir antagligen evenemangen.

Yahoo Pipes – för Twitterlistorna
För att enkelt filtrera data och göra mashups. Vi har till exempel klonat denna pipe för att få ett RSS-flöde för tweets från Twitter-listor: http://pipes.yahoo.com/pipes/pipe.info?_id=fb60de5ff93e81319e3c5fa207b9b276

Twingly senast mikrobloggat – för att visa diskussionerna i sociala medier

En tjänst som vi är först i Sverige med. Den visar de senaste mikroblogginläggen om våra artiklar.

Facebook Fan-widget – för att koppla sajten till Facebook

Vi har lagt in en widget kopplad till vår Fan-sida på Facebook.

Backtype – för reaktioner

Använder vi för att fånga upp reaktioner på våra artiklar, från Twitter och andra sociala medier. Dessa reaktioner visas upp i anslutning till den artikel de kommenterar.

Google Analytics – för statistik

Mkse.com har också skrivit om de externa tjänster vi använder på sajten.

Även om det känns helt rätt att använda många tredjepartstjänster har jag några små farhågor. När ett api plötsligt slutar svara, om än högst tillfälligt, ligger det helt utanför ens egen kontroll. Och vad gör man om en tjänst man gjort sig beroende av slutar fungera?

Avslutningsvis, det här är bara undertecknads tankar om ovanstående tjänster, ni som är mer tekniskt bevandrade får gärna fylla i!

Written by Axel Andén

mars 16, 2010 at 12:03 e m

Tre invändningar mot nya sajten

Webbstrategen Jon Lindholm, som varit med och betatestat sajten, ställer tre högst relevanta frågor om vår nya sajt på sin blogg. Jag har svarat i en kommentar till bloggposten, men eftersom det här är viktiga frågor publicerar vi dem här också:

“För det första så är det nu som då nästan enbart ett teknikfokus.”

En sanning med modifikation. Som vi skrev i utvecklingsbloggen ville vi den här gången i så hög utsträckning som möjligt göra rätt i samtliga delar av arbetsprocessen. Det var ganska bråttom. Projektet startade efter att papperstidningen, som varit vår viktigaste plattform, lades ned. Vi behövde stärka identiteten och vi var tvungna att se över om den tekniska plattformen var rätt för oss (då Joomla).

I den bästa av bästa världar hade vi tagit processerna i rätt ordning enligt skolbokens alla regler. Varumärke, värdegrunder, identitet, form och slutligen kod och övrig kommunikation. Diskussioner kring varumärkets essens påbörjades. Dock hade vi som sagt ett problem, tidningen var borta och kraven på sajten växte mycket snabbt. Hade vi möjlighet att ta processerna i turordning eller fanns det andra möjligheter? Noga genomtänkt och med hänsyn till både julledigheter och tillgängliga resurser tog vi beslutet att vända lite på processerna.

Tankarna kring varumärket fick pågå och utvecklas samtidigt som den första prioriteringen var att migrera över till Drupal. Väl på ny plattform hade vi nya möjligheter och slapp eventuellt dubbelarbete i form av applicering av det visuella (vi har i bloggtexter och information till Beta-testare kommunicerat det som “Steg 1”). I och med att det första steget i grova drag handlade om migrering, grundfunktionalitet och bättre sätt att lyfta äldre material så skulle Steg 2 innebära visuell identitet och en del ytterligare funktioner. Det här ledde såklart till att den första versionen skulle vara så “clean” som möjligt. Eller för att tala klarspråk, att inte applicera några visuella objekt som kunde störa våra läsare när väl den utarbetade formen applicerades (och det arbetet måste ju dras ur vårt varumärkes väsen som sig bör – inte bara vara något “snyggt”).

Vi tänkte med andra ord i allra högsta grad på våra olika målgrupper, hur de fungerar och hur vi på bästa sätt kunde få det att överensstämma med strategi och kommunikation. Nämnde även det i bloggposten som föregick releasen,

”Inte heller är strukturen särskilt spännande”

När vi lanserade sajten i Joomla försökte vi göra just detta. Ingen klassisk artikelspalt, istället tre spalter med olika slags material. Jag säger absolut inte att det var det här du var ute efter, men våra erfarenheter från detta gör att vi inte vill frångå det klassiska tidningssajtsupplägget igen. Den gången kom vi undan med blotta förskräckelsen. Vi är inte Techcrunch eller Wired. Även om vi vill ligga i framkant och har många sådana läsare måste vi ha en sajt som fungerar för alla. När vi analyserat våra målgrupper har vi insett vi att vi inte bör gå på alltför hårt med experimentlustan (med det sagt så ska vi inte fega ur heller). Vi kommer i framtiden att lösa detta på ett sätt som jag tyvärr inte kan gå in på riktigt ännu. Vi kan och ska testa helt nya saker på olika delar av sajten, men det finns en sak jag för tillfället är helt säker på att vi inte ska rucka på: den enkla grundstrukturen på förstasidan.

När det gäller Tema- och Diskussionssidan är jag däremot öppen för diskussion. Som det är nu ligger Temana och Diskussionerna i två-spalt, men du skulle hellre se att vi testade med tre kolumner som jag förstår det?

“Designen. Varför inte något eget?”

Vi håller helt med om detta! Designen är oerhört viktig för hur webbplatsen uppfattas och det är precis därför vi vill gå hela vägen från våra grundvärderingar. Förändringen är inplanerad sedan länge och kommer med andra ord framöver.

Är ovanstående förklaring nog? Vi hoppas att diskussionen fortsätter! Vi behöver det!

Written by Axel Andén

mars 5, 2010 at 8:46 f m

Publicerat i utvecklingsarbete

Tagged with , ,

Imorgon lanserar vi nya sajten


Efter intensivt helgarbete är sajten nu färdig att lanseras. Imorgon mellan tio och elva öppnar vi medievarlden.se i ny skepnad. Vi har valt att kalla releasen “Steg 1“, en mängd saker vi vill göra har vi sparat till det som vi kallar “Steg2“ eftersom vi prioriterat att snabbt få ut den nya sajten. Ett mer dedikerat visuellt arbete kommer också att inledas efter lanseringen.

Det är många saker som jag skulle vilja skriva om, som jag inte hunnit under det intensiva slutarbetet inför lanseringen. Det kommer alltså att komma fler blogginlägg om vad vi gjort och hur vi tänkt när vi arbetet med den nya sajten.

Det kommer att finnas ett feedbackformulär i högra hörnet imorgon och jag hoppas på många synpunkter! Dem vi fick under den stängda betan har varit till stor hjälp! Det här är inte en slutpunkt utan en startpunkt i vår utveckling tillsammans med er!

Written by Axel Andén

mars 1, 2010 at 5:35 e m

Publicerat i utvecklingsarbete

Tagged with

DDoS-attack gör sajten trög – så hanterar vi situationen

Medievärldens sajt går extremt trögt just nu. Det gäller alla TU:s sajter, som ligger på samma server hos FS-Data. Om attacken är riktad mot Medievärlden eller TU eller någon helt annan kund på FS-Data vet vi inte. Det enda besked vi fått är följande:

”Trafiken mot er server upplevs som extremt trög på grund av att det just nu pågår en DDOS attack mot oss.
Våra tekniker arbetar för fullt för att stoppa trafiken från det IP som orsakat detta.”

Medievärlden beklagar det inträffade och att vi inte har en bättre plan B när sådant här händer.

Vår strategi nu är att hålla läsarna uppdaterade via bloggen och Twitter, och om inte sajten är igång inom en timme börjar vi publicera nyhetsartiklar på bloggen istället.

Mer om hur vi ska tänka kring säkerhet på nya sajten kommer i ett separat inlägg!

Uppdaterad: Sajten fungerade som vanligt igen under fredagen. FS Data skriver att det var en extremt stor överbelastningsattack av ett slag företaget aldrig upplevt tidigare.

Written by Axel Andén

februari 25, 2010 at 2:15 e m

Publicerat i server

Tagged with ,