Content Design: What it is & why you need it

1. Content Design What it is & why you need it Erin Abler Lead Content Designer, Office of Innovation & Technology City of Philadelphia @erinabler

2. Erin Abler • @erinabler Content design The practice of shaping information to help people take action.

3. Erin Abler • @erinabler Medicaid: Apply if you are aged (65 years old or older), blind, or disabled and have low income and few resources. Apply if you are terminally ill and want to receive hospice services. Apply if you are aged, blind, or disabled; live in a nursing home; and have low income and limited resources. Apply if you are aged, blind, or disabled and need nursing home care, but can stay at home with special community care services. Apply if you are eligible for Medicare and have low income and limited resources. http://www.plainlanguage.gov/testexamples/indexExample.cfm?record=86

4. Erin Abler • @erinabler Medicaid: Apply if you are aged (65 years old or older), blind, or disabled and have low income and few resources. Apply if you are terminally ill and want to receive hospice services. Apply if you are aged, blind, or disabled; live in a nursing home; and have low income and limited resources. Apply if you are aged, blind, or disabled and need nursing home care, but can stay at home with special community care services. Apply if you are eligible for Medicare and have low income and limited resources. Government content is confusing.

5. Erin Abler • @erinabler Medicaid: Apply if you are aged (65 years old or older), blind, or disabled and have low income and few resources. Apply if you are terminally ill and want to receive hospice services. Apply if you are aged, blind, or disabled; live in a nursing home; and have low income and limited resources. Apply if you are aged, blind, or disabled and need nursing home care, but can stay at home with special community care services. Apply if you are eligible for Medicare and have low income and limited resources. Government content is repetitive.

6. Erin Abler • @erinabler Medicaid: Apply if you are aged (65 years old or older), blind, or disabled and have low income and few resources. Apply if you are terminally ill and want to receive hospice services. Apply if you are aged, blind, or disabled; live in a nursing home; and have low income and limited resources. Apply if you are aged, blind, or disabled and need nursing home care, but can stay at home with special community care services. Apply if you are eligible for Medicare and have low income and limited resources. Government content is hard to read.

7. Erin Abler • @erinabler Medicaid: Apply if you are aged (65 years old or older), blind, or disabled and have low income and few resources. Apply if you are terminally ill and want to receive hospice services. Apply if you are aged, blind, or disabled; live in a nursing home; and have low income and limited resources. Apply if you are aged, blind, or disabled and need nursing home care, but can stay at home with special community care services. Apply if you are eligible for Medicare and have low income and limited resources. Government content is bad content.

8. Erin Abler • @erinabler Why should we care?

9. Erin Abler • @erinabler It affects the quality of our services.

10. Erin Abler • @erinabler It affects our bottom line.

11. Erin Abler • @erinabler It affects whether or not people trust us.

12. Erin Abler • @erinabler It affects our ability to do our job.

13. Erin Abler • @erinabler How do we fix it?

14. Erin Abler • @erinabler Content precedes design. Design without content isn’t design, it’s decoration. “ Jeffrey Zeldman Founder, A List Apart (1998), Happy Cog (1999)

15. Ad hoc rewriting is a crutch, not a solution.

16. Erin Abler • @erinabler So, wait… how DO we fix it?

17. Erin Abler • @erinabler

18. Erin Abler • @erinabler User needs are our north star

19. https://www.gov.uk/design-principles

20. Erin Abler • @erinabler Content design objectives • Understand user needs • Organize information more intuitively • Create new content for unmet needs • Develop an underlying content strategy • Manage content at every stage

21. Erin Abler • @erinabler Conduct user research • Analytics • User interviews • Task analysis • Surveys

22. Erin Abler • @erinabler Create user need stories As a: [type of user] I need to: [task/action] So that I can: [goal]

23. Erin Abler • @erinabler Create user need stories As a: [type of user] Who is this for? I need to: [task/action] So that I can: [goal]

24. Erin Abler • @erinabler Create user need stories As a: [type of user] Who is this for? I need to: [task/action] What will help this person reach their goal? So that I can: [goal]

25. Erin Abler • @erinabler Create user need stories As a: [type of user] Who is this for? I need to: [task/action] What will help this person reach their goal? So that I can: [goal] What larger thing does the user need to accomplish?

26. Erin Abler • @erinabler Create user need stories As a [type of user], I need to [task/action] so that I can [goal].

27. Erin Abler • @erinabler Create user need stories As a [type of user], I need to [task/action] so that I can [goal]. As a homeowner, I need to know how much real estate tax I owe so I can make a payment.

