Interface Lab

Findings

Verdicts on principles are based only on recorded experimental observations. Every finding states its limitations.

Supported · 4

  • Supported2026-10-03

    Reflow without two-dimensional scrolling

    At a 320 px test stage, the reflow and reflow-plus-effects variants had 0 px overflow, no overflowing or clipped components across replications and viewports, and accessible keyboard-scroll regions, even with experimental ambient, clipped 140% strip, and sticky bar. The fixed-width control failed all metrics (+308 px; 5/5 overflowing components; clipped card text; 47 stray elements). A separate 24-route lab sweep at 320 px found no horizontal page scrolling.

    Evidence: 007 Reflow at 320 px

    Limitations of this finding
    • Five component types (navigation, cards, tables, code, forms) plus three visual effects were evaluated; maps, canvases, video, and editors were not.
    • Chrome 154, Firefox 155, and WebKit 26.6 headless; physical Safari/Firefox and a real 320 px device were not tested.
    • 400% zoom was not run as a separate condition; testing at 320 CSS px was treated as equivalent under SC 1.4.10.
    • The Chrome sweep included all indexes, experiments, and demos but sampled only three principle pages and two reference pages; Firefox and WebKit covered all 84 routes.
    • Touch was approximated by viewport width, not gestures; keyboard-scroll regions were not checked with real screen readers.
  • Supported2026-10-01

    Interruptible motion

    CSS transitions reversed from their current position without a single frame moving the wrong way at either reversal point or viewport width. The two failing approaches behaved differently: @keyframes jumped to the new animation endpoint (40 points when reversed halfway, only 2–4 near the end of ease-out), while input locking always failed because the latest user command was discarded and the panel ended in the wrong state.

    Evidence: 001 Interruptible motion

    Limitations of this finding
    • Chromium 154, Firefox 155, and WebKit 26.6 headless at roughly 60 Hz; real Safari/Firefox, physical devices, and 120 Hz screens were not tested.
    • One easing curve (cubic-bezier(0.22, 1, 0.36, 1)) and one duration (300 ms). With linear or ease-in curves, keyframe jumps at 50% would be much larger.
    • JavaScript-driven animation (springs, Web Animations API reverse()) was not evaluated.
    • The instrument measured position, not user perception.
  • Supported2026-10-01

    Feedback at the point of action

    Replacing a button label in place while reserving its width put confirmation exactly where attention was focused (0 px), caused no layout shift, and remained announced. Toasts were announced too; their weakness was distance (419–966 px from the button) and obscured content on narrow screens. A width-unreserved label shifted neighboring content 20 px without registering as CLS.

    Evidence: 002 Feedback at the trigger

    Limitations of this finding
    • Announcements were checked in DOM live regions, not with actual screen readers (VoiceOver, NVDA, TalkBack).
    • Reserving the longest label's width makes the button wider than its current content; longer translations would enlarge it further.
    • One action type (copying) and one confirmation duration (2 seconds).
    • Chromium only.
  • Supported2026-10-01

    Interaction frequency determines motion

    During rapid keyboard repetition, 150–300 ms highlight animations lagged behind the logical selection in 100% of sampled frames, averaging 1–1.6 rows behind, and kept moving for 82–200 ms after release. Without animation, the highlight remained accurate. Potential benefits for rare single actions, such as visual continuity, were not measured.

    Evidence: 004 Interaction frequency and motion

    Limitations of this finding
    • Key repeat was simulated at 30 Hz. System settings vary, and the 150 ms variant may lag less at slower repeat speeds.
    • Chromium 154, Firefox 155, and WebKit 26.6 headless at roughly 60 Hz; real browsers/devices and 120 Hz displays were not tested.
    • Selection speed or accuracy by human users was not measured, only highlight position.
    • Only one ease-out curve was tested.
    • Klein & Bederson (2005) found that 300 ms animated scrolling accelerated reading and reduced errors. This finding applies only to keyboard-driven highlights, not scrolling.

Conditionally supported · 2

  • Conditionally supported2026-10-03

    Motion should be opt-in

    With reduced motion emulated and all components triggered, the opt-out variant ran exactly one animation (a skeleton shimmer with an intentionally omitted override), while opt-in ran none at every repetition and tested width; without reduced motion both behaved identically. This holds only when new components follow the opt-in convention; the pattern prevents accidental omissions, not deliberate violations.

    Evidence: 006 Motion as opt-in

    Limitations of this finding
    • The missing-override case was simulated rather than measured in real codebases; its actual prevalence is unknown.
    • Five small CSS-only components were tested. JavaScript animation, canvas, and video were not.
    • Chromium 153 headless-shell, Firefox 155, and WebKit 26.6 headless; real Safari/Firefox and physical devices were not tested.
    • The instrument counts all running Animation objects, including deliberate safer substitutes such as opacity crossfades. WebKit guidance (2017) recommends removing known vestibular triggers rather than all animation; this principle defaults to no motion without prohibiting explicitly chosen alternatives.
    • Effects on users were not measured; the instrument counted animations rather than symptoms or comprehension.
  • Conditionally supported2026-10-01

    Links that preserve and add context

    Stacked panels kept all three previously opened notes visible and encoded the complete navigation trail in the URL, whereas a single note per page preserved no visible context. Two conditions apply: focus must move to the new panel, or keyboard users remain in the old one; and narrow screens need an alternative such as a title trail, because at 375 px stacked panels leave no previous context visible.

    Evidence: 003 Links that add context

    Limitations of this finding
    • Context was measured as visible titles, not readable note content; later panels covered the previous panel bodies.
    • No real screen-reader study or reading tasks, such as returning to note two and quoting a sentence, were conducted.
    • Nine short notes; stacks deeper than four panels have not been evaluated.
    • Chromium only; touch behavior was approximated with viewport width, not actual gestures.

Insufficient evidence · 2

  • Insufficient evidence2026-10-03

    First impressions form within 50 ms

    The pilot confirmed its procedure: 500 ms exposures were timed accurately, unachievable 50 ms exposures were flagged, orders were randomized, and answers were recorded. But no human participants have taken part, so appeal rankings at 50 ms versus 500 ms cannot be compared and the hypothesis remains undecided.

    Evidence: 005 First impressions: novel yet recognizable

    Limitations of this finding
    • Zero participants; every answer came from a scripted probe.
    • Appeal items remain drafts; their wording was not taken from the original publication.
    • 50 ms exposures were never timed accurately: headless Chrome ran at 30 Hz on this machine and uncapped timing fluctuated.
    • Headless Chrome only; Safari, Firefox, and 120 Hz displays were not tested.
  • Insufficient evidence2026-10-03

    Novel, yet recognizable

    As with the paired principle, the pilot shows that the demo can compare stimuli S1 and S4, but without human participants there are no comparable judgments of novelty, typicality, or appeal.

    Evidence: 005 First impressions: novel yet recognizable

    Limitations of this finding
    • Zero participants; every answer came from a scripted probe.
    • Novelty, typicality, and content items remain drafts.
    • S4 is almost certainly more visually complex than S1–S3; equal complexity has not been achieved or measured from screenshots.
    • Block 2 repeats the same stimuli, so judgments may be influenced by Block 1.