structuring content
DESCRIPTION
How can disciplines work together to achieve a structured design based on evolving, creative storytelling?TRANSCRIPT
![Page 1: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/1.jpg)
Structuring contentin an evolving design.
@emcguane
![Page 2: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/2.jpg)
About me.@emcguane
![Page 3: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/3.jpg)
I used to work like this.
![Page 4: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/4.jpg)
Now I work like this.
![Page 5: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/5.jpg)
A project.
![Page 6: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/6.jpg)
Pitch first, reverse engineer later.
![Page 7: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/7.jpg)
Writing for everyone, from scratch.
![Page 8: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/8.jpg)
•Platform
•Backbone
•Gaps
![Page 9: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/9.jpg)
What are you willing to sacrifice?
![Page 10: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/10.jpg)
•Agile, kind of
•Mobile-first, sort of
•Responsive, mostly
![Page 11: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/11.jpg)
The story.
![Page 12: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/12.jpg)
All the products.
![Page 13: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/13.jpg)
Structure to support content delivery?
![Page 14: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/14.jpg)
Structure to support editors.
![Page 15: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/15.jpg)
Narrative structure.
![Page 16: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/16.jpg)
I’m$a$sheep$farmer$and$use$my$Honda$generator$to$power$sheep$scanners,$as$soon$as$the$sheep$become$pregnant.$It$is$used$at$an$early$stage$in$pregnancy$to$tell$whether$a$ewe$is$in$lamb$or$not.$
The story of every product.
![Page 17: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/17.jpg)
The story of the brand.
![Page 18: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/18.jpg)
The arc of a page.
The hook
A single telling detail
ChoiceComparison at the
heart
Benefits in a narrative
Emotion as an anchor
Choice
Choice
![Page 19: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/19.jpg)
Story told in sequence.
![Page 20: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/20.jpg)
The whole story.
The teaser
The proofThe
technical stuff
The fun extras
The decision
![Page 21: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/21.jpg)
The reader rules all.
![Page 22: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/22.jpg)
Mobile first inevitably.
![Page 23: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/23.jpg)
Where we went wrong.
![Page 24: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/24.jpg)
“Let’s focus on structure to begin with, and think about content all the time.”
- @markboulton
![Page 25: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/25.jpg)
We wrote words early. And looked to words already written.
![Page 26: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/26.jpg)
Content modeling?
![Page 27: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/27.jpg)
What formats should we build?
![Page 28: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/28.jpg)
Just how much content variety does one site need?
![Page 29: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/29.jpg)
How do you communicate these decisions?
![Page 30: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/30.jpg)
Tools and documentation.
![Page 31: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/31.jpg)
Own your IA.
![Page 32: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/32.jpg)
Source material is only one input.
![Page 33: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/33.jpg)
Structure can’t be siloed from meaning.
![Page 34: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/34.jpg)
@markboulton again: “Designing a magazine or newspaper system requires the designer to exercise rigorous restraint with a hugely variable melting pot of content.”
![Page 35: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/35.jpg)
Structure without goals or needs is useless.
![Page 36: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/36.jpg)
![Page 37: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/37.jpg)
A Page Description Diagram? (I hate naming things)
![Page 38: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/38.jpg)
‘A trigger, not a finished brief.’- Greig Robinson
![Page 39: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/39.jpg)
Structure and the CMS.
![Page 40: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/40.jpg)
Always be OK with letting things go.
![Page 41: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/41.jpg)
Work better together.
![Page 42: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/42.jpg)
“The best solution isn’t to build tools that hide that complexity from the user, that make them think that the styling they’re adding to the desktop site is the “real” version of the content.
- @karenmcgrane
![Page 43: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/43.jpg)
Need to think visually and structurally.
![Page 44: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/44.jpg)
My success story.
![Page 45: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/45.jpg)
Price.Rate.Service.
![Page 46: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/46.jpg)
Why it worked:precise. reusable. needs-based.
![Page 47: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/47.jpg)
Structure is a common thread
between disciplines.
![Page 48: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/48.jpg)
Content modeling is “the practice by which disciplines collaborate on the design of structured content”.
- Cleve Gibbon & Rachel Lovinger
![Page 49: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/49.jpg)
All design should be “the practice by which disciplines collaborate on the design of structured content”.
- Everyone someday, hopefully
![Page 50: Structuring content](https://reader034.vdocument.in/reader034/viewer/2022042614/5597543b1a28abfb5b8b47e8/html5/thumbnails/50.jpg)
Thank you.@emcguane