Care Plan Template Guidelines

Owned by Mohammad Al-Ubaydli
Last updated: Sept 18, 2023 by Hannah Johnson-Keck
3 min read

You can create custom templates for care plans in PKB to suit your patient's unique needs. The PKB usability and design guidelines simplify the process of customising your care plan and describe how to make sure your form is workable for all users.

Note: This customization is done by PKB staff. We will consult with you about care plan templates on an individual basis.

General principles

Accessibility

PKB complies with the WCAG AA standards. You can read more about it here. You have to make sure that your care plan forms are designed with these standards in mind so that people with disabilities can use them.

  • Controls, Input: If non-text content is a control or accepts user input, then it has a name that describes its purpose

  • Contrast: The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following

    • Large-scale text and images of large-scale text have a contrast ratio of at least 3:1.

  • Non-text contrast: The visual presentation of the following have a contrast ratio of at least 3:1 against adjacent color(s)

    • User Interface Components: Visual information required to identify user interface components and states, except for inactive components or where the appearance of the component is determined by the user agent and not modified by the author;

    • Graphical Objects: Parts of graphics are required to understand the content, except when a particular presentation of graphics is essential to the information being conveyed.

  • Test-spacing: In content implemented using markup languages that support the following text style properties, no loss of content or functionality occurs by setting all of the following and by changing no other style property

    • Line height (line spacing) to at least 1.5 times the font size;

    • Spacing following paragraphs to at least 2 times the font size;

    • Letter spacing (tracking) to at least 0.12 times the font size;

    • Word spacing to at least 0.16 times the font size.

Colour

We do not recommend changing the use of colours from how it’s specified in the PKB colour guidelines. One of the most important usability principles is consistency. Every page in PKB should speak the same language with similar phrases, concepts, components and colours throughout the entire experience rather than have task-specific solutions. Patients should be able to recognise the layout and its elements and not have to wonder about their meaning or behaviour. Think about the traffic and how lost you would be if at a junction you suddenly met with a blue stop sign instead of the usual red.

Typography

  • Section titles to use “H2” (24px)

  • Sub-section titles to use “H3” (20px)

  • General text to use “Body (paragraph)” (16px)

  • Section and input description to use “Small-text” (14px)

    • Only use small-text for secondary section description. The main description of a section should use “Body (paragraph)”

Group related elements

  • Related elements should be closer to each other than unrelated elements

  • Use sections - separated by bigger spacing or separators - to group a set of related input fields

  • Avoid ambiguous spacing (certain elements - e.g. labels - are in even distance from related and unrelated elements)

  • Labels should be close to the input fields

One column layout

  • Have only one input field in a row

    1. Possible exceptions: logically related field e.g. date-time

  • Labels should be immediately above the input field

  • Place checkboxes and radios underneath each other