Modular Content In Wordpress

a featured products carousel

a big ass slider

a twitter feed

Posts from this category

Oops. I meant that category

Snowfall

Teehan & Lax

Anything by Vox Media

• Encourages a waterfall approach to content

• Content Strategy subject to dev process

• “Content” limited to wysiwyg’s & metaboxes

• “Content” is crafted to fit existing boxes

• Rich relationships are difficult to communicate

• Distances creators from the users

WordPress Challenges

• Design must function as a system

• Start with the smallest units and build up

• Everything is reusable

• Initial deliverables become Pattern Libraries and Frameworks

• Design all the way through your process, but identify how components are assembled to make specific deliverables. Design the relationships.

Aesthetics

• Theme needs to be organized, modular, and flexible

• IDs should be a red flag

• You should be able to output Bootstrap or Foundation like frameworks for your projects relatively easily

• Admin User Interfaces that encourage best practices.

Give them the right tools, not all of the tools.

TECHNOLOGY: Front + Back

• Small components come together to form individual pieces of content The Verge Longform, Velocity Page, Aesop Story Engine

• The relationships between individual pieces of content can tell larger storiesSnowfall, America The Gutted, Panel Builder, ACF Flex Content

• Content should continually push the abilities of the CMSPost Formats anyone?

• Stop thinking only in terms of taxonomy. Tell stories.

Content strategy

• Create unique and engaging pieces of static content

• Mix multiple columns, insert and manage media in fun and crazy ways

• Mix different custom post types

• Reinvent the way you think about telling stories

• Create landing pages or engaging content relationships on the fly

• http://today.law.harvard.edu

• http://www.globalpost.com/america-the-gutted-globalpost

• http://www.nytimes.com/projects/2012/snow-fall/?forceredirect=yes

• http://www.theguardian.com/world/interactive/2013/nov/01/snowden-nsa-files-surveillance-revelations-decoded#section/1

• http://pitchfork.com/features/cover-story/reader/bat-for-lashes/

Examples

• http://24ways.org/2012/design-systems/

• http://pea.rs/content/slats-html5

• http://bradfrostweb.com/blog/post/atomic-web-design/

• http://www.newfangled.com/the_way_you_design_web_content_is_about_to_change

• http://daverupert.com/2013/04/responsive-deliverables/

References