Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Designing Connected Content With Craft CMS

31 views

Published on

Content is the whole point of the digital products you create. It needs to be omni-channel, ready for AI and machine learning, and easily maintained. But many teams struggle with how to get content up front, maintain it once it’s published, and make sure it’s ready for the future. As a Craft developer, you already have the tools to support a connected content framework. Structured content creates relationships, connects to other systems, and allows for personalised customer experiences.

We’ll answer your most pressing questions about incorporating content strategy into your work, including:

- How can you contribute to the planning phase of web projects?
- How to get real content to work with during implementation?
- What does a CMS developer need to ask for?
- How do you educate clients on the benefits of doing and the consequences of not putting content first?
- How to build your team’s confidence and trust the design and content you get?
- What makes your CMS and content future-proof and maintainable?

Published in: Design
  • Be the first to comment

  • Be the first to like this

Designing Connected Content With Craft CMS

  1. 1. Content strategy strategy for today and tomorrow 23 May 2019 Craft CMS Manchester Carrie Hane
 @carriehd DESIGNING CONNECTED CONTENT WITH CRAFT CMS
  2. 2. ££££
  3. 3. !4 STRUCTURED CONTENT STACK More Volatile More Stable Domain model The Shape and Structure of Your Subject Content model How Content Is Broken Down and Connected Content Words and Pictures Conforming to Content Types Representation Windows on the World Navigation The Pathways Through Connected Content
  4. 4. !5 DOMAIN MODEL More Volatile More Stable Domain model THE SHAPE AND STRUCTURE OF YOUR SUBJECT
  5. 5. !6 CONTENT MODEL More Volatile More Stable Domain model The shape and structure of your subject Content model HOW CONTENT IS BROKEN DOWN AND CONNECTED
  6. 6. More Volatile More Stable !7 CONTENT Domain model The shape and structure of your subject Content model How content is broken down and connected Content WORDS AND PICTURES CONFORMING TO CONTENT TYPES
  7. 7. WINDOWS ON THE WORLD !8 REPRESENTATION More Volatile More Stable Domain model The shape and structure of your subject Content model How content is broken down and connected Content Words and pictures conforming to content types Representation
  8. 8. !9 NAVIGATION More Volatile More Stable Domain model The shape and structure of your subject Content model How content is broken down and connected Content Words and pictures conforming to content types Representation Windows on the world Navigation THE PATHWAYS THROUGH CONNECTED CONTENT
  9. 9. PEOPLE PROBLEM
  10. 10. !11 Model-first process Q&A Making it happen Q&A TONIGHT
  11. 11. Designing Connected Content Process
  12. 12. 1 WHAT WORLD DO YOU OPERATE IN?
  13. 13. WHAT WORLD DO YOU OPERATE IN? 14 Music Public service broadcasting Athletes
  14. 14. DOMAIN MODEL FOR LIVE MUSIC 15 PERFORMER ACT VENUE LOCATION GENRELINEUP PERFORMANCE TOUR SETLIST SONG knownAs hostedIn locatedIn partOf performs partOf hasGenre performedIn hasSong hasGenre
  15. 15. 2 HOW DO YOU FIT INTO THAT WORLD?
  16. 16. !17 CONTENT MODEL FOR TICKET SELLER PERFORMER ACT VENUE LOCATION GENRELINEUP PERFORMANCE TOUR SETLIST SONG knownAs hostedIn locatedIn partOf performs partOf hasGenre performedIn hasSong hasGenre
  17. 17. !18 CONTENT MODEL FOR TICKET SELLER VENUE Venue Name
 Address
 City
 State
 Country
 Phone Number
 Email Address
 Website
 Age Restrictions
 Menu
 Related Venues
 History
 Proprietor
 Seating Style
 Maximum Capacity ACT Act Name
 About the Act
 Years Active PERFORMER Stage Name
 Birth Name
 Birthdate
 Birthplace
 Biography
 Instruments Played
 Years Active LINEUP Lineup Name
 Performers
 Known As
 Upcoming Performances
 Years Active PERFORMANCE Performance Name
 Date
 Time
 Venue
 Lineup
 Part of This Tour
 Genre GENRE Genre Name
 Description
 Origin TOUR Tour Name
 Tour Dates
 Legs
 Number of Performances partOf performs hasGenre hasGenre partOf hostedIn
  18. 18. 3 Design the Content
  19. 19. RESOURCE BEFORE REPRESENTATION
  20. 20. THINK WIKIPEDIA 21 Content Type = PERFORMER
  21. 21. THINK WIKIPEDIA 22 Content Type = ACT
  22. 22. USE THE CHUNKS TO DESIGN USEFUL CONTENT Who is This Act? Content Type Attribute Example Content Lineup Lineup Name U2 Performer Performer Name Bono Performer Years Active 1976-Present Content Type Attribute Example Content Genre Genre Name Rock What Kind of Music Do They Play?
  23. 23. USE THE CHUNKS TO DESIGN USEFUL CONTENT When Are Their Concerts? Content Type Attribute Example Content Tour Tour Name eXPERIENCE + iNNOCENCE Tour Tour Dates May 2, 2018 - Nov. 10, 2018 Performance Date June 17, 2018 Venue Venue Name Capital One Arena Venue City, State Washington, D.C. Content Type Attribute Example Content Tickets URL Buy Tickets How Can I Get Tickets to the Show?
  24. 24. CREATE A SYSTEM TO MANAGE THE CONTENT
  25. 25. CONTENT MANAGEMENT SYSTEM 26 Content Type Description Field Label Field Type Performer Individual who performs music First Name Plain Text Last Name Plain Text Birth Name Plain Text Birthdate Date Birthplace Plain Text Biography Rich Text Instruments Multi-select List
  26. 26. 5 CREATE THE REPRESENTATIONS
  27. 27. WINDOWS INTO THE WORLD 28 $.ajax({ type:"GET", url:"https://app.ticketmaster.com/discovery/v2/ events/G5diZfkn0B-bh.json?apikey={apikey}", async:true, dataType: "json", success: function(json) { console.log(json); // Parse the response. // Do other things. }, error: function(xhr, status, err) { // This time, we do not end up here! }
  28. 28. ATOMIC DESIGN 29 Source: http://bradfrost.com/blog/post/atomic-web-design
  29. 29. RESOURCE TEMPLATES 30 <html> <head> <title>[ActName TourName TourDates]</title> </head> <body> <h1>[ActName]</h1> <h2>[TourName]</h2> <p>[TourStartDate - TourEndDate]</p> <h3>Tour Stops</h3> <p>[PerformanceCityState], [PerformanceDate]</p> <a href="TicketURL">Get Tickets</a> </body> </html>
  30. 30. INDEX TEMPLATES 31 <html> <head> <title>[Summer 2018 Tours]</title> </head> <body> <h1>Summer 2018 Tours</h1> <h2>[ActName]</h2> <p><a href="[Tour]">[TourName]</a><br/> [TourStartDate - TourEndDate]<br/> <strong>Stops</strong><br/> [PerformanceCityState]</p> <a href="TicketURL">Get Tickets</a> </body> </html>
  31. 31. Nicole Fenton
 Words As Material IT’S EASY TO PUT PIXELS TOGETHER WHEN YOU’VE ALREADY MADE DECISIONS.
  32. 32. 5 MAKE PATHWAYS THROUGH YOUR CONTENT
  33. 33. MENUS 34 Happening Soon Justin Timberlake
 03/28/2018
 See all Brit Floyd
 03/23/2018
 See all Earth, Wind & Fire
 03/25/2018
 See all Chicago 90’s Block Party
 03/30/2018
 See all Boyz II Men
 03/23/2018
 See all Yfn Lucci
 03/29/2018
 See all Popular Shows Imagine Dragons Yeah Yeah Yeahs Jason Aldean Chicago and REO Speedwagon Post Malone Justin Timberlake DISPATCH Bad Bunny Joan Baez The Grateful Dead Shop by Category All Music Alternative Rock Cabaret Classical Comedy Country and Folk Dance/Electronic Festivals Hard Rock/Metal Jazz and Blues Latin Miscellaneous New Age and Spiritual R&B/Urbal Soul Rap and Hip-Hop Rock and Pop World Music
  34. 34. CONTEXTUAL NAVIGATION 35
  35. 35. URLs ARE NAVIGATION TOO 36 http://www.findtickets.com/performers/bono http://www.findtickets.com/performers/ http://www.findtickets.com/acts/u2 http://www.findtickets.com/acts http://www.findtickets.com/performers/:performer_name http://www.findtickets.com/acts/:act_name
  36. 36. Sort Of PLOT TWIST
  37. 37. Changing Hearts & Minds
  38. 38. !39 YOU WANT TO… 1. Participate in the planning of the site 2. Know what you build is the right thing 3. Future-proof your CMS OTHERS… 1. Are used to doing hand-offs 2. Assume you have to redesign websites every 3-5 years 3. Want the CMS to look like word
  39. 39. HOW TO BRIDGE THE GAP?
  40. 40. !41 • Be proactive ๏ Find allies ๏ Ask questions ๏ Invite yourself to meetings ๏ Have something ready to show • Be the change agent • Have a plan • Do experiments BRIDGE THE GAP
  41. 41. !42 • Who, what, how content will be created and maintained • Content strategy statement • Domain model START WITH CONTEXT <Organization> offers __________, __________ content that helps it ______________ and __________ by making _____________ feel __________, __________, and __________, convincing them to __________ and __________. adjective adjective accomplish goal accomplish goal audience adjective adjective adjective take an action take an action
  42. 42. !43 • Create a roadmap • Reconfigure the project plan • Separate planning & design from build • Model collaboration • Have templates ready to share and use SHOW, DON’T TELL
  43. 43. !44 TOOLS & TEMPLATES www.tanzenconsulting.com/ content-strategy-tools bit.ly/structured- content-sheet Content Operations Platform
  44. 44. !45 • Seek acceptable risk • Find willing clients or stakeholders, flexible projects, and excited team members • Do a pilot, small project, or internal project to test the new process • Get coaching for one or two projects EXPERIMENT I do this!
  45. 45. QUESTIONS? COMMENTS?
  46. 46. Content strategy for today and tomorrow THANK YOU FOR ATTENDING 
 CRAFT CMS MANCHESTER REACH ME AT: @carriehd www.tanzenconsulting.com Share Your Passion, Try New Things, 
 Support Others, Create Trust, and
 Nurture Community Dot All Conference 18-20 September 2019 Montréal, Canada dotall.com

×