CDLA · Module 2 — Learning science for digital media

Put cues where the eyes go

Spatial and temporal contiguity, plus signalling: related words next to related pictures, at the same time, with cues on what matters.

About 16 min

Practice in the lesson player

Sorting, matching, quizzes, and the module gate stay behind a free account so scored answers are not public. The teaching notes below are the same cited curriculum.

What this lesson covers

  1. 01

    Split attention is a design bug

    Spatial contiguity (d = 0.79): put printed words next to the part of the graphic they describe. Temporal contiguity (d = 1.30): play the narration with the matching graphic, not after it. Signalling (d = 0.46): highlight the essential parts so searching is not the lesson. All three remove work the learner should not have to do.

  2. 02

    Inspect a split-attention layout

    Title Inspect a split-attention layout

    Legend in a sidebar: Learners hunt between picture and legend. Put labels on the picture.

    "Click Next for the explanation": Temporal split. The graphic and its words are on different screens.

    Every box equally loud: No signalling. The eye has no entry point, so search becomes the task.

  3. 03

    Before and after

    Before: Numbered callouts 1 to 9 on a machine photo, with a numbered list below the photo. · A 60-second animation followed by a narrated summary.

    After: Short labels on the photo, each next to its part; only the three parts used in this task are labelled. · Narration plays step by step with the animation, paused between steps.

  4. 04

    Contiguity in right-to-left layouts

    Arabic readers enter and scan a screen from the right. Mirroring an English layout moves the labels, but it does not always move the focal point: a diagram that reads left to right (a process, a timeline) must be redrawn to flow right to left, or the labels end up on the wrong side of each step. Signalling cues such as arrows and highlights must be mirrored with the graphic. Check every animated sequence in the Arabic build, not only the static screens.

  5. 05

    Find one split

    In your review module, find one spatial or temporal split. Mock up the fixed version on paper or in Studio. Add the before and after to your design review.