Adaptive Content for Luminate CMS bbCon 2015
-
Upload
lacey-kruger -
Category
Design
-
view
253 -
download
2
Transcript of Adaptive Content for Luminate CMS bbCon 2015
![Page 1: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/1.jpg)
Adaptive Content with Luminate CMS PRESENTED BY LACEY KRUGER
![Page 2: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/2.jpg)
Meet Lacey…
Lacey Kruger Principal Information Architect
• 10+ years at Blackbaud/Convio
• Specializes in User Research,
Sitemaps, Wireframes and CMS architecture
• Member of Blackbaud Interactive’s User Experience and Design Team
![Page 3: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/3.jpg)
Meet Jane…
![Page 4: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/4.jpg)
Source: http://responsivedesign.ca/examples/the-boston-globe-a-newspaper-for-the-21st-century
![Page 5: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/5.jpg)
Meet Jane…
![Page 6: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/6.jpg)
What is Adaptive Content?
• Content that is structured so that a single item can be displayed across a multitude of devices in a multitude of formats
6 #bbcon
![Page 7: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/7.jpg)
![Page 8: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/8.jpg)
Source: Adapting Ourselves to Adaptive Content by Karen McGrane
![Page 9: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/9.jpg)
What is Adaptive Content?
9 #bbcon
COPE (Create Once, Publish Everywhere)
![Page 10: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/10.jpg)
Why is Adaptive Content Important?
10 #bbcon
![Page 11: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/11.jpg)
Why is Adaptive Content Important?
11 #bbcon
![Page 12: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/12.jpg)
Why is Adaptive Content Important?
12 #bbcon
![Page 13: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/13.jpg)
I’m on board! How do I start?
![Page 14: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/14.jpg)
Step 1: Content Inventory
![Page 15: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/15.jpg)
Step 2: Identify Content Types
Groups of content that share consistent fields or attributes, display templates and relationships
Common Types: • Article • Blog Post • Event • Profile
![Page 16: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/16.jpg)
Step 2: Identify Content Types
YES, create a content type:
• Predictable Properties • Consistent Formatting • Sorting and Filtering • Relationships
DON’T create a content type:
• Only a few items • Basic Page content type will
suffice
![Page 17: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/17.jpg)
Step 3: Design Display Templates
Layouts for each content type (with some exceptions)…
Single Display Template(s) • Design for a single item
of said content type • i.e. News Article page
NOTE: Consider responsive breakpoint views for each Display Template
List Display Template(s) • Design for a list of multiple
items of said content type • i.e. News Landing page
![Page 18: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/18.jpg)
![Page 19: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/19.jpg)
![Page 20: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/20.jpg)
Step 4: Define Meta Data
Meta Data are the consistent fields or attributes shared across items in a content type
Basic fields • Title • Description • Date
Display fields • Full-size photo • Thumbnail • Turn on/off promos
Relational fields • Topic Category • Audience Category • Related Items
![Page 21: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/21.jpg)
Use the WYSIWYG sparingly!
21 #bbcon
![Page 22: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/22.jpg)
Title Subtitle
Body Full-size image
![Page 23: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/23.jpg)
Topic category
Date
Description
Thumbnail photo
![Page 24: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/24.jpg)
Step 5: Implement and Educate
Luminate CMS allows you to write custom author instructions for each piece of Meta Data
![Page 25: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/25.jpg)
Step 5: Implement and Educate Remember! • Suggest
image dimensions and character counts
• Train on using WYSIWYG sparingly
![Page 26: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/26.jpg)
![Page 27: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/27.jpg)
![Page 28: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/28.jpg)
The Result
The feedback from our staff, volunteers, and users
has been great. It definitely was a learning curve the first week, but overall has been a major improvement
to the organization of our content. -NMFA Web Team
“
”
![Page 29: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/29.jpg)
Summary • Your org NEEDS Adaptive Content • Steps:
1. Content Inventory 2. Identify Content Types 3. Design Display Templates 4. Define Meta Data 5. Implement and Educate
• Use the WYSISYG sparingly! • Result: Future-Proofed Content, Happy Org
![Page 30: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/30.jpg)
Want More?
• Karen McGrane • Presentations:
• Adapting Ourselves to Adaptive Content • Content Strategy for Mobile
• Book: Content Strategy for Mobile
• Sara Wachter-Boettcher • Book: Content Everywhere
![Page 31: Adaptive Content for Luminate CMS bbCon 2015](https://reader031.fdocuments.us/reader031/viewer/2022030122/58a36d971a28aba4138b685b/html5/thumbnails/31.jpg)
Thank You! Contact Me: [email protected] http://www.slideshare.net/LaceyKruger