UX Patterns Guide
UI + UX Navigation And Wayfinding standard

Recently viewed

Provide a bounded, personal recently viewed list that records actual item views, orders them by recency, gives recognizable item context, and offers removal, clearing, privacy, and unavailable-item handling.

Open in lab Compare alternatives
Decision first

Choose this pattern when the problem matches

Use when

  • Users inspect multiple objects and often need to return to one they recently opened.
  • The product has enough items that re-finding the same object through browse or search costs meaningful effort.
  • The list can be scoped to the current user, account, workspace, session, or device in a way users can understand.
  • Viewed-item history is useful enough to justify the privacy and maintenance responsibilities.

Avoid when

  • The content set is tiny, linear, or easy to scan without history.
  • The surface is shared, public, signed out, or privacy-sensitive and cannot provide clear controls.
  • The team wants to promote products, recommend next actions, or show related content rather than return personal history.
  • Users need stable saved access, favorites, or bookmarks rather than automatic recency.
  • History data cannot be stored, refreshed, expired, or cleared reliably.

Problem it prevents

Users often need to return to a specific item they recently opened, but search, browser Back, and site hierarchy can make them reconstruct the path from memory.

Pattern anatomy

What a strong implementation has to make clear

User need

The product contains many comparable or revisitable objects such as records, documents, products, cases, media, or projects.

Pattern promise

Provide a bounded, personal recently viewed list that records actual item views, orders them by recency, gives recognizable item context, and offers removal, clearing, privacy, and unavailable-item handling.

Required state

Empty or hidden state before any qualifying item has been viewed.

Recovery path

Recent history becomes a surveillance surface on shared accounts or screen shares.

Access contract

Use a heading or labelled region that describes the scope of the list.

Quality bar

The difference between expert and weak execution

Strong implementation

Specific, visible, recoverable

  • A procurement dashboard shows Recently viewed records with title, record type, status, project, last-viewed time, and a remove control for each row.
  • A commerce product page shows a short Recently viewed rail of products the shopper opened, capped to six items and hidden until at least one product exists.
  • A user opens several supplier records, returns to the dashboard, and reopens the most recent record without reconstructing the search.
  • A shopper compares products across pages and can jump back to a previously viewed item without using browser Back repeatedly.
Weak implementation

Vague, hidden, hard to recover from

  • A homepage shows a Recently viewed carousel filled with promoted products the user never opened.
  • A shared kiosk displays sensitive applications from previous users with no clear or hide control.
  • Users trust a Recently viewed rail as a recommendation and choose an irrelevant item because sponsored content was mixed into history.
  • A user clears browser history but the product still displays old local recently viewed entries on a shared device.
UI guidance
  • Render a labelled list or rail of items the current user actually opened, ordered most recent first, with enough identity to recognize each item such as name, type, thumbnail or icon, location, status, and last-viewed time.
  • Include bounded history controls near the list: remove an item, clear the list, hide the section when empty, and disclose account or device sync scope when entries may appear across sessions.
UX guidance
  • Use recently viewed to reduce re-finding effort when users compare items, pause work, resume documents, or return to records they inspected during the current or recent sessions.
  • Treat viewing history as personal and potentially sensitive; keep it short-lived when the task does not need long memory, avoid showing it on shared or public surfaces, and never replace deliberate saved items or recommendations with it.
Implementation contract

What the implementation must handle

States

  • Empty or hidden state before any qualifying item has been viewed.
  • Populated state with most-recent-first ordering and recognizable item context.
  • Active or just-opened state showing which item was resumed from the list.
  • Remove-one state that deletes a single item from recent history without deleting the item itself.

Interaction

  • Opening an item from the list navigates to that exact item and moves it to the top of the recent list.
  • Viewing the same item again updates its recency instead of creating duplicates.
  • Removing a recent entry removes only the history reference, not the underlying item.
  • Clearing the list removes visible recent history for the defined scope and leaves saved items or favorites intact.

Accessibility

  • Use a heading or labelled region that describes the scope of the list.
  • Make item names and context available as text, not only thumbnails.
  • Do not rely on color alone to mark the current or just-opened item.
  • Ensure remove and clear controls have accessible names that mention history, such as Remove from recently viewed.

Review

  • What exact user action qualifies an item as viewed?
  • Can users recognize each recent item without reopening it?
  • What is the right count, lifetime, and account scope for this task?
  • What privacy harm occurs if this list appears on a shared device or screen share?
Interactive lab

Inspect the states before you copy the pattern

Resume a recently viewed item

Open items, check whether the newest one moves to the top, remove one entry, and clear the visible history.

Recently viewed
Interactive demo is ready

Launch the live UI/UX lab when you want to inspect states, keyboard behavior, and common failure modes.

State To Inspect

Empty or hidden state before any qualifying item has been viewed.

Keyboard / Access

Tab reaches each recent item and its remove control in a predictable order.

Avoid Generating

Filling recently viewed with recommendations, ads, popular items, or related content.
Evidence trail

Source-backed claims behind this guidance

Microsoft Office Recently Used Files

Microsoft Support - checked

Microsoft Office recent-files guidance distinguishes automatic recent lists from Favorites and includes removal, clearing, count, and sync behavior.

Android Developers Recents Screen

Google Android Developers - checked

