A nine step guide on how to design a mobile or tablet magazine and the typical pitfalls of the process.

1. 3/12/2013
Producing
Mobile Magazines
Lauri Eloranta / Futurice Ltd. 2013-03-07.

2. Based on lessons learned from

3. 1. Select the platform
2. Know the guidelines
3. Do dynamic design
4. Utilize the right kind of media
9 Steps of Mobile 5. Think about the business logic
Magazine Design 6. Data is everything! (design with
analytics)
7. Enable sharing, think about user
generated content
8. Prototype!
9. Think about the overall journalistic
process

4. 1. What is the target platform?
1. 1. Is it right for your customers? 2. Right for your readers? 3. Right for your
business objectives? 4.Right for your current technical solutions? 5. Right
for your investment levels? 6. Right for your magazine concept?

5. PLATFORM WARS

7. Native Application vs. Web application
=
Optimal for one vs. Mediocre for all

8. It’s all about the money.
(and about the business case)

9. 2. Know the platform guidelines!
(Official Design Patterns, Interaction Patters, Design Principles)

11. There is always an official design guideline to
follow: if you do not have one you are doing
something wrong!

12. Balance between:
Magazine look & feel
vs.
Platform look & feel

13. 3. Do dynamic design

14. Traditional magazine is about static
paper layout and full control.

15. Mobile magazines are all about

16. A PDF file is not a
mobile magazine.

17. »Forget static layouts
»Design for change
»Design for interaction
»Design for surprise

18. 4. Utilize the right kind of media

19. »Images
»Audio
»Videos
»Animations
»Location!

20. Media companies are just learning
how to combine media.
We are at the very beginning.

22. NY Times: Snow Fall
– The Avalance at Tunnel Creek
http://www.nytimes.com/projects/2012/snow-
fall/#/?part=tunnel-creek

23. 5. Think about the business logic

24. Do not forget
the adverts.

25. Be creative in ad design, the
possibilities are endless.
(gesture based ads, augmented reality ads, location aware, user
profiling based, user action based…)

26. Who pays for the magazine and
how? How does the design
encourage purchases?

27. What are the distribution
channels (linked directly to the
platform)?

28. 6. Data is everything!
(Design with analytics)

29. Without DATA you
are NOTHING!

30. NO DATA MEANS NO BUSINESS CASE!
» Data is used to link the usage to the
journalistic process
» Data is used to sell ads (to advertisers)
» Data is used to configure content
» Data is used to configure ads
» Use at least Google Analytics as a bare
minimum

31. »Iterative design based
on actual user data
»A/B testing
»Design linked to
actual business goals

32. 7. Enable sharing and think about
user generated content

33. Your magazine does
not exist without social
media.

34. Possibility: Users as journalists?
How do you cater for user
generated content?
LOOK MUM! I AM A FOOD JOURNALIST!

35. 8. Prototype!

36. Try things out early on: sketch,
prototype, test and get your
hands dirty!

37. Paper prototypes are an easy
way to get rapid feedback on
magazine interaction design.

38. There are plenty of interactive
prototyping tools for various
platforms.

39. 9. What about the whole
journalistic process?

40. PARTY LIKE IT’S 1450!
The journalistic process is basically unchanged.

41. Black box of content generation
A Journalist The content is
The content is
Creates distributed in
laid out with
Content (static)
ads
(black box) channels
Where are the feedback loops? Why do we still
generate content based on the old rules of static
daily media?

42. The distribution and consumption
have changed, but the journalistic
tools are still the same.

43. DON’T WORRY,
A REVOLUTION IS COMING.
(tens and tens of media start-ups disrupting the field)

44. Thank you!
Questions & Comments: Twitter /
@laurieloranta

45. References for the images used:
http://www.5forcesofchange.com/about/articles/article-lessons-president-obama-leading-change-hr-director-magazine/
Eric Carlen, Kameleontti Kaikenkirjava (Weilin+Göös 1985)
http://ebooks.ebeyonds.com/hospitality.html
http://nyt.fi/20130107-seuraa-tabloidin-tekoa-hs-fissae/
http://en.memory-alpha.org/wiki/Data
http://mojomedialabs.com/what-is-ab-testing/
http://pohtpof.tumblr.com/page/3
http://printingparadise.wordpress.com
http://faithincommunity.blogspot.co.uk/2012/05/pity-poor-typewriter.html
http://www.yellowdaymovie.com/2013/01/les-miserables-and-the-idea-of-grace/
http://www.fastcompany.com/1787558/igenius-steve-jobs-mythbusters-making-documentary-tribute