Wired Overhauls Magazine

Transcription

1 Wired Overhauls Magazine The previous version of Wired had bright colors, bold fonts, perhaps the splashy photos and graphics that made it feel like a magazine about science and technology for men. The new version of Wired feels more like Wired meets T: The New York Times Style Magazine meets The New Yorker. With its modern, almost muted aesthetic, it feels more like a lifestyle magazine Mashable.com

2 Wired Overhauls Magazine "From my point of view, technology is not only your computer on your desk anymore, it's part of your life. It made sense to me to have a design that felt more accessible, that didn't make you feel all the time that you're just reading a tech magazine... "It's not only a magazine about technology, [it's] also a magazine about people who make technology happen." Claudia de Almeida, Wired's design director

3 ipad Magazine design

4 Adobe Digital Publishing Suite Condé Nast

5 Adobe Digital Publishing Suite Lynda.com

6 WIRED s ipad Magazine ipad app is not simply a straight, digitized version of the print magazine, it is much more. First thought is let's make everything move. (Does everything really have to move?)

7 Wired s three design goals: Allowing the content to shine Walk-up usability (instant, intuitive interface) Revolution through evolution (not doing everything at once, the application will evolve over time.)

8 What are the obstacles: Create a print magazine every month Create a vertical digital version every month Create a horizontal digital version every month The average Wired article takes 24 days to go from initial copy to finished layout a tight timeframe considering Wired is a monthly publication. Luckily, the team responsible for the print version of the mag are able to repurpose the layouts for use on the ipad and other devices, with only incremental hours, and no need for any additional staff.

9 Wired s thought process The better the design, The easier the reading experience, The deeper the engagement, The more connected the user, The stronger the brand relationship.

10 The tablet edition of Wired will combine the strong design of the print magazine with the connectivity of a wireless device. Print vs. web.

11 What is the best way to navigate a digital publication?

12 What is the best way to navigate a digital publication? Print

13 What is the best way to navigate a digital publication? Print Online

14

15 Print v. Tablet v. Internet

16 Omniture Analytics Total Digital Edition Circulation: A combination of single copy sales, digital subscribers and authenticated readers (print subscribers who have also signed up for digital editions). Total Issue Readers: Total number of readers who have accessed the digital edition at least once. Total Ad Readers: Total number of digital edition readers who have looked at an ad at least once. Total Number of Exposures per Ad: Number of times an ad in a digital edition was viewed. Average Time Spent per Digital Edition Ad: Average time, in seconds or minutes, that a digital-only reader spends on a page with a specific ad. Average Reading Sessions per Reader: Average number of times readers return to a specific issue. Average Time Spent per Reader: Average number of minutes readers spend with a specific issue across reading sessions.

17 Better body copy

18 Better body copy

19 Better body copy

20 Better body copy

21 Better body copy

22

23 Georgia, 20 pt. with 26 pt. line-spacing

24 Comparing Print to Tablet 8 in. 5 4/3 in. 10 7/8 in. 7 3/4 in.

25 Comparing Print to Tablet Navigation example

26 Comparing Print to Tablet Navigation example

27 Comparing Print to Tablet Navigation example

28 Comparing Print to Tablet Navigation example

29 Comparing Print to Tablet Navigation examples

30 Comparing Print to Tablet Navigation examples

31 Comparing Print to Tablet Navigation examples

32 Comparing Print to Tablet Navigation examples

33 Comparing Print to Tablet Navigation examples

34 Comparing Print to Tablet Navigation examples

35 Comparing Print to Tablet Navigation examples

36 Comparing Print to Tablet Navigation examples

37 Comparing Print to Tablet Navigation examples

38 Comparing Print to Tablet Navigation examples

39 Comparing Print to Tablet Navigation examples

40 Comparing Print to Tablet Navigation examples

41 Comparing Print to Tablet Navigation examples

42 Comparing Print to Tablet Navigation examples

43 Comparing Print to Tablet Navigation examples

44 Comparing Print to Tablet Navigation examples

45 Comparing Print to Tablet Navigation examples

46 Comparing Print to Tablet Navigation examples

47 Comparing Print to Tablet Navigation examples

48 Comparing Print to Tablet Navigation examples

49 Comparing Print to Tablet Navigation examples

50 Comparing Print to Tablet Navigation examples

51 Comparing Print to Tablet Navigation examples

52 Comparing Print to Tablet Navigation examples

53 Comparing Print to Tablet Navigation examples

54 Comparing Print to Tablet Navigation examples

55 Comparing Print to Tablet Navigation examples

56 Comparing Print to Tablet Navigation examples

57 Comparing Print to Tablet Navigation examples

58 Comparing Print to Tablet Navigation examples

59 Comparing Print to Tablet Navigation examples

60 Comparing Print to Tablet Navigation examples

61 Comparing Print to Tablet Navigation examples

62 Comparing Print to Tablet Navigation examples

63 Comparing Print to Tablet Navigation examples

64 Comparing Print to Tablet Navigation examples

65 Comparing Print to Tablet Navigation examples

66 Comparing Print to Tablet Navigation examples

67 Comparing Print to Tablet Navigation examples

68 Comparing Print to Tablet Navigation examples

69 Comparing Tablet horizontal to vertical 768 px. 1,024 px.

70 Comparing Tablet horizontal to vertical

71 Comparing Tablet horizontal to vertical

72 Comparing Tablet horizontal to vertical

73 A Closer Look 55 px. 12 columns with 24 px. gutters 48 px.

74 A Closer Look 55 px. 48 px. 12 columns with 24 px. gutters

75 A Closer Look: The Vertical Grid

76 A Closer Look: The Vertical Grid

77 A Closer Look: The Vertical Grid

78 A Closer Look: The Vertical Grid

79 A Closer Look: The Vertical Grid

80 A Closer Look: The Vertical Grid

81 A Closer Look: The Vertical Grid

82 A Closer Look: The Vertical Grid

83 A Closer Look: The Vertical Grid

84 A Closer Look: The Vertical Grid

85 A Closer Look: The Vertical Grid

86 A Closer Look: The Vertical Grid

87 A Closer Look: The Vertical Grid

88 A Closer Look: The Vertical Grid

89 A Closer Look: The Vertical Grid

90 A Closer Look: The Vertical Grid

91 A Closer Look: The Vertical Grid

92 A Closer Look: The Vertical Grid

93 A Closer Look: The Horizontal Grid

94 A Closer Look: The Horizontal Grid

95 A Closer Look: The Horizontal Grid

96 A Closer Look: The Horizontal Grid

97 A Closer Look: The Horizontal Grid

98 A Closer Look: The Horizontal Grid

99 A Closer Look: The Horizontal Grid

100 A Closer Look: The Horizontal Grid

101 A Closer Look: The Horizontal Grid

102 A Closer Look: The Horizontal Grid

103 A Closer Look: The Horizontal Grid

104 A Closer Look: The Horizontal Grid

105 A Closer Look: The Horizontal Grid

106 A Closer Look: The Horizontal Grid

107 A Closer Look: The Horizontal Grid

108 A Closer Look: The Horizontal Grid

109 Tablet factoids The Poynter Institute Eye Track Tablet study Findings Navigation is the most important feature... need to be quick and clear how user gets from here to there. Swiping is preferred over scrolling... Swiping is more intuitive 70% viewed the tablet horizontally, 30% vertically. People tend to enter a story through a dominant element. Few people used thumbnails to advance through a photo gallery. The majority used advanced buttons.