Skip to main content
skill CX Codex

serial-position-effect — Claude Code skill: ordering menus, lists

A skill that applies the serial position effect: it tells the agent which items belong first and last, and what lands in the memory valley.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓
npx skills add Owl-Listener/designer-skills --skill serial-position-effect -a claude-code
Open on GitHub

What serial-position-effect does

The skill hands your agent a set of rules for ordering sequences. People recall the start of a list (primacy) and its end (recency) best, while the middle fades — the predictable dead zone the skill calls the serial position valley. Ask it to reorder a nav bar, onboarding steps or a pricing list, and it maps items onto those zones.

Inside is a model instruction covering navigation, curated lists, wizard flows and notification stacks. Critical actions go first, account and logout go last, and required-but-tedious steps — permissions, legal agreements, form fields — get buried in the middle. When an important item has to stay put, the skill reaches for visual distinction: weight, color, icon or size.

One thing to know: this is about position, not about making a single item stand out wherever it sits. The same repository ships von-restorff-effect for that. Install runs through npx skills add, so you need Node.js with npx available.

What it helps with

  • map navigation items onto the zones users actually recall
  • reorder onboarding steps so the key value moment opens or closes the flow
  • push required but tedious steps into the middle of a wizard
  • check the order of pricing tiers and the default-selected option
  • find middle items in a long menu that drop out of recall

Example prompts for the agent

  • reorder the main menu using the serial position effect
  • check my onboarding step order: what's first, what's last, what's stuck in the middle
  • look at this pricing list and tell me which items fall into the middle valley

How to install serial-position-effect

1Skills CLI (Vercel)

npx skills add Owl-Listener/designer-skills --skill serial-position-effect -a claude-code

2Manually: put the files in place

~/.claude/skills/serial-position-effect/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/serial-position-effect/

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about serial-position-effect

How do I install serial-position-effect in Claude?

Run npx skills add Owl-Listener/designer-skills --skill serial-position-effect -a claude-code. The skill lands at ~/.claude/skills/serial-position-effect/SKILL.md.

What does serial-position-effect do?

It guides the agent in ordering menus, lists and steps so important items sit at the beginning or the end instead of the middle, which people recall least.

How is serial-position-effect different from von-restorff-effect?

The first works with an item's position in a sequence; the second makes one item visually distinct regardless of where it sits. Use von-restorff-effect when you need that emphasis.

Source text

SKILL.md · MIT
---
name: serial-position-effect
description: Apply the Serial Position Effect — first and last items in a sequence are recalled best. Use when ordering menus, lists, and steps. For emphasising one item regardless of its position, use `von-restorff-effect` (ui-design).
---
# Serial Position Effect

You are an expert in memory and attention as they apply to list design and content sequencing.

## What You Do

You apply the Serial Position Effect to ensure critical items in lists, menus, and sequences occupy the positions users are most likely to notice and recall — and to compensate with visual distinction where important items must sit in the middle.

## The Principle

When people encounter a sequence of items, they tend to remember:
- **Items at the beginning** (primacy effect) — encoded into long-term memory during the time spent processing the rest of the list
- **Items at the end** (recency effect) — still held in short-term memory when recall occurs
- **Items in the middle** — remembered least; both attention and encoding dip here

This is the Serial Position Effect, established through Hermann Ebbinghaus's memory research and extended through subsequent cognitive psychology. The "serial position valley" is the predictable dead zone in the middle of any sequence.

## Design Applications

### Navigation and menus

Place critical navigation items at the start or the end, never buried in the middle:
- Global actions (home, dashboard, primary content) → first position
- Account, settings, logout → last position (convention also reinforces this)
- Avoid placing critical items in positions 3–5 of a 7-item menu — this is the serial position valley

### Lists and curated content

In any ordered list where some items matter more than others:
- Put the strongest choices first and last
- A default-selected option or featured pricing tier should be first or last, never in the middle
- In a three-item set, the middle item is the comparison anchor; the items you want recalled are the outer two

### Onboarding and wizard flows

The first step establishes the mental model; the last step is remembered as the conclusion:
- Place key value moments (the first aha, the primary benefit demonstration) at the opening or the close
- Bury required-but-tedious steps — permissions, legal agreements, form fields — in the middle
- The last step should always be resolution and confirmation, not another administrative requirement

### Notification stacks and task lists

- Notifications: the most recent (recency effect) and the oldest persistent (primacy effect from scrolling) receive the most attention; middle notifications drop out
- Task lists: items at the top and bottom get completed first; middle items stall — either surface them deliberately or restructure the list

## Relationship to Other Principles

| Principle | Relationship |
|---|---|
| Peak-End Rule | Both explain why the end of an experience is over-weighted; they reinforce each other at the close of any sequence |
| Miller's Law / chunking | Chunking reduces the effective sequence length; fewer chunks means a smaller middle zone |
| Von Restorff Effect | Visual distinctiveness can rescue a middle-positioned item; it escapes the memory valley through differentiation |

## Best Practices

- Audit navigation and list order by mapping item criticality against position — high-criticality items should not be in the middle
- When an important item cannot be moved, use visual distinction (weight, color, icon, size) to help it escape the serial position valley
- For ordered instructions, repeat critical items from earlier in the sequence at the end as a summary — exploit both primacy and recency
- Never place the primary call to action in the middle of a set of three — first or last
- Test list recall in user studies by asking users to describe what options they saw; middle items will consistently drop out of recall, revealing the valley

© Owl-Listener · MIT · Owl-Listener/designer-skills

Similar skills

Everything for Design →

From the same set111

conversational-ux Designs voice interfaces and chat dialogs: prompt structure and error reprompt ladders. Ideal when speech or chat replaces screens. CX Codex +1 1,100installs law-of-closure Teaches the agent to build UI on implied boundaries: drop redundant borders, draw icons from minimal cues, and let negative space carry the structure. CX Codex +1 1,100installs law-of-figure-ground A skill that sorts out which layer of an interface reads as foreground and which as background, and helps you set that relationship on purpose. CX Codex +1 1,100installs law-of-similarity Applies the Gestalt Law of Similarity to group UI elements across distance using shared color, shape, and size. Useful for unifying components without altering layout. CX Codex +1 1,100installs teslers-law Applies Tesler's Law to help you balance complexity between the interface and the user. Useful when designing forms, multi-step flows, and settings. CX Codex +1 1,000installs zeigarnik-effect A skill for designing progress bars, saved drafts and reminders about unfinished steps. It gives the agent a framework for using incompleteness as a motivational signal. CX Codex +1 1,000installs peak-end-rule A skill that finds the two moments users actually remember — the most intense one and the last — and helps you design them on purpose. CX Codex +1 1,000installs jakobs-law Applies Jakob's Law to evaluate whether breaking familiar UI conventions is worth the cognitive cost. Useful when redesigning navigation or core controls. CX Codex +1 1,100installs

Project sponsors

Companies that keep this analytics open
Gold sponsor

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor