How we used the NHS Service Manual and WordPress to build essential products for the NHS during the Covid-19 outbreak.

A presentation at WordPress Birmingham in April 2020 in by Ben Everard

Slide 1

Slide 1

Building essential products for the NHS with WordPress B E N E V E R A R D

Slide 2

Slide 2

Patient Webinars

Slide 3

Slide 3

Patient Webinars • Homegrown website • Built on WordPress.com • Typical public sector issues • Replace existing website • Modest budget • What design approach should we take?

Slide 4

Slide 4

NHS Digital Service Manual • Companion to GOV.UK service manual • Design system • Accessible • Consistent • Considered • Resources provided

Slide 5

Slide 5

Figma Templates

Slide 6

Slide 6

Prebuilt Components

Slide 7

Slide 7

HTML Components • HTML + Nunjucks • NPM package

Slide 8

Slide 8

Components ⬇ Blocks ⬇ Gutenberg

Slide 9

Slide 9

Template Blocks ➡

Slide 10

Slide 10

Gutenberg • Fast block development • Creation • Testing • Deployment • Maintenance • “Infinite” content possibilities • Empower the client

Slide 11

Slide 11

Issues • Reusable block “template” would be useful • Editor styling is problematic • Styles bleed into WordPress UI • No way to exclude admin components from site styles • No block context available when modifying responsive image attributes

Slide 12

Slide 12

Tooling + • Fast block development • No React / JavaScript needed • Modern MVC framework • Similar to Laravel / Symfony • Separate logic and view • Fast website development

Slide 13

Slide 13

Covid-19

Slide 14

Slide 14

Thank you