Why “Show More” Buttons Increase Engagement Instead of Decreasing It
By: Jeremy (TPM discovering that hiding content makes it more valuable)
Here’s a counterintuitive discovery from building VoiceCatcher: Showing users they can access more content actually makes interfaces feel cleaner and increases engagement, rather than decreasing it.
When we implemented expandable text for long transcripts, I expected some users to be frustrated by the extra click required to see full content. Instead, we saw a 40% increase in history window usage and users reading significantly more transcript content than when everything was visible by default.
This is the story of how progressive disclosure became our most effective engagement strategy, and why the psychology of controlled information access drives better user experiences than information abundance.
The Setup: When Complete Information Overwhelms
Context: Our history window initially showed full transcripts for all sessions. For short recordings, this worked perfectly. For hour-long transcripts with thousands of words, the interface became an unreadable wall of text that made finding specific content nearly impossible.
The problem wasn’t just visual—it was cognitive. Users would scan the first few items, get overwhelmed by the density, and close the history window without finding what they needed.
The insight: Complete information access can paradoxically reduce information consumption when cognitive processing becomes the limiting factor.
The Problem: Information Abundance vs. Information Value
The Cognitive Load Paradox
Traditional thinking: More visible information = more valuable interface. Reality: More visible information = higher cognitive load = less information processing.
The Scanning Behavior Research
Observing user behavior with full-content display:
- Average time in history window: 12 seconds
- Items examined: 2-3 sessions on average
- Content engagement: Users rarely read past first paragraph of any transcript
- Task completion: 30% of users found their target content
The pattern: When everything is visible, nothing gets focused attention.
The Paradox of Choice in Content Display
Just as too many options can reduce decision-making, too much visible content can reduce content engagement. Users need cognitive structure to process information effectively.
The Solution: Strategic Information Architecture
The Progressive Disclosure Framework
Instead of hiding information, we created controlled information revelation:
- Preview tier: Essential information for scanning and selection
- Detail tier: Full content available on demand
- Context tier: Additional metadata and actions when needed
The Implementation Strategy
interface ContentTier {
level: 'preview' | 'detail' | 'context';
cognitiveLoad: 'low' | 'medium' | 'high';
userIntent: 'scanning' | 'reading' | 'acting';
}
const ProgressiveContent: React.FC<{content: TranscriptContent}> = ({ content }) => {
const [expanded, setExpanded] = useState(false);
const [showActions, setShowActions] = useState(false);
return (
<div className="progressive-content">
{/* Preview Tier - Always Visible */}
<div className="content-preview">
<div className="metadata">
<span className="timestamp">{content.timestamp}</span>
<span className="duration">{content.duration}</span>
</div>
<div className="transcript-preview" onClick={() => setExpanded(true)}>
{content.preview}
{content.hasMore && <span className="expansion-cue">... Show more</span>}
</div>
</div>
{/* Detail Tier - On Demand */}
{expanded && (
<div className="content-detail">
<div className="full-transcript">{content.fullText}</div>
<button onClick={() => setExpanded(false)}>Show less</button>
</div>
)}
{/* Context Tier - Secondary Actions */}
{showActions && (
<div className="content-actions">
<button>Copy</button>
<button>Export</button>
<button>Delete</button>
</div>
)}
</div>
);
};The Psychology Strategy
Progressive disclosure leverages three cognitive principles:
- Curiosity Gap: Showing partial information creates desire to see more
- Cognitive Ease: Reduced visual complexity increases processing comfort
- Agency: User-controlled revelation increases perceived value
The TPM Framework: Psychology-Driven Interface Design
1. Map Cognitive Load to User Intent
Different user goals require different information densities.
The Cognitive Mapping Prompt:
For users trying to [specific task] in [interface context]:
1. What's the minimum information needed for task initiation?
2. What additional information is needed for task completion?
3. What information is helpful but not essential?
4. How does cognitive load change as users progress through the task?
5. What are the decision points where users need more information?
Design information revelation that matches cognitive capacity to task complexity.2. Design for Curiosity, Not Completion
Progressive disclosure should create desire to engage deeper, not frustration at hidden content.
The Engagement Design Prompt:
Create progressive disclosure that:
1. Makes previews genuinely valuable for decision-making
2. Creates curiosity about hidden content without being deceptive
3. Makes expansion feel like a natural next step, not a barrier
4. Provides clear value immediately upon expansion
5. Enables easy return to scanning mode
Include transition animations and interaction feedback that reinforce positive progression.3. Measure Engagement Depth, Not Just Exposure
Track how progressive disclosure affects actual content consumption and task completion.
The Engagement Measurement Prompt:
Design measurement system for progressive disclosure:
1. Content scanning patterns (preview engagement time)
2. Expansion rates (percentage of users who expand content)
3. Deep engagement (time spent with expanded content)
4. Task completion rates (finding target information)
5. Return behavior (coming back to previously expanded content)
Include A/B testing framework to compare disclosure strategies.The Business Impact: When Less Visible Content Drives More Engagement
Before: Full Content Display
- High cognitive load → Quick interface abandonment
- Wall of text → Poor content scanability
- No content prioritization → Random content engagement
- User confusion → Low task completion rates
After: Progressive Disclosure System
- Controlled cognitive load → Extended interface usage
- Structured content preview → Effective content discovery
- Clear content hierarchy → Targeted content engagement
- Intuitive progression → High task completion rates
The Engagement Metrics
- History window session duration: +180% (12 seconds → 34 seconds average)
- Content items examined: +250% (2-3 → 7-8 items average)
- Deep content engagement: +420% (expanded content reading)
- Task completion rate: +90% (30% → 57% finding target content)
Advanced: The Neuroscience of Controlled Information Access
The Curiosity Gap Effect
Research finding: Partial information creates stronger engagement than complete information.
VoiceCatcher application: 3-line previews with “Show more” generated 40% more expansion than 5-line previews with “Show more,” because the shorter preview created a larger curiosity gap.
Cognitive Ease and Processing Fluency
Research finding: Interfaces that feel easier to process are perceived as more valuable.
Implementation: Progressive disclosure reduces visual complexity, making the interface feel more manageable even when containing the same total information.
The Endowment Effect in Information Architecture
Research finding: Information users must “work” to access (through expansion) is perceived as more valuable than freely visible information.
Measurement: Users spent 60% more time reading expanded content than the same content when displayed by default.
Common TPM Progressive Disclosure Mistakes (That I Made)
Mistake 1: Hiding Essential Information
Wrong approach: Put critical decision-making information behind expansion. User frustration: Users couldn’t evaluate content without expanding everything.
Fix: Ensure previews contain everything needed for informed decision-making.
Mistake 2: No Expansion Value
Wrong approach: Expansion only revealed marginally more information. User disappointment: Users felt misled by expansion promise.
Fix: Ensure expanded content provides significant additional value over preview.
Mistake 3: Unclear Expansion Cues
Wrong approach: Subtle indicators that expansion was possible. User behavior: Users didn’t discover expandable content.
Fix: Clear, inviting expansion cues that communicate value of hidden content.
Mistake 4: No Return Path
Wrong approach: Made expansion easy but collapse difficult. User frustration: Interface became cluttered with expanded content.
Fix: Equally prominent and intuitive collapse mechanism.
The Technical Implementation: Psychology-Informed Disclosure
Smart Preview Generation
const generatePreview = (content: string, intent: 'scanning' | 'searching'): Preview => {
if (intent === 'searching') {
// For search, show context around search terms
return extractSearchContext(content);
} else {
// For scanning, show beginning with intelligent truncation
return extractScanningPreview(content);
}
};
const extractScanningPreview = (content: string): Preview => {
const sentences = content.split(/[.!?]+/);
let preview = '';
let wordCount = 0;
for (const sentence of sentences) {
if (wordCount + sentence.split(' ').length > 50) break;
preview += sentence + '. ';
wordCount += sentence.split(' ').length;
}
return {
text: preview.trim(),
hasMore: content.length > preview.length,
valueTeaser: generateValueTeaser(content.slice(preview.length)),
};
};Expansion Behavior Analytics
const trackProgressiveDisclosure = (
contentId: string,
action: 'preview' | 'expand' | 'collapse'
) => {
analytics.track('progressive_disclosure', {
contentId,
action,
contentLength: getContentLength(contentId),
timeFromPageLoad: Date.now() - pageLoadTime,
previousActions: getUserActionHistory(),
userSegment: getCurrentUserSegment(),
});
};Curiosity-Driven Teaser Generation
const generateValueTeaser = (hiddenContent: string): string => {
const insights = extractInsights(hiddenContent);
if (insights.length > 0) {
return `Includes ${insights.length} key insights`;
}
const actionItems = extractActionItems(hiddenContent);
if (actionItems.length > 0) {
return `Contains ${actionItems.length} action items`;
}
return `${Math.round(hiddenContent.split(' ').length / 100)} more minutes of content`;
};The Psychology Deep Dive: Why Progressive Disclosure Works
The Zeigarnik Effect
Principle: People remember incomplete or interrupted tasks better than completed ones. Application: Partially visible content creates mental tension that drives engagement.
VoiceCatcher example: Users were 3x more likely to return to sessions with unexpanded content than sessions they’d fully read.
The Paradox of Choice Mitigation
Principle: Too many options reduce decision quality and satisfaction. Application: Progressive disclosure reduces apparent complexity while maintaining information access.
Measurement: User task completion rates increased when we moved from “show everything” to “show essentials + progressive revelation.”
Cognitive Load Theory
Principle: Learning and engagement are optimized when cognitive load matches cognitive capacity. Application: Progressive disclosure lets users control their cognitive load based on their current capacity and goals.
Advanced: The Business Strategy of Controlled Engagement
Progressive Disclosure as Conversion Funnel
const disclosureFunnel = {
preview: {
goal: 'Attract attention and communicate value',
metrics: ['view time', 'click-through to expansion'],
optimization: 'Compelling preview that creates curiosity',
},
expansion: {
goal: 'Deliver promised value and deepen engagement',
metrics: ['expansion rate', 'time with expanded content'],
optimization: 'High-value content that exceeds preview expectations',
},
action: {
goal: 'Convert engagement into product usage',
metrics: ['action completion', 'return behavior'],
optimization: 'Clear next steps and easy action access',
},
};Content Hierarchy as Product Strategy
Framework: Use progressive disclosure to guide users toward high-value actions.
Implementation: Place most important content/actions in preview tier, supporting details in expansion tier, and secondary options in context tier.
Engagement Depth Measurement
const measureEngagementDepth = (userSession: UserSession) => {
const depth = {
surface: userSession.previewInteractions,
medium: userSession.expansionInteractions,
deep: userSession.actionCompletions,
};
return {
engagementScore: calculateEngagementScore(depth),
conversionProbability: predictConversion(depth),
recommendedOptimizations: suggestOptimizations(depth),
};
};The Prompts That Enable Psychology-Driven Disclosure
Cognitive Load Optimization Prompt
I have content that varies from [short] to [long] complexity.
Design progressive disclosure that:
1. Matches cognitive load to user intent and capacity
2. Creates engagement through controlled information revelation
3. Provides immediate value at each disclosure level
4. Enables user control over information depth
5. Optimizes for both scanning and deep engagement tasks
Include psychological principles and measurement strategies.Curiosity-Driven Interface Prompt
Create progressive disclosure that leverages curiosity psychology:
1. Preview content that creates genuine curiosity gaps
2. Expansion that delivers more value than promised
3. Visual cues that communicate hidden value without deception
4. Interaction patterns that feel rewarding rather than obstructive
5. Return mechanisms that maintain interface cleanliness
Include specific techniques for generating curiosity without frustration.Engagement Funnel Design Prompt
Design progressive disclosure as user engagement funnel:
- Preview tier: attract and qualify user interest
- Detail tier: deliver value and deepen engagement
- Action tier: convert engagement to product usage
For each tier, define success metrics, optimization strategies, and psychological triggers that drive progression to the next level.Lessons Learned: Information Architecture as Engagement Strategy
Less Visible Content Can Drive More Consumption
When information is structured for progressive consumption rather than complete exposure, users engage more deeply with the content they choose to explore.
Counterintuitive finding: Users read 60% more total content with progressive disclosure than with full content display, because they could effectively navigate to relevant content.
User Control Increases Perceived Value
Content that users choose to reveal feels more valuable than content that’s automatically visible.
VoiceCatcher example: The same transcript content received 40% higher “usefulness” ratings when accessed through expansion than when displayed by default.
Cognitive Ease Drives Interface Preference
Users prefer interfaces that feel manageable over interfaces that provide more immediate information access.
User feedback: “The history window feels much more organized now” (referring to progressive disclosure implementation).
Advanced: The Future of Progressive Content Strategy
Adaptive Disclosure Based on User Behavior
const adaptiveDisclosure = {
newUser: 'More guidance, smaller information chunks',
powerUser: 'Less guidance, larger information chunks',
searchMode: 'Context-focused disclosure around search terms',
browsingMode: 'Chronological progressive disclosure',
};Progressive Disclosure in Conversational Interfaces
Principle: Apply progressive disclosure to AI/chatbot interactions—provide essential response first, with option to expand for details, examples, or alternative approaches.
Multi-Modal Progressive Disclosure
Future application: Combine visual, audio, and interactive progressive disclosure for complex content like voice transcripts with multiple speakers, topics, or action items.
The Meta-Lesson: Psychology-Informed Product Design
The biggest insight from VoiceCatcher’s progressive disclosure implementation: User psychology often contradicts developer intuition about information access and interface value.
Progressive disclosure isn’t just about managing screen space—it’s about:
- Optimizing cognitive load for user goals and capacity
- Creating engagement through controlled revelation
- Increasing perceived value through user agency
- Enabling effective content navigation at scale
The framework: Design interfaces that match human information processing patterns, not computer information storage patterns.
Practical Implementation for TPMs
Start with Cognitive Load Analysis
Before designing any content display, understand the cognitive demands of different user tasks and goals.
Test User Psychology, Not Just Usability
Measure engagement depth and content value perception, not just task completion time.
Design for Curiosity and Agency
Create interfaces that make users want to explore deeper, while giving them control over their exploration.
Measure Engagement Quality Over Quantity
Track how much value users extract from content, not just how much content they access.
The Bottom Line
Progressive disclosure isn’t about hiding information—it’s about optimizing human information processing to increase engagement and value extraction.
VoiceCatcher’s progressive disclosure system transformed our history window from an overwhelming content dump into an engaging exploration interface. Users didn’t just access more content—they found more value in the content they accessed.
As TPMs, we need to recognize that information architecture is psychology architecture. The way we structure information access shapes user behavior, engagement patterns, and perceived product value.
The “Show more” button became one of our most effective engagement tools not despite requiring an extra click, but because it gave users control over their cognitive load and created curiosity about hidden value.
That’s the power of designing with human psychology rather than against it.
Jeremy is a technical product manager turned solo developer, building VoiceCatcher as a local-first voice transcription tool. Follow the journey at [project repo] or connect on [social links].
Next in this series: “Technical Debt as Product Strategy: When to Fix vs. Ship” - How we used the three-attempt rule to decide which technical improvements would drive user value vs. which were just engineering preference, and the business framework for technical debt prioritization.