Redaktionell design

Redaktionell designMorten Postrup på JMG 5 december 2012

söndag den 9 december 2012

OmgörningarEntra News, Atlantica-tidningen, Arbetsmarknaden, Option, Mobil, Bolaget, Restauratören Magasin, Byggnads-arbetaren, OmVärlden, Epigon, Fastighetsvärlden, Arbetsliv, Travronden, Tiempo, Praktiskt Butiksarbete, Ica-nyheter, Civilekonomen, ST Press, Vi Bilägare, Nova-nytt, Arbetarskydd, Nynäshamns Posten, Hälsa, Miljöforskning, Utemagasinet, Sunt Förnuft, Röda Korsets tidning Henry, Kärnfullt, Restaurangvärlden, Almegatidningen, Svensk Idrott, OmVärlden, Råd & Rön, Trä & Möbelforum, Internationella Studier, Ridsport och Trä.

Morten Postrup

JobbDesignstrategSpecialiserad på omgörningar av tidskrifterVarit projektledare på Magazine och vd på A4Arbetar i egen firma sedan fem årGick ut JMG 1998

Morten Postrup

Chef och projektledareKöpt och sålt designtjänsterAnställt formgivareUtbildat formgivareVarit chef och projektledare för formgivare

Morten Postrup

Föreläsningen idagDesign som begreppFormelementPrinciperÖvning i designanalysDesignprojektSpaningar

DESIGN

Processen att skapa något utifrån

användarnas behov

YtaUtseende

KulörerTypografi

GridPapper

Känsla

Research Strategi

Koncept Prototyp

Tester Lansering

Saker design kan göra1. Strukturera information2. Signalera rätt saker3. Skapa en upplevelse4. Skapa arbetsverktyg

Saker design kan göra: Strukturera information (1)

hierarki

1. Strukturera infoHierarki – vad kommer först, vad kommer senGruppering – visa vad som hör ihopNavigation – hjälp läsaren att hitta

Saker design kan göra: Signalera rätt saker (2)

Wow! tunga grejer!

2. Signalera rätt sakerEtt magasin handlar om drömmar, om att glänta på dörren till en annan värld. Sätt läsaren i rätt stämningSkapa rätt förväntningar – uppfyll dem med innehållet. Bygga det redaktionella varumärket

Saker design kan göra: Skapa en upplevelse (3)

Mycket att se

och läsa.

3. Skapa en upplevelseJag unnar mig tid med mitt magasinBläddring – förväntningarPaketeringen är något utöver innehålletTrygghetÖverraskning

Rationell form är enkel att jobba med.

Saker design kan göra: Skapa arbetsverktyg (4)

4. Skapa arbetsverktygRationell design betyder rationella arbetsprocesser. En mall gör det enkelt att planera, beställa jobb och göra layout. En del sidor är enkla att göra och spar tid. En del sidor kräver kreativt arbete och kräver extra tid i planering och utgörning.

FORMELEMENT

Typografi

Formelement

Seriffer och sanserifferTsga – seriff

Tsga – sansserif

Typografi

SerifferThe quick brown fox jumps over the lazy dogTimes New Roman

Typografi / Seriffer

Pangram

The quick brown fox jumps over the lazy dogCentury Schoolbook

The quick brown fox jumps over the lazy dogAmerican Typewriter

The quick brown fox jumps over the lazy dogMiller Text

The quick brown fox jumps over the lazy dogGuardian Egyptian

SanserifferThe quick brown fox jumps over the lazy dogGuardian Sans

Typografi / Sanseriffer

The quick brown fox jumps over the lazy dogGuardian Egyptian

The quick brown fox jumps over the lazy dogGuardian Sans

The quick brown fox jumps over the lazy dogHelvetica

The quick brown fox jumps over the lazy dogArial

The quick brown fox jumps over the lazy dogFranklin Gothic

The quick brown fox jumps over the lazy dogGill Sans

The quick brown fox jumps over the lazy dogVerdana

Aax-höjd

kägel

Typografi

Begrepp

AaGrundstreck

Hårstreck

BaslinjeSeriff

Typografi

Kontrast

AASkillnaden

mellan grundstreck

och hårstreck

