2012 0319 adaptive content

7/31/2019 2012 0319 Adaptive Content

1/96

ADAPTING OURSELVES TADAPTIVE CONTEN

@karenmcgrane


2/96


3/96

Fragmenting our content acrossdifferent device-optimizedexperiences is a losing propositioor at least an unsustainable one.

Ethan MarcotResponsive Web Desi


4/96

ou cant afford to create a piececontent for any one platform.Instead of crafting a website, youhave to put more effort into craft

the description of the different bof an asset, so they can be reusedmore effectively, so they can deliv

more value.Nic Newman,


5/96


6/96


7/96


8/96


9/96


10/96

Were about to usher in a golden ageof PDFs on the iPad.

Paul Ford, @ftra


11/96

Existing art and production staffefrom the print side would beresponsible for making two iPadlayouts (one in portrait and one in

landscape) on Adobes platform.Cond Nast Is Experiencing Technical Difficu


12/96

All I see is anentire organization screaming,

WE WANT IT TO BE THE EIGHTIES

GODDAMMIT.

Cond Nast Is Experiencing Technical Difficult


13/96

COPE: Create Once, Publish Everywhere

COPE:CREATE ONCE,

PUBLISH EVERYWHERE


14/96

C

O

N

T

E

N

T

P

R

O

V

I

D

E

R

S

M

U

S

I

C

P

A

R

T

N

E

R

S

NPR, Open Content and APIs, OReilly Osco


15/96

NPR.ORG

NPR Digital Media Examplof COPENPR, Open Content and APIs, OReilly Osc
http://www.slideshare.net/danieljacobson/npr-examples-of-copehttp://www.slideshare.net/danieljacobson/npr-examples-of-copehttp://www.slideshare.net/danieljacobson/npr-examples-of-copehttp://www.slideshare.net/danieljacobson/npr-examples-of-cope


16/96

NPR.ORGPLAYER

NPR Digital Media Examplof COPE
http://www.slideshare.net/danieljacobson/npr-examples-of-copehttp://www.slideshare.net/danieljacobson/npr-examples-of-copehttp://www.slideshare.net/danieljacobson/npr-examples-of-copehttp://www.slideshare.net/danieljacobson/npr-examples-of-cope


17/96

NPR NEWSiPHONE APP


18/96

NPR MOBILEWEB SITE


19/96

NPR ADDICTIPHONE APPProduced by a public user,based entirely on the NPR API

NPR ON THE


20/96

NPR ON THEPUBLIC RADIOPLAYER


21/96

NPR ONWBUR

NPR ON


22/96

NPR ONMPR

NPR ON


23/96

NPR ONiGOOGLE

NPR IN


24/96

NPR INiTUNES


25/96

NPRS


26/96

NPRSCMS

NPRS API


27/96

NPRS API


28/96

BUSINESS VALUE?

31,000


29/96

Sept. Nov. Sept. Nov. Sept. Nov. Sept.

2

8,700

11,000

22,000

4,300

10,500

13,000

2010 iPAD ISSUE SA


30/96

NPR PAGE VIEWS

43 Million

88 Millio


31/96

Over t e ast year, NPRs tota paview growth has increased by mothan 80%.

How did we get that much growt

Our API.Zach Bra

Senior Director Technology, N


32/96

The biggest impact that the API has mahowever, is with our mobile strategy. ThAPI has enabled NPR product owners tobuild specialized apps on a wide range platforms and devices, liberating them

from being dependent on customdevelopment to access the content.

Through this process, we built our iPhonand iPad apps, mobile sites, Android ap

and HTML5 site, some of which wereturned around in a matter of weeks!


33/96


34/96

THE FUTURE OF

ADAPTIVE CONTENT


35/96

Semantic

Adaptive

Nimble

Structured

Flexible


36/96


37/96

REUSABLE CONTENT STORE


38/96


39/96


40/96


41/96


42/96


43/96

MULTIPLE SIZES

MEANINGFUL METADATA

WRITTEN FOR REUSE


44/96


45/96


46/96


47/96

WHY ARE NEWS ORGANIZATIONTHE INNOVATORS?

Masthead


48/96

Hed: Headline, heading, head or title ofa story, rarely a complete sentence.

Dek: Deck, blurb, or article teaser or sub-headline. A

phrase or two between the headline and the body of

the article that explains what the story is about.

Lede: Lead, as in leading paragraph, usually the

first sentence, or in some cases the first two

sentences, ideally 20-25 words in length. An

effective lead is a brief, sharp statement of the

story's essential facts.

Lorem ipsum dolor sit amet, consectetuer

adipiscing elit, sed diam nonummy nibh euismod

tincidunt ut laoreet dolore magna aliquam erat

volutpat.

Ut wisi enim ad minim veniam, quis nostrud exerci

tation ullamcorper suscipit lobortis nisl ut aliquip ex

ea commodo consequat. Duis autem vel eum iriure

dolor in hendrerit in vulputate velit esse molestie

consequat, vel illum dolore eu feugiat nulla facilisis

at vero eros et accumsan et iusto odio dignissim

qui blandit praesent luptatum zzril delenit augueduis dolore te feugait nulla facilisi.

Nut graf

Nutshellparagraph

Summarizes thestory's content

Often bullet-pointed

Sometimes setoff in a box

Captions are photo headlines

