Attention Gradient Following¶
Attention gradient cue — instantiates Gestalt Continuation and Grouping Activation
Builds a smooth gradient of visual weight so attention slides from the most prominent element down to the least in a predictable order, without a drawn path.
Attention Gradient Following orders where the eye goes by ranking elements on a smooth gradient of visual weight — contrast, size, brightness, saturation — so attention lands first on the heaviest element and slides down the ramp to the lightest. Its defining move is that the sequence is carried by relative salience, not by a route: there is no line to trace, no aligned path; the eye simply visits the strongest thing, then the next-strongest[1], because low-level vision is drawn to whatever stands out most from its surroundings. Where a routed path says "follow this stroke from here to there," a gradient says "start with the loud one and work toward the quiet ones." The mechanism's craft is tuning the steepness and monotonicity of that weight ramp so the intended first-second-third order is unambiguous.
Example¶
A software company is designing a product landing page and finds that visitors' eyes scatter — some read the fine print first, some never see the sign-up button. The designer rebuilds the page as a single descending weight gradient. The headline is largest and highest-contrast (the heaviest element, where the eye lands); the one-line value proposition below is a step lighter; the sign-up button is a saturated block that reclaims weight to mark the destination of the ramp; and the supporting details, testimonials, and legal text fade progressively grayer and smaller toward the bottom. To reinforce the landing point, the sign-up button gives a single gentle pulse when the page loads — a one-shot micro-cue that re-peaks its salience without pulling the whole layout into motion. A visitor's eye now reliably hits headline, then value line, then button, in that order, not because any line connects them but because each is exactly as prominent as its place in the intended order demands. Flatten the gradient — make everything equally bold — and the order collapses back into a scatter.
How it works¶
- Rank the intended order. List the elements in the sequence attention should visit, first to last.
- Map order onto weight. Assign each element a visual weight — via contrast, size, or brightness — that decreases monotonically down the ranking, so the heaviest is seen first and there are no reversals.
- Reclaim weight at key stops. Where a late element still must be noticed (a call to action), give it back enough salience to re-peak locally without breaking the overall descent.
- Reinforce, don't animate the field. A single restrained micro-pulse can re-mark the primary target on load; sustained or spreading motion would turn this into a different, motion-based mechanism.
Tuning parameters¶
- Gradient steepness — how sharply visual weight drops from one element to the next. A steep ramp makes the order obvious but can bury lower elements; a shallow ramp keeps everything legible but weakens the ordering.
- Weight channel — whether prominence is carried by size, contrast, brightness, or saturation. Size and contrast are the strongest and most robust; color saturation is powerful but accessibility-fragile.
- Monotonicity discipline — how strictly weight only ever decreases down the ranking. Perfect monotonicity gives a clean order; a single out-of-place heavy element creates a competing peak that hijacks the eye.
- Micro-cue intensity — how strong and how brief the reinforcing pulse on the primary target is. A subtle one-shot draws the eye without nausea; anything looping or large reads as an animation and distracts.
When it helps, and when it misleads¶
Its strength is imposing a reliable viewing order on a field that has no natural path — a page, a poster, a dashboard hero — using nothing but relative prominence, which survives resizing and reflow far better than a drawn route. It is the fast way to make sure the important thing is seen first.
Its failure mode is that a salience gradient is coarse: it reliably delivers first, second, and third but says nothing about the fine relationships among elements, and if two elements end up near the same weight the order between them becomes a coin toss. The classic misuse is weaponizing prominence to bury unfavorable information — making the price or the cancellation terms the lightest, grayest element so the gradient carries the eye right past it (a dark-pattern move). The guarding discipline is to set weight to match genuine importance rather than what you wish the viewer would skip, keep the ramp strictly monotonic so the order is honest, and never let the least-weighted element be something the viewer actually needs.
How it implements the components¶
Attention Gradient Following fills the salience-ordering components of the archetype:
figure_ground_contrast— it is the mechanism's engine: each element's contrast against the ground sets its rank on the weight gradient, so contrast here ranks prominence rather than making an illusory whole.microanimation_or_state_transition_hint— a single restrained pulse on the primary target re-peaks its salience to mark the top of the ramp on load.accessibility_alternate_path— it provides a linear reading order (source order, headings) so the intended sequence survives for viewers who do not perceive the visual weight gradient.
It does NOT implement continuation_cue_map or start_anchor_and_destination — laying an explicit continuous route with a defined entry and endpoint is good_continuation_routing; this mechanism orders by prominence and never draws a path.
Related¶
- Instantiates: Gestalt Continuation and Grouping Activation — supplies the salience ordering that moves attention through the archetype's hierarchy.
- Sibling mechanisms: good_continuation_routing · implied_motion_from_orientation · closure_based_completion · grouping_by_shared_cue · rhythmic_scan_cadence · false_continuation_interruption
Editorial Notes¶
Form Classification¶
Form family: Interface, Display & Cue
Rationale: Builds a smooth gradient of visual weight so attention slides from the most prominent element down to the least in a predictable order, without a drawn path, making its operative form a user-facing perceptual surface, prompt, label, or affordance that shapes attention or action.
Independent corroboration: The frozen evidence defines Attention Gradient Following as 'Builds a smooth gradient of visual weight so attention slides from the most prominent element down to the least in a predictable order, without a drawn path', so its operative form is Interface, Display & Cue.
Review outcome: Independent reviewer agreement; high confidence.
Origin Attribution¶
Primary origin: Art & Aesthetics
Origin pattern: Convergent development
Present-day reach: Multi-domain
Rationale: Visual composition uses graduated contrast, scale, color, and detail to establish a hierarchy of attention.
Related originating lineages:
- Human-Computer Interaction — Interface hierarchy applies these cues to guide scanning and action.
- Psychology — Gestalt and perceptual-attention research explain grouping and salience gradients.
Review resolution: Art and aesthetics are the agreed primary lineage, with HCI visual hierarchy and psychology of salience independently contributing. The mechanism generalizes established attention-guidance practices rather than inventing a new lineage, so synthesis is false.
Review outcome: Reconciled after independent review; high confidence.
References¶
[1] Itti, L., Koch, C., & Niebur, E. "A Model of Saliency-Based Visual Attention for Rapid Scene Analysis". IEEE Transactions on Pattern Analysis and Machine Intelligence 20(11), 1254–1259 (1998). Models bottom-up attention as successive selection of locations in decreasing saliency based on local contrast against their surroundings. registry ↩