Medievärldens redaktionsblogg

Utveckling av sajten – och övriga plattformar

Posts Tagged ‘design

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

Annonser

Written by Axel Andén

juni 8, 2010 at 2:30 e m

Publicerat i form, 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 , ,

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 , , , , ,

Nytt webbmöte – 6 juli

Med på mötet var: Axel Andén och Anders Ahlberg, Medievärlden, Gunnar Borg, TU och Sarah Watz, Pixpro. Vi gick igenom vad som är gjort och vad som behöver göras, med lunchträffen i maj som utgångspunkt.

Pixpro ska kolla på:

* Rss factory – verkar ha slutat uppdatera portarna på förstasidan – Sarah
* Mest lästa senaste veckan – ändra till dagens mest lästa – Sarah
* Kolla avstavning/avbrytning av vissa ingresser – Sara
* Visa totallöpet under artikeln (artikel – annons – tio artiklar m rubrik och ingress) – Sarah
* Skippa bilder i rss och nyhetsbrev – Sarah
* ”Medievärlden väljer” i ny form (som artiklar) som går att kommentera – Sarah
* Facebook Connect – som modul och kolla om kommentarerna går att koppla till artiklar.
* Pinga och trackbacks – pinga artiklar – och få trackbacks uppvisade i modul – Sarah
* Bildspel via Flickr – Sarah
* Mobilsajt
* Nyhetsbrevet – senaste artikelrubrik som rubrik
* Nyhetsbrevet – ta bort datumet, ta bort en radbrytning, lägg in grå bakgrund, – Sarah
* Logotypen ska vara med i utskrifter – Sarah

Vi ska kolla på:

* Trackbacks – ny test
* Behövs en prenumerationssida som samlar de tre prenumerationsformerna:
Kort text prenumerera på – länkar till prenservice
Kort text hantera ditt nyhetsbrev – länk till modul
Kort text pren på rss – länk till rsssidan
Länka om pren-länken i botten till rätt sida
* Twitterflödet på sajten och ”Följ oss på Twitter”-knapp

Till ett möte med hela Medievärlden i augusti ska vi fundera kring:

Sajtens design och navigering:
* Områdena, ska vi behålla Forskning & Framsteg
* Bloggen finns – hur ska vi använda den?
* Navigering på temasajter
– grafisk rubrik i vänsterspalt? Samma form, med samma platta för alla temasajter?
* Vill vi ha breadcrumbs?
* Funkar det med grå länkar
* Nyhetsbrevet – Moduler in medievärlden väljer, nya kolumner och nya debatt? – vilka ska plockas in

Pixpro har fixat under våren sommaren:

* Artiklar som inte är publicerade ska inte skickas iväg med Nyhetsbrevet
* Utseendet på kommentarerna fixat
* 20 artiklar uppe på senaste nytt.
* Datum för kommentarer ordnat
* Toppbannern – tas bort om den inte finns
* Pren nyhetsbrev via sajten

Inte fixat:

* Felmeddelanden för bruten länk – går inte att ändra när det är ASP – enligt FS Data
* Bläddra mellan artiklar – inte längre aktuellt.

Written by Axel Andén

juli 6, 2009 at 3:00 e m

Nu testar vi vad Joomla går för

Idag hade vi vårt första webbmöte sedan sajten lanserades, gäster den här gången var Tommie Nordholm, Joakim Jardenberg, Paula Marttila, Morten Postrup och Pelle Sten.

Otroligt värdefullt för oss, och drastiska förändringar följer.

Ingen gillar lösningen på förstasidan, så nu ser vi vad Joomla går för och gör en snabb omflyttning. Där kör vi nu det klassiska upplägget med artiklarna till vänster och andra objekt i spalten till höger. Jag testar nu, och går det inte testar jag imorgon istället. (Uppdaterad: Gick inte. stylingen blev fel)

Dessutom efterlyser våra lunchgäster en total översyn av form och informationsarkitektur, där har vi inte ännu bestämt hur vi ska göra.

Några saker som ska fixas:

* Ta bort prenumerera på kommentarer (endast registrerade) eftersom det inte går att registrera sig.

* Nyhetsbrevet FÅR inte skicka med artiklar som ligger för automatpublicering vid senare tillfälle, idag skickade vinnaren av PK:s pris två timmar för tidigt.

* Google-taggen är obsolet och behöver bytas

* Ett gammalt, icke-fungerande rss-flöde ligger och skvalpar någonstans i systemet.

* Månaden maj skrivs på olika sätt och försvinner ibland bort till höger i datumraden

* Klickbara rubriker (ingresser) för att slippa läs mer knappar.

* Möjlighet att bläddra fram och tillbaka mellan artiklarna

* En ytterligare puff / slide eller annan ingång längst ner på sidan.

* Utseendet på kommentarerna, löser sig självt när vi får samma som TU.se

Slutorden från våra lunchgäster var:

– Skala upp ert eget material, och ert urval av vad som har hänt idag, vad rekommenderar ni? – Paula

– Skruva till allt, en kvalitetsgenomgång, eller allra helst slängt ut detta och byggt det på WordPress, det skulle bli rätt stuk från början. Det har blivit för stort projekt, tekniken får styra, och det har landat lite på fel fot. – Joakim

– Ring tio läsare tio minuter och fråga vad de tycker. Kontakta formgivare eller informationsarkitekt, så att ni kan bli säkra i att ställa krav mot kodarna. – Tommie

– Vilka är sakerna som tar för mycket tid. Kanske ni inte ska göra dem eller göra dem på ett annat sätt. – Pelle

– Sluta med maskeraden: Ställ er frågan: Vilka är vi vad kan vi? – Morten

Written by Axel Andén

maj 18, 2009 at 5:37 e m

ok, vi ändrar i mittspalten

Vi har fått många synpunkter (här, på Twitter och IRL) om rubrikerna i mittspalten, att de tar för mycket uppmärksamhet.

Här är fem förslag på att tona ner rubrikerna. Vi har för avsikt att välja det översta, det som används till Senaste Nytt.

medieva5bl

Written by Axel Andén

mars 4, 2009 at 4:34 e m

Publicerat i utseende

Tagged with , , ,

en lite modifierad ettaskiss

medievarlden20-forstasidan

Written by Axel Andén

mars 3, 2009 at 5:38 e m

Publicerat i utseende

Tagged with , ,