Låg kontrast

Hög kontrast

Typografi

Hög kontrast

Typografi

KontrastLagom kontrast gör det enkelt att känna igen bokstavsformerna och enkelt att läsa. Alltför hög kontrast får texten att »flimra«. Alltför låg kontrast gör texten till en »grå platta«.

Typografi

Siffror1234567890 – gemena siffror1234567890 – versala siffror

Löpande text

Tabeller

Typografi

AvstavningAvstavning och utslutningLagom många avstavningarLagom ordmellanrumJämn och fin sats ger högsta läsbarhet

Typografi

HorungarEnsamma ord överst i spaltenEnsamma rader överst i spalten

Typografi

Typografi – Lästips!

Grid och spaltsystem

Formelement

Format

Satsyta

2 spalter

3 spalter

4 spalter

5 spalter

Tabloid

6 spalter

Tabloid med annonser på

sidan.

11 spalter?

11 spalter

8 spalter

11 spalter

Formelement

T-formad placering av

Grafiska elementLinjerTonplattorSlutpunkterFortsättningspilar

Formelement

IngångarRubrikerBildtexterAnfangerCitatPunktlistor

Formelement

Kulörer

Formelement

LuftSkapa fokusGruppera (och särskilja) objekt

PRINCIPER

Tidningens uppgifter

Välj åt mig!OmfångVälj bortTextlängder Hjälp mig

att välja!IngångarHierarki

Ge mig trygghet! Struktur

Berätta! Visualisering

Överraskamig! Innovation

Planering

KontrastTypografi (storlek, skärning, kulör)BildstorlekarMotivavståndLånga och korta texter (antal tecken)Långa och korta jobb (antal sidor)Luft / innehåll

Kontrast i bildstorlekar

Kontrast i motivavstånd

Bilder i block

Kontrast i motivavstånd

Kontrast i typografin

PregnansFormens förmåga att göra extremt tydlig

Principer

KonsekvensSaker som är lika ser lika ut

Principer

StrukturEn uttänkt mix Enkelt att planeraEnkelt att göra layoutInnovation och överraskning sitter främst i vinkel och bildinnehåll(Behöver kompletteras med renodlad innovation)

HierarkiI vilken ordning presenteras innehållet

Principer

Några saker är utvalda att synas mer.

Läsordning

Principer

TäthetMycket material på liten yta = hög täthetLite material på mycket yta = låg täthet

Principer

Låg täthet

Visualisering

Principer

Ordning + Röra

Principer

PrioriteringHa med lagom mycket. Hjälp läsaren genom att presentera ett lagom paket med innehåll.När man inte hinner läsa allt får man dåligt samvete.

Principer

Tidningen:

Redaktionen:

Rörig

Ad hoc

Struktur

Planering

Överraskning

Innovation

1990 2000 2010

Så görs tidningen

Övning!Designanalys

Designanalys

Element

TypografiGrid SpaltsystemBildGrafiska elementIngångarKulörerLuft

Principer

Kontrast – Stort och småttPregnans – Innehållet står utKonsekvens – Lika innehåll ser lika utHierarki – Vi väljer vad som är viktigastLäsordning – Ögats hopp i spalternaFokus – En plats för ögat att börjaTäthet – Mängden innehåll per sidaVisualisering – Presentation utöver textOrdning + röraPrioritering – Kunde något väljas bort?

PROJEKT

Tidning > varumärke

Papperstidning

Mobilt

Seminarier

Utbildningar

Bokförlag

Innovation förr

Mobilt

Seminarier

Utbildningar

Bokförlag

Papperstidning

WebbRedaktionelltvarumärke

Innovation nu

Strategisk design 1Hur ser läsarna ut? Vilka är deras drömmar, problem och drivkrafter? Vilka vill vi nå? Skaffa en produktiv bild av läsarna. Vilket intresse hos läsarna kan vi »mata«?Vad ska vi bidra med?

Strategisk design 2Vilka är våra nuvarande problem? Vad vill vi uppnå? Hur ser vägen dit ut?

Strategi Koncept Utgörning Effekt

En bärande idé för vad vi vill med tidningen

Vad händer med läsaren?

VinklarRubrikerTexterBilderLayout