28. Erin Abler • @erinabler Create user need stories As a [type of user], I need to [task/action] so that I can [goal]. As a homeowner, I need to know how much real estate tax I owe so I can make a payment. As a small business owner, I need to know which taxes I’m required to pay so I don’t get in trouble for not paying them.

29. Erin Abler • @erinabler Create user need stories As a [type of user], I need to [task/action] so that I can [goal]. As a homeowner, I need to know how much real estate tax I owe so I can make a payment. As a small business owner, I need to know which taxes I’m required to pay so I don’t get in trouble for not paying them. As a low income resident, I need to find affordable tax counseling so that I can prepare my tax return correctly.

30. Erin Abler • @erinabler Gov.uk’s scoping rules 1. Do people want this? 2. Can people reasonably expect us to meet this need? 3. Can only government meet this need? 4. Is it explaining someone’s rights or obligations? 5. Is it transactional or encouraging a shift to digital by default government services? https://gds.blog.gov.uk/2011/09/19/introducing-the-needotron-working-out-the-shape-of-the-product/

31. Erin Abler • @erinabler User Needs Prioritization People want this We can meet this need Only gov’t provide s this Explains rights or obligations Trans- actional, digital by default As a homeowner, I need to know how much real estate tax I owe so I can make a payment. As a small business owner, I need to know which taxes I’m required to pay so I don’t get in trouble. As a low income resident, I need to find affordable tax counseling so that I can prepare my tax return correctly.

34. Well-designed content turns a need into an action.

35. Erin Abler • @erinabler To meet a need . . . • Be specific • Be informative, not descriptive • Keep to the point • Be clear about what comes next

36. Erin Abler • @erinabler Our user need As I need to So that I know what to do am prepared to deal with one if it happens. someone potentially affected by a future emergency,

37. Erin Abler • @erinabler 1 1 Mixed themes & multiple headers Before . . .

38. Erin Abler • @erinabler 2 1 Mixed themes & multiple headers 2 No explanation of unfamiliar term Before . . .

39. Erin Abler • @erinabler 1 Mixed themes & multiple headers 2 3 No explanation of unfamiliar term Different descriptions cover the same subject Before . . . 3

40. Erin Abler • @erinabler 2 3 1 Mixed themes & multiple headers 2 3 4 No explanation of unfamiliar term Different descriptions cover the same subject Indirectly related content dominates the page Before . . . 4

41. Erin Abler • @erinabler …and after1 1 Clear organizational premise

42. Erin Abler • @erinabler …and after 1 Clear organizational premise 2 Plain-language description 2

43. Erin Abler • @erinabler …and after 3 1 Clear organizational premise 2 3 Plain-language description Consolidation of repetitive content

44. Erin Abler • @erinabler …and after 1 Clear organizational premise 2 3 4 Plain-language description Consolidation of repetitive content Related content moved to its own subsection 4

45. Erin Abler • @erinabler How do we clean up content?

46. Erin Abler • @erinabler Revision is creation.

47. Erin Abler • @erinabler The best ways to revise content are also the best ways to create it.

48. Erin Abler • @erinabler Support scanning • People only read 20-28% of text on a page. • We look for clues that we’re on the right track before we actually commit to reading. Jakob Nielsen, http://www.nngroup.com/articles/how-little-do-users-read/ Why How • Use brief, clear headings. • Break lists into bullet points. • Use sentence case, not all-caps.

49. Erin Abler • @erinablerJakob Nielsen, http://www.nngroup.com/articles/f-shaped-pattern-reading-web-content/

50. Erin Abler • @erinabler Put the important stuff first • People scan content in an F-shaped pattern. • Readers will decide for themselves if they want more detailed information. Why How • Put critical information in the first two paragraphs. • Start subheadings, bullet points, and paragraphs with informative, noticeable words.Jakob Nielsen, http://www.nngroup.com/articles/f-shaped-pattern-reading-web-content/

51. Erin Abler • @erinabler Use white space • Cramped page layouts make it hard to tell which content is the most important. • Dense, lengthy text is less likely to be read. Why How • Keep most paragraphs 2-3 sentences long. • Work with a designer to create an intuitive visual flow. Jakob Nielsen, http://www.nngroup.com/articles/how-little-do-users-read/

52. Erin Abler • @erinabler Use active voice • People want to be spoken to, not at – and certainly not about. • It’s human nature to be impatient. Dan Carlin, http://www.crocstar.com/2015/02/online-writer-skills/ Why How • Use “you” and “your” when talking to the reader. • Name the doer before the thing being done.

53. Erin Abler • @erinabler Talk like a human • Bureaucratic language is often obscure. • Everyone needs context when learning something new. Why How • Use common words and contractions. • Provide context and explain the unfamiliar. • Aim for an 8th grade reading level – 5th or 6th grade when possible.