Android Recents provides resume, remove, and least-recently-used limits for recently accessed tasks.

Adobe Commerce Recently Viewed Products

Adobe Experience League - checked

Adobe Commerce documents recently viewed product blocks with configurable counts, lifetimes, scope, and storage synchronization.

W3C Privacy Principles

W3C - checked

W3C privacy principles support making recognition expected and controllable and giving people ongoing control over uses of data about themselves.

Full agent/debug reference

Problem Context

  • The product contains many comparable or revisitable objects such as records, documents, products, cases, media, or projects.
  • Users commonly inspect several items before choosing, pausing, resuming, or comparing them.
  • Viewing history can reveal user intent, private work, shopping, health, finance, or shared-device activity.

Selection Rules

  • Choose recently viewed when the destination set should come from items the current user personally opened, not from editorial curation, hierarchy, popularity, or recommendation models.
  • Record only meaningful item views, not every hover, preview, scroll, or page refresh; update an existing item to the top instead of duplicating it.
  • Order items most recent first, cap the visible list, and expire entries according to the task's memory window.
  • Show enough context to identify the item before navigation, including type, status, location, last-viewed time, thumbnail, or owner when those details prevent mistakes.
  • Provide item removal and list clearing when recents are visible outside a private workspace, synced across devices, or likely to reveal sensitive behavior.
  • Separate recently viewed from Favorites, saved items, bookmarks, pinned items, related links, and recommendations because those imply different user intent.
  • Hide the section when no trustworthy recent items exist instead of filling it with popular or promoted content.
  • Handle unavailable, moved, deleted, permission-lost, or out-of-stock items with clear status and recovery rather than dead links.

Required States

  • Empty or hidden state before any qualifying item has been viewed.
  • Populated state with most-recent-first ordering and recognizable item context.
  • Active or just-opened state showing which item was resumed from the list.
  • Remove-one state that deletes a single item from recent history without deleting the item itself.
  • Clear-all state that empties recent history and explains the effect.
  • Unavailable-item state for deleted, moved, permission-lost, or out-of-stock entries.
  • Synced or account-scoped state when entries can appear across devices or sessions.

Interaction Contract

  • Opening an item from the list navigates to that exact item and moves it to the top of the recent list.
  • Viewing the same item again updates its recency instead of creating duplicates.
  • Removing a recent entry removes only the history reference, not the underlying item.
  • Clearing the list removes visible recent history for the defined scope and leaves saved items or favorites intact.
  • The component does not show items viewed by another user unless the account or shared-device scope is explicit.
  • The list is omitted when there is no valid recent history or when privacy settings disable history capture.

Implementation Checklist

  • Define the qualifying event that writes history, such as opening a detail page for a minimum time or completing a load.
  • Store a stable item ID with display metadata that can be refreshed, not only copied text that will become stale.
  • Deduplicate by item ID, move re-opened items to the top, and enforce a visible count or lifetime cap.
  • Label the section with the scope, such as Recently viewed in this workspace or Recently viewed on this device.
  • Provide remove and clear controls with copy that distinguishes history removal from item deletion.
  • Respect private browsing, signed-out, managed-device, consent, and account-sync settings.
  • Refresh or mark unavailable entries before navigation so stale links do not fail without explanation.
  • Keep the rail keyboard-accessible and avoid auto-advancing carousels that hide older recent items.

Common Generated-UI Mistakes

  • Filling recently viewed with recommendations, ads, popular items, or related content.
  • Showing sensitive history on shared screens, public kiosks, or signed-out experiences.
  • Making recent items permanent when users expect a short session memory.
  • Mixing automatic recents with saved, pinned, or favorite items.
  • Duplicating the same item every time it is opened.
  • Using browser click path as breadcrumbs or recently viewed as the only wayfinding tool.
  • Removing the underlying item when the user only meant to remove it from history.

Critique Questions

  • What exact user action qualifies an item as viewed?
  • Can users recognize each recent item without reopening it?
  • What is the right count, lifetime, and account scope for this task?
  • What privacy harm occurs if this list appears on a shared device or screen share?
  • How can users remove an unexpected item without deleting the item itself?
  • Is the team using recency to mask weak search, filters, saved items, or recommendations?
Accessibility
  • Use a heading or labelled region that describes the scope of the list.
  • Make item names and context available as text, not only thumbnails.
  • Do not rely on color alone to mark the current or just-opened item.
  • Ensure remove and clear controls have accessible names that mention history, such as Remove from recently viewed.
  • Announce list changes politely when an item is removed, restored, or the list becomes empty.
  • Avoid auto-rotating carousels; if horizontal scrolling is used, provide keyboard-operable controls and visible overflow cues.
Keyboard Behavior
  • Tab reaches each recent item and its remove control in a predictable order.
  • Enter or Space opens a focused recent item when it is implemented as a button; Enter activates links with normal link behavior.
  • Remove controls delete only the focused history entry and move focus to the next item or section heading.
  • Clear-all asks for confirmation when the scope is broad or synced, then returns focus to the empty-state message.
  • Horizontal rails support arrow buttons or scroll controls without trapping focus.
Variants
  • Recent files
  • Recently viewed products
  • Recently opened records
  • Continue where you left off
  • Recent tasks
  • Recent documents
  • Session recents
  • Account-synced recents

Verification

Last verified: