DESIGNINGFOR DISTRIBUTEDCONTENT MODELS

@danieleizans | #WIADA2

DANIEL EIZANSWIAD2013 | 2.9.2013

http://www.flickr.com/photos/ryanprince1974/7417131586/

Let’s talk about patterns

@danieleizans | #WIADA2http://www.flickr.com/photos/ryanprince1974/7417131586/

We look for clarity in patterns

@danieleizans | #WIADA2

=

But we’re increasingly distracted

@danieleizans | #WIADA2

And Mobile Isn’t Going Away

@danieleizans | #WIADA2

And oh, that *$#@&! context thing ...

@danieleizans | #WIADA2

What’s a UX pro to do?

@danieleizans | #WIADA2

RESPONSIVE DESIGN?!UNIFY CODEBASES?

DEVICE SPECIFIC STRATEGY?PROTOTYPE?

MOBILE FIRST?!ESCHEW WIREFRAMES?

@danieleizans | #WIADA2

What (many of us) DO

We create hierarchy.

@danieleizans | #WIADA2

Home Ford Social Support LAD En Esp. More Ford Search

Cars Crossovers & SUVS Trucks Hybrids

and EVs

C-Max Hybrid

Hybrid Games Gallery Features Specs Models Accesories Pricing

C-Max Energi

Fusion Hybrid SE

Fusion Energi

Focus Electric

Comm Truck All Tech Hub Shopping

Tools

Build/Price

Etc.

@danieleizans | #WIADA2

We catalogue and audit pages.

We devise a strategy.

@danieleizans | #WIADA2

We produce wireframes.

@danieleizans | #WIADA2

Then we think about design and content.

@danieleizans | #WIADA2

And then things like this happen.

@danieleizans | #WIADA2

And happen....

@danieleizans | #WIADA2

And happen....

@danieleizans | #WIADA2

And happen....

@danieleizans | #WIADA2

And happen....

@danieleizans | #WIADA2

And happen....

@danieleizans | #WIADA2

And happen.... (for lots and lots of pixels)

@danieleizans | #WIADA2

Taking 25 seconds to load

@danieleizans | #WIADA2

Foundational workflows (and patterns) are failing us.

@danieleizans | #WIADA2

These are problems we can solve

@danieleizans | #WIADA2http://www.rexfeatures.com/search/?kw=lego+italy&iso=GBR&lkw=lego&viah=Y&stk=N&sft=&search_action=#

@danieleizans | #WIADA2

A Call To ArmsDesign from the content out!

@danieleizans | #WIADA2

We must look beyond the page.

@danieleizans | #WIADA2

Prepare for new devices and contexts.

@danieleizans | #WIADA2

Prepare for distribution.

@danieleizans | #WIADA2

Designing for Portability

@danieleizans | #WIADA2

Content is messy.• PURPOSE

What’s the content supposed to accomplish?

• MESSAGEWhat’s it saying? How is it saying it?

• RELATIONSHIPSWhat other content is conceptually connected?

• PRIORITIESHow important is it for the business? The user?

@danieleizans | #WIADA2

1. Content types (inventory) 2. Content wireframes 3. Content structure (data model)4. CMS Plan 5. UX/Design 6. Prototype

Making sense of the mess

@danieleizans | #WIADA2

1. Content Type / Persona2. Production Source / Author / Owner3. Original Intent (aka why was it made)4. Content Quality / Score5. Length / Word Count / File Size6. Rights

Content Inventory

@danieleizans | #WIADA2

Goal: Understand the whys

Content purpose

Content quality

Content reach

@danieleizans | #WIADA2

1. Logo2. Navigation3. Headline4. Author5. Date6. Related Assets7. Related Badge8. Comments9. Related Articles10. Social Links

Content Wireframe

@danieleizans | #WIADA2

1. Logo2. Navigation3. Headline4. Author5. Date6. Related Assets7. Related Badge8. Comments9. Related Articles10. Social Links

Content Wireframe1

2

34

5 6 7

8

9

10

Goal: Understand Hierarchy and Relationships

Feature Article

City

Author BioBusiness

Blog Post

Landmark

Deal Event

Links to Related

Tagged by

Tagged by

Links to Related

Links to Related

Tagged by

Tagged by

Related to

Tagged by

Links to Related

Links to Related

From Sara Wachter-Boettcher“Building Bendable Content” @danieleizans | #WIADA2

Focus on Structure

@danieleizans | #WIADA2

By focusing on parts instead of pages, data is portable and able to shift when needed or seen as a competitive advantage.

Goal: Create relationships in data

@danieleizans | #WIADA2

Chunking data appropriately allows it to be nimble and repurposed quickly.

CMS and Data Modeling

@danieleizans | #WIADA2

What you see may be what you get, but what you get isnʼt good for content portability.

CMS and Data Modeling

@danieleizans | #WIADA2

Fields are your friends. They create relationships in the data and allow for scalability and meaning.

So this will be like wearing

handcuffs right?

@danieleizans | #WIADA2

Models are like rails for each

new experience

@danieleizans | #WIADA2

We can’t manage how every bit of

content looks

@danieleizans | #WIADA2

@danieleizans | #WIADA2

Content ItemAttributes:⁃ Title⁃ Date⁃ Author⁃ Abstract ⁃ Detailed

Content

Relation-ship

Relation-ship

Relation-ship

Relation-ship

Content ItemAttributes:⁃ Title⁃ Address ⁃ Short

Description

Content ItemAttributes:⁃ Title⁃ Date⁃ Author⁃ Abstract ⁃ Detailed

Content

Content ItemAttributes:⁃ Title⁃ Date⁃ Location⁃ Teaser ⁃ Detailed

Content

Relation-ship

Relation-ship

Content ItemAttributes:⁃ Title⁃ Date⁃ Author⁃ Abstract ⁃ Detailed

Content

But we can define rules

and encourage

relationships

From Sara Wachter-Boettcher“Building Bendable Content”

Clean, purposeful content flows

@danieleizans | #WIADA2

And when content flows via systems, we can scale

COPECreate Once Publish Everywhere

And we can design responsively

@danieleizans | #WIADA2

And we can deploy

@danieleizans | #WIADA2

Assured that our system is good for humans and robots

@danieleizans | #WIADA2

@danieleizans | #WIADA2

“Content and form are lovers, their love-child is design”

- Stephen Hay

Hug it out. Get to work.

@danieleizans | #WIADA2

Thanks.

> Me (danieleizans.com)

> Work (Team Detroit)

> Passion (Contents Magazine)

> Microthoughts (@danieleizans)

@danieleizans | #WIADA2