54. Erin Abler • @erinabler Fight complexity • Long, complicated phrases take longer to read and more concentration to understand. • Unnecessary details only delay action. Why How • Shorten sentences to 15 words or fewer whenever possible. • Aim to instruct or explain, not to describe.

55. Erin Abler • @erinabler Choose format purposely • Text isn’t always the best way to help someone take action Why How • Make processes and transactions interactive • Use digital forms to collect information • Use meaningful visuals, not random stock photos

56. Erin Abler • @erinabler How can we tell whether it works?

57. A Consistently clear, concise, and direct. Based on identifiable user needs. Provides a logical path to a decision or action. Uses appropriate tone. Uses a format purposely selected to optimize clarity, intuitiveness, and interactivity. B Generally effective. Clear, well structured, supports a central concept, and uses language understandable to a wide audience. Supports users’ needs with actionable information. May benefit from additional consolidation, editing, or a different format. C Meets basic requirements but has noticeable shortcomings. May be disorganized, difficult to follow, redundant, or attempt to cover more than one subject. D Below acceptable standards. Poor organization, ineffective sentence construction, unnecessary details, and imprecise or misleading wording. Incomplete, repetitive, or uses excessive jargon. May include typos, broken links, or other proofreading errors. F Inaccurate, unnecessary, or so poorly written that it’s likely to confuse or mislead users. May include dense prose or irrelevant material, or be located in a place that doesn’t match users’ expectations.

58. A Consistently clear, concise, and direct. Based on identifiable user needs. Provides a logical path to a decision or action. Uses appropriate tone. Uses a format purposely selected to optimize clarity, intuitiveness, and interactivity. B Generally effective. Clear, well structured, supports a central concept, and uses language understandable to a wide audience. Supports users’ needs with actionable information. May benefit from additional consolidation, editing, or a different format. C Meets basic requirements but has noticeable shortcomings. May be disorganized, difficult to follow, redundant, or attempt to cover more than one subject. D Below acceptable standards. Poor organization, ineffective sentence construction, unnecessary details, and imprecise or misleading wording. Incomplete, repetitive, or uses excessive jargon. May include typos, broken links, or other proofreading errors. F Inaccurate, unnecessary, or so poorly written that it’s likely to confuse or mislead users. May include dense prose or irrelevant material, or be located in a place that doesn’t match users’ expectations. • Consistently clear, concise, and direct • Based on an identifiable user need • Provides a logical path to a decision or action • Uses appropriate tone • Uses a format purposely selected to optimize clarity, intuitiveness, and interactivity

59. A Consistently clear, concise, and direct. Based on identifiable user needs. Provides a logical path to a decision or action. Uses appropriate tone. Uses a format purposely selected to optimize clarity, intuitiveness, and interactivity. B Generally effective. Clear, well structured, supports a central concept, and uses language understandable to a wide audience. Supports users’ needs with actionable information. May benefit from additional consolidation, editing, or a different format. C Meets basic requirements but has noticeable shortcomings. May be disorganized, difficult to follow, redundant, or attempt to cover more than one subject. D Below acceptable standards. Poor organization, ineffective sentence construction, unnecessary details, and imprecise or misleading wording. Incomplete, repetitive, or uses excessive jargon. May include typos, broken links, or other proofreading errors. F Inaccurate, unnecessary, or so poorly written that it’s likely to confuse or mislead users. May include dense prose or irrelevant material, or be located in a place that doesn’t match users’ expectations. • Generally clear and effective • Structured to support a central concept • Uses language understandable to a wide audience • Supports users’ needs with actionable information • May benefit from further consolidation, editing, or a different format

60. A Consistently clear, concise, and direct. Based on identifiable user needs. Provides a logical path to a decision or action. Uses appropriate tone. Uses a format purposely selected to optimize clarity, intuitiveness, and interactivity. B Generally effective. Clear, well structured, supports a central concept, and uses language understandable to a wide audience. Supports users’ needs with actionable information. May benefit from additional consolidation, editing, or a different format. C Meets basic requirements but has noticeable shortcomings. May be disorganized, difficult to follow, redundant, or attempt to cover more than one subject. D Below acceptable standards. Poor organization, ineffective sentence construction, unnecessary details, and imprecise or misleading wording. Incomplete, repetitive, or uses excessive jargon. May include typos, broken links, or other proofreading errors. F Inaccurate, unnecessary, or so poorly written that it’s likely to confuse or mislead users. May include dense prose or irrelevant material, or be located in a place that doesn’t match users’ expectations. • Meets basic requirements but has noticeable shortcomings • Suffers from disorganization • Uses logic or language that is difficult to follow • Repeats key points instead of stating them clearly • Often attempts to cover more than one