ÄmnenVinklarTilltalForm

Projektmodell v1

Idé Testa idé Utvärdera Fortsätt

En idé för hur vi skulle kunna förbättra

Låt bra idéer leva vidare. Generera nya.

FörfinaFail Early

Gör en liten prototyp och se vad som händer

Projektmodell v2

Vad vet vi om våra läsare?

Skaffa en produktiv bild

av läsarna!

Ring en läsare i veckan

Design researchEtnografiska studierDjupintervjuerFokusgrupper?

Persona 1Maria Nilsson32 årBor i KirunaCivilingenjör teknisk fysik, ChalmersSambo i villaHandläggare på Rymdstyrelsen sedan 4 årKom dit som nyexadUppvuxen i VisbySiktar på tjänst inom ESA

Persona 2Jag heter Maria Nilsson och jag jobbar på Rymdstyrelsen sedan år 2000, huvudsakligen med internationella relationer. Under några dagar i Florida jobbar jag tillsammans med ESA för att de svenska VIP-gästerna som är på plats ska få en innehållsrik och trevlig resa. Detta blir mitt andra Florida-besök, jag var även på plats och såg uppsändningen av STS-116, Christer Fuglesangs första rymdfärd, i december 2006.

RedesignProblemVisionStrategiKoncept (Varumärke + kanaler)GenomförandeUppföljning

Framgångsrik förändringSkaffa en realistisk bild av problemen.Skaffa en produktiv bild av era läsare.Skaffa en storstilad vision för vad ni vill uppnå.

SPANINGAR

57 % 72 %

20102012

Har tillgång till bärbar dator

Källa: Svenskarna och internet 2012

16 % 30 %55 %

20102011

Kopplar upp sig till internet via mobilen

20092012

Tittar på filmklipp i mobilen

20032012

Kan du någon gång jobba hemma med hjälp av internet?

MänKvinnor

Andel i åldern 12 till 25 år som skriver på en egen blogg 2012

MassmedierBegreppet tunnas ut allt mer. Många bidrar med inneåll i allt från bloggar till sociala medier. Många aktörer på massmediernas gamla arenor.

Innehåll kopplas lossInnehåll och distributionsform har tidigare varit ett och samma: Se en film = film + biobesök (VHS ca 1980)Tidning = journalistik + papper + utbärning (Aftonbladet.se 1994)Hylands hörna = program + tv-tittande (Svtplay 2006)

Allt digitaliserasMedierMusikFilmBöckerThe internet of thingsTillverkning

Crowdsourcing

Crowdfunding

Tidningarnas intäkter från papper sjunker och nya intäkter från digitala medier hänger inte med.

Det har hösten 2012 sålts hundra miljoner iPads, en produkt som inte fanns vintern 2010!

Design idagAllt kan designasAnvändarorienteratCo-creationPrototyperDesign ThinkingAnvänd design för att lösa »wicked problems«

JournalistEtt framtidsyrke?

Nja...Journalistutbildningar läggs nerUppsägningarDålig ekonomi på tidningarnaAnnonspengarna flyr från ”print” Problem att ta betalt i digitala kanaler

Journalist – ett framtidsyrke?

Japp!Ljusning för betalningar i digitala kanalerStörre räckvidd än någonsin för dagspressenEtt samhälle fullt av kommunikationJournalistiken är trovärdig och angelägen Content Marketing behöver massor av folk

Gör så härVar stolt (På många sätt världens bästa yrke)Var bäst (Tänk efter. Var nyfiken. Var tuff utåt men samarbeta inåt. Leverera.)Var unik (Skaffa ämneskunskaper)Skaffa digitala kunskaperDet är inga problem vara sin egen, men var beredd på att behöva skapa jobben själv

Bästa boken om design

Principer för hur vi

uppfattar världen.

Tack!CC BY-ND Morten Postrup 2012

Morten PostrupMejl: morten@postrup.se Webb: www.mortenpostrup.comFacebook: Designstrateg Morten PostrupLinkedin: Morten PostrupSlideshare: Morten PostrupKöp min bok: Bokus

CreditsFågelunge / Madbuster75Telefontrådar / SMercury98Telefonsamtal / What is in usArtwork cc licensed, as published on Flickr.com