Cutlines are the words (under thecaption, if there is one) describing tphotograph or illustration.


49/96

Its scary to think about your packagedevolved into different content elements.It takes imagination and understanding to

take that apart. And courage.

Sarah Chubb Sauvayre, Cond Na


50/96

THE PRIMACY OF PRINT


51/96


52/96


53/96


54/96

Thinking about where content willlive on a web page is pretty 1999.

Lisa Welchman, @lwelchman


55/96


56/96


57/96


58/96


59/96

THE MARRIAGE OF

CONTENT AND FORM


60/96

Tra itiona pu is ing an contenmanagement systems bind contento display and delivery mechanismwhich forces a recycling approachfor multi-platform publishing.

Dan W


61/96

A semantic content pu is ingsystem creates well-defined chunkof content that can be combined whatever way is most appropriatefor a particular platform.

All display issues are addressed bdelivery applications, rather than a content management system

earlier in the process.


62/96

WHAT DO WE NEEDTO GET THERE?


63/96

MULTIPLE SIZES

MEANINGFUL METADATA

WRITTEN FOR REUSE


64/96

WRITE FOR THE CHUNK, NOT THPAGE

DEMYSTIFY METADATA

BETTER CMS WORKFLOW


65/96


66/96


67/96


68/96

TRUNCATION IS NOT ACONTENT STRATE...


69/96


70/96

BLOBS vs. CHUNKS

NPRSCMS


71/96

CMS

Page TitleExample: Widget-o-Rama: FancyWidget No. 5

PRODUCT DESCRIPTIONANSWERS THE QUESTION WHAT IS IT?


72/96

Product Name

Product Line

Short

Description

Example description: Widget-o-Ramas FancyWidgetNo. 5 is an inverse reactive current supply mechanismused for operating nofer-trunnions and reducingsinusoidal depleneration when used in conjunction with adrawn reciprocating dingle arm.

Guidelines: Two sentences. The productdescription should answer the questions

What is it? Who is it for? and What doit do? The description must include at leaone real, actual noun besides the name of product.

PRODUCT BENEFITSANSWERS THE QUESTION WHY SHOULD I BUY IT?

Benefit/FeaturePairs

Guidelines: Benefits are about the custoand answer the question, What will this dfor me? Features are about the product aanswer the question, How does the produwork? On the Widget-o-Rama website, thshould come in pairs consisting of a veryspecific benefit, followed by the feature orfeatures that make it possible. Use concreterms whenever you can.

Examples:Reduces maintenance costs by up to 50% byreplacing delicate gremlin studs with a robust spiraldecommutator and eliminating the need for drammock oilafter phase detractors are remissed.

Prevents side fumbling via the addition of pentametricfan consisting of six hydrocoptic marzelvanes fitted to theambifacient lunar vaneshaft.

CSS

Display


73/96

CMS CONTENTSTRATEGY

ADAPTIVECONTENT

ContentWrangling

DataModel

DisplayStyles


74/96

DEMYSTIFYING METADATA


75/96

METADATA PROGRAMMATICALBUILDS PAGES


76/96

Metadata is the new art direction.

Ethan Resnick, @studip10


77/96

METADATA HELPS PRIORITIZECONTENT


78/96


79/96


80/96

METADATA SUPPORTSPERSONALIZED CONTENT


81/96

BETTER CMS WORKFLOW


82/96

Content admins hate all the fields.

But the reason they hate all the fieldsis the workflow is bad.

Jason Pamental, @jpamenta


83/96

CMS IS THE ENTERPRISESOFTWARE THAT UX FORGOT


84/96


85/96


86/96

CONTEXTUAL INQUIRYUSER PERSONASCONTEXTUAL INQUIRYUSER PERSONAS


87/96

USER SCENARIOS

TASK ANALYSISWORKFLOW MAPPINGCARD SORTING

CONTENT MODELINGITERATIVE PROTOTYPINGUSABILITY TESTING

ANALYTICS DATA

USER SCENARIOS

TASK ANALYSISWORKFLOW MAPPINGCARD SORTING

CONTENT MODELINGITERATIVE PROTOTYPINGUSABILITY TESTING

ANALYTICS DATA

T e appier peop e are


88/96

T e appier peop e are,

the better their content will be,the more content theyll produce

Patrick Cooper, N

Beautiful software even for back


89/96

Beautiful software, even for back-

users, is becoming an expectationWere moving in this directionbecause we now understand that

better content management systefoster better content.

Matt Thomp


90/96

USE MOBILE AS A WEDGE.


91/96

The more structure you put intocontent the freer it will become.

Rachel Lovinger, @rlovinger


92/96

SEPARATION OF CONTENTFROM DISPLAY.

(FOR REAL THIS TIME.)


93/96

The future of content managementsystems is in their ability

to capture the content in a clean,presentation-independent way.

Daniel Jacobson, NPR


94/96

DESIGN WITH AND FORSTRUCTURED CONTENT.


95/96

Ive never seen anyone regret havingflexibility in how they deploy content.

Jeff Eaton, @eato

THANKS!


96/96

THANKS!

ROCK ON!

@[email protected]+1 (917) 887-8149
http://www.bondartscience.com/http://www.bondartscience.com/http://www.bondartscience.com/http://www.bondartscience.com/mailto:[email protected]:[email protected]

2012 0319 adaptive content

Documents