61. A Consistently clear, concise, and direct. Based on identifiable user needs. Provides a logical path to a decision or action. Uses appropriate tone. Uses a format purposely selected to optimize clarity, intuitiveness, and interactivity. B Generally effective. Clear, well structured, supports a central concept, and uses language understandable to a wide audience. Supports users’ needs with actionable information. May benefit from additional consolidation, editing, or a different format. C Meets basic requirements but has noticeable shortcomings. May be disorganized, difficult to follow, redundant, or attempt to cover more than one subject. D Below acceptable standards. Poor organization, ineffective sentence construction, unnecessary details, and imprecise or misleading wording. Incomplete, repetitive, or uses excessive jargon. May include typos, broken links, or other proofreading errors. F Inaccurate, unnecessary, or so poorly written that it’s likely to confuse or mislead users. May include dense prose or irrelevant material, or be located in a place that doesn’t match users’ expectations. • Falls below acceptable standards • Significantly hampered by poor organization • Includes repetitive or unnecessary details • Has imprecise, awkward wording • May include jargon or needless complexity • May include typos, broken links, or other proofreading errors

62. A Consistently clear, concise, and direct. Based on identifiable user needs. Provides a logical path to a decision or action. Uses appropriate tone. Uses a format purposely selected to optimize clarity, intuitiveness, and interactivity. B Generally effective. Clear, well structured, supports a central concept, and uses language understandable to a wide audience. Supports users’ needs with actionable information. May benefit from additional consolidation, editing, or a different format. C Meets basic requirements but has noticeable shortcomings. May be disorganized, difficult to follow, redundant, or attempt to cover more than one subject. D Below acceptable standards. Poor organization, ineffective sentence construction, unnecessary details, and imprecise or misleading wording. Incomplete, repetitive, or uses excessive jargon. May include typos, broken links, or other proofreading errors. F Inaccurate, unnecessary, or so poorly written that it’s likely to confuse or mislead users. May include dense prose or irrelevant material, or be located in a place that doesn’t match users’ expectations. • Inaccurate, unnecessary, or so poorly written that it’s likely to confuse or mislead users • May include dense prose or irrelevant material • May be located in a place that doesn’t match users’ expectations

63. Erin Abler • @erinabler F A Failure of recollection is common. Innocent misrecollection is not uncommon. People often forget things or make mistakes in what they remember. http://www.plainlanguage.gov/examples/before_after/jury.cfm

64. Erin Abler • @erinabler D C A preponderance of the evidence. More likely than not. http://www.plainlanguage.gov/examples/before_after/jury.cfm

65. Erin Abler • @erinabler A brief guide to writing well 1. Write something. Anything.

66. Erin Abler • @erinabler A brief guide to writing well 1. Write something. 2. Walk away from it. Seriously. At least 5,000 steps.

67. Erin Abler • @erinabler A brief guide to writing well 1. Write something. 2. Walk away from it. 3. Reread it. Wonder what you were thinking.

68. Erin Abler • @erinabler A brief guide to writing well 1. Write something. 2. Walk away from it. 3. Reread it. 4. Revise it.

69. Erin Abler • @erinabler A brief guide to writing well 1. Write something. 2. Walk away from it. 3. Reread it. 4. Revise it. 5. Have someone else read it. Befriend that coworker who finds fault with everything.

70. Erin Abler • @erinabler A brief guide to writing well 1. Write something. 2. Walk away from it. 3. Reread it. 4. Revise it. 5. Have someone else read it. 6. Revise it.

71. Erin Abler • @erinabler A brief guide to writing well 1. Write something. 2. Walk away from it. 3. Reread it. 4. Revise it. 5. Have someone else read it. 6. Revise it. 7. Have a lot of people read it. Get feedback. Get data. Get humble.

72. Erin Abler • @erinabler A brief guide to writing well 1. Write something. 2. Walk away from it. 3. Reread it. 4. Revise it. 5. Have someone else read it. 6. Revise it. 7. Have a lot of people read it. 8. Revise it. Repeat as needed.

73. Erin Abler • @erinabler Key points • Ad hoc rewriting is a crutch, not a solution. • Well-designed content turns a need into an action. • The best ways to revise content are also the best ways to create content. • To improve, seek feedback. • And finally…

74. Don’t just make content better. Make better content.

Content Design: What it is & why you need it

You are reading a preview.

Check these out next

Content Design: What it is & why you need it

More Related Content

Viewers also liked (16)

Similar to Content Design: What it is & why you need it (20)

Recently uploaded (20)