Redaktionell design

Design

Cowo Times - cowoly-8738.kxcdn.com · Coworking: Die soziale Alternative zum isolierten Home Office Zahlen, Fakten und Gründe für den neuen Arbeitstrend Laut der redaktionell gewar-teten

MEDIA-DATEN 2020 · Büromöbel-Messen wird von CHEFBÜRO redaktionell be-gleitet. Special Interest und mehr … Neben produkt- und lösungsspezifischen Darstellungen be-schäftigt

design design

Alpintouren.at – redaktionell geprüfte Touren von ...vermessung.bayern.de/file/pdf/3600/Vortrag_Kurz.pdf · Onyx Technologie OG gegründet 2007 Von Walter Hinterhölzl Und Michael

Media Kit - ispo.comMit Native Content werden Ihre Botschaften journalistisch aufbereitet und redaktionell im Stil von ISPO.com platziert. Dem Leser wird ein echter Mehrwert geboten,

TVöD-K+file++...TVöD-K 1. März bis 31. Dezember 2016 | Seite 7 Inhaltsverzeichnis1 Seite* 1 Redaktionell angepasst. * Seitenzahlen für diese Ausgabe ergänzt ∞ Diese Anlage

Mediadaten 2019 - analytik.news · Analytik NEWS ist das erste deutschsprachige Online-Labormagazin und bietet bereits seit 1998 tagesaktuelle, unabhängige, redaktionell geprüfte

Nachrichten aus Europa · Nachrichten aus Europa 26. Februar bis 2. März 2018 Redaktionell verantwortlich: Anja Freytag, Landesvertretung Brüssel, Tel: 030-72629 1025 , afreytag@lv.rlp.de

design/ design/ design/ - K-2

Jajja SEO & Strategy · SÖKMOTOROPTIMERING Redaktionell optimering, max antal sidor 6 12 24 36 Kontinuerlig bevakning av webbplats Timbank per år för implementering av åtgärdsförslag

Goldsparpläne · Die Inhalte des Sonderdrucks stellen einen Nachdruck des in der FOCUS-MONEY-Ausgabe 29/2018 erschienenen Artikels „Reich nach Plan“ dar. Dieser wurde redaktionell

IKARUS soll endlich fliegen! Konzept für ein gemeinschaftlich-organisiertes, redaktionell betreutes globales Wissens- bzw. Datenkompendium mit verlinkter

Nachrichten aus Europa - msagd.rlp.de · Nachrichten aus Europa 26. bis 30. November 2018 Redaktionell verantwortlich: Anja Freytag, Landesvertretung Brüssel, Tel: 030-72629 1025

Offizieller Wortlaut der im WPK Magazin 2/2015 in … · 2015. 5. 18. · Offizieller Wortlaut der im WPK Magazin 2/2015 in redaktionell überarbeiteter Form veröffentlichten Entscheidung

Gemeinde Weingarten (Baden)...darunter eine Frankfurter Ju— HECORA—Publikationen, gendzeitschrift in einer Auf lage von 50 000 Exempla— organisatorisch verantuort— redaktionell

Lernen weiter denken. 2019 - Klett · Unterricht entfalten das volle Potenzial Ihres Whiteboards. Lehrwerk Online Im Internet geht das Schulbuch weiter. Nutzen Sie redaktionell qualitäts

Checkliste - kuechenplaner-magazin.de · Zusammen mit der Projekt gruppe „Planungsgrundlagen“ innerhalb der AMK haben wir das Dokument nun grundlegend erweitert und redaktionell

€¦ · DESIGN 20 jpg DESIGN 2_jpg DESIGN 21 jpg DESIGN 22.jpg DESIGN 25_jpg DESIGN 5_jpg DESIGN 23_jpg DESIGN 3.jpg DESIGN 6 jpg DESIGN 24_jpg 11 DESIGN 'jpg

Unternehmenspräsentation, Stand April 2019...10 April 2019 · Bertelsmann · Unternehmenspräsentation • Mehr als 275 redaktionell unabhängige Verlage auf sechs Kontinenten •

Infografik - Från budskapsplattform till redaktionell kalender