Integration Patterns
Add healing properties to any project. Whether you're building from scratch or enhancing an existing codebase, these patterns help you weave wellness, mindfulness, and ethical design into apps, games, narratives, and any digital experience.
The Philosophy
Digital products shape human experience. Every error message, loading state, and interaction either adds stress or creates space for breath. Integration patterns help you choose healing.
Traditional Approach Healing Integration
───────────────────── ─────────────────────
"Error 500" → "Something unexpected happened.
Take a breath—we're on it."
[Loading spinner] → "Preparing your experience...
(A moment to settle)"
"Are you sure?" → "You're about to [action].
Take a moment if needed."
Available Patterns
UI Wellness
Effort: Low | Impact: High
Transform your visual layer with calming colors, comfortable typography, and breathing room. Works with any CSS framework.
- Healing color palette
- Comfortable spacing system
- Gentle animations
- Dark mode done right
Mindful Interactions
Effort: Medium | Impact: High
Add intentional pauses and awareness moments to high-stakes interactions.
- Breathing pauses before actions
- Mindful transitions
- Pacing controls
- Reflection moments
Gentle Errors
Effort: Low | Impact: Medium
Transform harsh error states into supportive recovery experiences.
- Compassionate messaging
- Actionable suggestions
- Recovery guidance
- Stress reduction
Accessibility Healing
Effort: Medium | Impact: High
Accessibility as an act of inclusion and healing. Go beyond compliance to genuine welcome.
- Screen reader excellence
- Keyboard navigation
- Cognitive accessibility
- Motion sensitivity
Ethical Data
Effort: Medium | Impact: High
Respectful data practices that build trust and honor user autonomy.
- Transparent collection
- Informed consent
- Easy deletion
- Minimal footprint
Breathing Spaces
Effort: Low | Impact: Medium
Strategic pauses that give users room to breathe during intense workflows.
- Work session breaks
- Decision pauses
- Transition moments
- Completion celebrations
Project Analysis
Effort: Low | Impact: High
AI-powered assessment to identify healing opportunities in any existing codebase.
- HEAL assessment framework
- Automated pattern detection
- Prioritized opportunity reports
- Implementation roadmaps
Healing Gamification
Effort: Medium | Impact: High
Non-manipulative engagement mechanics that support genuine wellbeing.
- Compassionate streaks with grace periods
- Meaningful achievements
- Progress visualization
- Social healing without competition
Narrative Healing
Effort: Medium | Impact: Very High
Therapeutic storytelling for interactive fiction, visual novels, and branching narratives.
- Content warning systems
- Meaningful choice architecture
- Emotional pacing control
- Safe spaces and post-experience integration
Game Healing
Effort: High | Impact: Very High
Comprehensive game design patterns for player wellbeing.
- Adaptive compassionate difficulty
- Restorative safe zones
- Breathing-synced mechanics
- Multiplayer healing and session boundaries
Quick Integration Matrix
| Your Project Type | Start With | Then Add |
|---|---|---|
| E-commerce | Gentle Errors | Breathing Spaces |
| Productivity | Breathing Spaces | Mindful Interactions |
| Developer Tools | Gentle Errors | UI Wellness |
| Social Media | Ethical Data | Healing Gamification |
| Healthcare | Accessibility | UI Wellness |
| Education | UI Wellness | Healing Gamification |
| Finance | Gentle Errors | Ethical Data |
| Video Games | Game Healing | Breathing Spaces |
| Interactive Fiction | Narrative Healing | Mindful Interactions |
| Mobile Apps | Project Analysis | UI Wellness |
| Existing Projects | Project Analysis | Gentle Errors |
Integration Components
Drop-in components for immediate healing integration:
import {
// Core integration
BreathePause, // Intentional pause before action
GentleError, // Compassionate error states
WellbeingCheck, // Periodic wellness check-ins
MindfulTransition, // Aware state changes
CalmLoading, // Peaceful loading states
// Gamification
HealingJourney, // Progress visualization with milestones
ProgressCelebration, // Mindful achievement recognition
// Narrative
NarrativeChoice, // Emotion-coded story choices
SafeSpace, // In-experience grounding refuge
} from '@/components/integration';
View Component Documentation →
Principles of Integration
1. Additive, Not Intrusive
Healing integration should enhance existing functionality, not obstruct it. Users can always proceed quickly if they choose.
2. Context-Appropriate
A meditation app and a stock trading app need different healing intensities. Match the approach to user expectations and context.
3. Measurably Beneficial
Track user satisfaction, task completion rates, and stress indicators. Good integration improves metrics.
4. Ethically Sound
Healing is not a dark pattern. Never use calming design to mask problems or manipulate decisions.
5. Incrementally Adoptable
Start with one pattern. Expand as you see results. Perfect integration that never ships helps no one.
Getting Started
For New Projects
- Choose - Pick patterns that match your project type from the matrix above
- Design - Incorporate healing principles from the start
- Implement - Use provided components and guidelines
- Measure - Track impact on user experience metrics
For Existing Projects
- Analyze - Run Project Analysis to identify opportunities
- Prioritize - Focus on high-impact, low-effort improvements first
- Implement - Start with Gentle Errors or Breathing Spaces
- Iterate - Add more patterns based on results
Swarm Assistance
Use healing swarm agents to accelerate integration:
# Analyze project for opportunities
claude -p "Analyze this React codebase for healing integration
opportunities. Prioritize by impact and effort."
# Generate pattern implementation
claude -p "Implement the Gentle Errors pattern for this Express.js
API. Include client-side components and server responses."
# Review existing integration
claude -p "Review the healing integration in this project.
Check for consistency, accessibility, and ethical alignment."
"The goal isn't to make every app a wellness app—it's to ensure no app makes things worse."