5. Unobtrusive Architecture

📅 Last updated: Nov 14, 2024 👤 Maintained by: Core Systems Team 📄 Section 5 of 12

The Unobtrusive Architecture framework defines how Aevum Encyclopedia presents complex information without overwhelming the reader. Unlike traditional interfaces that prioritize feature visibility, this approach treats attention as a finite resource, designing systems that fade into the background until explicitly required.

This document outlines the philosophical foundations, interaction patterns, and technical constraints that govern unobtrusive design across all editorial and platform surfaces.

â„šī¸ Scope Note
This section applies to all knowledge presentation layers, including but not limited to: article rendering, citation overlays, semantic navigation, and AI-assisted reading modes.

Core Principles

Unobtrusive design is not about removing functionality; it is about sequencing it according to cognitive demand. The following principles form the bedrock of our interface philosophy:

Cognitive Minimalism

Every pixel competes for attention. Elements that do not directly serve comprehension must be deferred, hidden, or contextualized. The reading surface should remain mathematically clean: maximum contrast for text, minimum visual noise for chrome.

Progressive Disclosure

Information complexity should match user intent. A casual reader sees a streamlined article; a researcher triggers citation layers, methodology notes, and cross-references without altering the primary reading flow. Disclosure happens through intent, not assumption.

"The best interface is the one you don't notice until you need it. Knowledge platforms should behave like libraries, not exhibitions."
— Platform Design Charter, Section 4.2

Implementation Guidelines

Translating philosophy into code requires strict adherence to interaction boundaries. The following patterns are mandatory for all new components:

UI Patterns

  • Contextual Toolbars: Navigation and controls should appear only during hover or text selection, collapsing within 200ms of inactivity.
  • Inline Annotations: Citations and definitions render as subtle underlines. Click or tap reveals a micro-drawer that does not scroll or reflow the main content.
  • Depth Layers: Related articles, metadata, and contributor notes exist in a secondary pane or modal stack, never interrupting the primary viewport.
âš ī¸ Violation Notice
Auto-playing media, persistent recommendation carousels, and inline subscription prompts are strictly prohibited under this architecture. They violate the non-interruption covenant.

Content Flow

Reading progression must remain linear by default. Semantic jumps (table of contents, search, citations) should feel like footnotes, not navigation events. The DOM structure must preserve reading order even when visual layers are toggled.

<!-- Correct: Semantic layering -->
<article class="prose" tabindex="0">
  <p>Primary text flows uninterrupted...</p>
  <span class="annotation" data-target="cite-42">Verified</span>
</article>
<aside class="depth-layer" hidden>...</aside>

Technical Specifications

All implementations must satisfy the following performance and accessibility thresholds:

Metric Threshold Measurement
Interaction Latency < 50ms Time-to-interactive for overlay reveals
Reflow Impact 0 Layout shifts during annotation expansion
Accessibility WCAG 2.1 AA Keyboard navigation & screen reader flow
Bundle Size < 15KB gzipped Unobtrusive component module

References & Further Reading

  • Aevum Design System: /docs/ui/annotation-layers.md
  • Cognitive Load Theory in Digital Reading (2022)
  • W3C Accessibility Guidelines for Epistemic Interfaces
  • Section 4: Semantic Navigation Architecture
📝 Contribution Notice
This document is maintained by the Platform Architecture team. Propose changes via the internal RFC tracker or submit pull requests to the aevum/docs repository.