
agentic ux design - relationship-centric interfaces
Design AI-first interfaces that build ongoing relationships through memory, trust evolution, and collaborative planning, not just isolated screen interactions
- Installs
- 3.3K
- Last 24h
- +14
- Trending rank
- #7131
- Security
- Not audited
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/bencium/bencium-marketplace --skill agentic-ux-design---relationship-centric-interfaces- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads agentic ux design - relationship-centric interfaces automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
SKILL.md
The instructions your agent reads when the skill is triggered.
Agentic UX Design - Relationship-Centric Interfaces
Overview
The paradigm shift from screen-centric to relationship-centric design.
Traditional UX optimizes individual screens and isolated interactions. Agentic UX designs for ongoing relationships where systems learn, remember, and evolve alongside users across sessions, devices, and contexts.
Core principle: Every interaction builds on learned preferences and user history. Systems don't just respond—they develop understanding that compounds over time.
Announce at start: "I'm using the Relationship Design skill to create an agentic, memory-aware interface that builds long-term relationships with users."
When to Use
Use this skill when:
- Designing AI-powered applications, chatbots, or agent systems
- Building interfaces with repeated user interactions over time
- Creating systems that should learn from user behavior
- Rethinking traditional dashboards or SaaS products for the AI era
- Users complain about "starting over" every session
- You need to measure relationship quality, not just conversion rates
- Designing for trust evolution from transparency to autonomy
- Building collaborative planning features (human + AI co-creation)
When NOT to use:
- Simple one-time transactions with no user accounts
- Static content websites with no personalization needs
- Systems where memory/learning creates privacy concerns
- Interfaces where consistency > adaptation (e.g., medical equipment)
The Five Pillars of Agentic UX
1. Memory Revolution: From Static Preferences to Contextual Intelligence
Old model: Store static preferences (theme: dark, language: EN)
New model: Maintain dynamic, evolving relationship models
Design for:
- Behavioral patterns: Not just "user clicked X" but "user spends 20 min frustrated searching for Y on Tuesday evenings"
- Emotional context: Recognize frustration, urgency, exploration, decision-making modes
- Temporal evolution: How preferences change over weeks/months
- Cross-session continuity: Seamless continuation across devices and time
Key question: What would this experience look like if it remembered everything and got better over time?
2. Trust as a Design Material: The Three-Stage Evolution
Design interfaces that earn autonomy through graduated trust:
Stage 1: Transparency Phase
- Show all reasoning, decision processes, confidence levels
- Explain why the system suggests actions
- Reveal data sources and logic paths
- User wants to see everything
Stage 2: Selective Disclosure Phase
- Show reasoning only for important/uncertain decisions
- Quiet confidence for routine actions
- System learns when to show work vs. act confidently
- User trusts but verifies
Stage 3: Autonomous Action Phase
- Act independently with subtle confirmation patterns
- Clear escalation paths for mistakes
- User delegates entire decision categories
- Trust through consistent, aligned behavior
Design patterns:
- Progressive disclosure controls (let users adjust transparency level)
- Confidence indicators (system certainty visualization)
- Trust recovery protocols (clear undo/correction paths)
- Explain-on-hover for autonomous actions
Key question: How might users develop trust with this system gradually?
3. Relationship-Centric Architecture
Design ongoing partnerships, not isolated transactions.
From: User logs in → completes task → logs out → system forgets
To: System maintains continuous awareness of:
- User's ongoing goals and projects
- Communication preferences and patterns
- Learning from what works for this individual
- Relationship depth over time
Implementation patterns:
- Memory visualization: Show what system remembers (preferences, goals, patterns)
- Context indicators: Subtle cues showing how past interactions influence current suggestions
- Forgetting controls: User agency over what gets remembered vs. forgotten
- Relationship timeline: Visual representation of how the relationship evolved
Key question: What goals are users really trying to achieve, and how could an agentic system help them get there more effectively?
4. Systems That Plan Their Own Path
From: Design every possible user path explicitly
To: Design goal-alignment mechanisms where system dynamically constructs paths
Agentic systems:
- Maintain awareness of underlying user objectives
- Adapt interaction patterns based on what works
- Learn from imperfect demonstrations and natural language feedback
- Construct custom workflows for individual users
Design for:
- Goal continuity: Persistent awareness of user objectives across sessions
- Proactive nudging: Gentle next-step suggestions without intrusion
- Collaborative planning: Human + AI jointly developing approaches
- Adaptive interfaces: UI elements that evolve based on usage patterns
Key question: Can the system help users achieve goals they haven't fully articulated yet?
5. New Success Metrics: Beyond Conversion Rates
Traditional UX metrics (session duration, conversion rates, clicks) miss the point for agentic experiences.
Measure instead:
Relationship Quality
- Trust scores and delegation comfort
- User confidence in system decisions
- How often users second-guess the system
- Comfort with autonomous actions
Compounding Value
- Experience improvement over time
- Increasingly complex problems solved
- Better outcomes through accumulated understanding
- Month 6 vs. Month 1 comparison
Context Accuracy
- System understanding of intent and preferences
- Alignment with user values and goals
- Situational needs recognition
- Prediction accuracy for important decisions
Democratic Alignment
- Alignment with broader human values
- Socially acceptable behavior boundaries
- Ethical decision-making
- Collective constitutional principles
Key question: How do we know if the relationship is getting better, not just more frequent?
The Relationship Design Process
Phase 1: Understand the Relationship Context
Ask these questions:
- Relationship duration: How long do users typically engage? (days, months, years?)
- Interaction frequency: Daily? Weekly? Sporadic?
- Goal complexity: Simple tasks or evolving, complex objectives?
- Trust requirements: What level of autonomy makes sense?
- Memory sensitivity: What should system remember vs. forget?
- Personalization depth: How much should experience adapt?
Phase 2: Map Trust Evolution
For your specific use case:
- Define transparency needs: What must always be explained?
- Identify routine actions: What can become autonomous over time?
- Design trust indicators: How will users see system confidence?
- Create recovery paths: What happens when system makes mistakes?
- Plan trust checkpoints: How do users adjust autonomy levels?
Phase 3: Design Memory Architecture
- Behavioral data: What patterns matter?
- Preference evolution: What changes over time?
- Context signals: What indicates user's current state/goal?
- Memory controls: How do users manage what's remembered?
- Cross-session continuity: How does system maintain context?
Phase 4: Build Collaborative Planning Patterns
- Goal capture: How does system learn user objectives?
- Proactive suggestions: When/how does system offer help?
- Co-creation interface: How do human + AI work together?
- Adaptive UI: What interface elements should evolve?
- Learning feedback: How do users correct system understanding?
Phase 5: Define Success Metrics
Choose 2-3 metrics from each category:
- Relationship Quality indicators
- Compounding Value measures
- Context Accuracy signals
- Democratic Alignment guardrails
Track these over weeks/months, not just sessions.
Design Patterns Library
Memory-Aware Interface Components
Contextual Timeline
- Show user's journey over time
- Highlight preference evolution
- Display key relationship moments
Emotional State Indicators
- Recognize frustration, urgency, exploration
- Adapt interface based on detected state
- Show system's understanding of context
Dynamic Suggestions Panel
- Based on current goal + historical patterns
- Confidence indicators for each suggestion
- Explain why these suggestions now
Trust-Building Components
Reasoning Display (Transparency Phase)
- Show decision logic
- Display confidence levels
- Reveal data sources
Confidence Meter
- Visual indicator of system certainty
- Hover to see reasoning
- Adjust autonomy based on confidence
Undo/Correct Patterns
- One-click correction of autonomous actions
- System learns from corrections
- Clear escalation paths
Collaborative Planning Components
Goal Dashboard
- Ongoing objectives visualization
- Progress indicators
- System suggestions for next steps
Planning Canvas
- Human + AI co-create plans
- System contributes capabilities
- User provides judgment and strategy
Preference Evolution Map
- Show how system's understanding improved
- User control over what's learned
- Forgetting controls
Common Mistakes
❌ Treating Memory Like Static Settings
Problem: Storing preferences as key-value pairs (theme: dark) instead of evolving patterns
Fix: Design dynamic models that understand behavioral patterns, temporal context, and evolution over time
❌ Binary Trust Model
Problem: System is either fully transparent or fully autonomous from day one
Fix: Design three-stage trust evolution with gradual autonomy and user-controlled trust levels
❌ Using Traditional UX Metrics
Problem: Measuring session duration and conversion rates for relationship-based systems
Fix: Track relationship quality, compounding value, context accuracy over weeks/months
❌ Forgetting Privacy Controls
Problem: System remembers everything with no user control
Fix: Build forgetting controls, memory visualization, and clear data retention policies
❌ Designing Screens Instead of Relationships
Problem: Focusing on pixel-perfect interfaces without relationship architecture
Fix: Start with relationship model, then design screens that support ongoing partnership
❌ No Trust Recovery Path
Problem: When system makes mistakes, users lose all trust permanently
Fix: Design clear correction paths, system learning from mistakes, and trust recovery protocols
Real-World Applications
See EXAMPLES.md for:
- EU B2B relationship cockpit (automotive service networks)
- Memory-aware content discovery (streaming services)
- Collaborative planning assistant (project management)
- Trust-evolving financial advisor
See REFERENCE.md for:
- Detailed research foundation (DeepMind, Anthropic, OpenAI)
- Technical implementation patterns
- Memory architecture designs
- Metrics implementation guides
See CHECKLIST.md for:
- Relationship UX audit checklist
- Memory & data contracts sprint guide
- Trust evolution design worksheet
Quick Reference
| Traditional UX | Agentic UX |
|---|---|
| Session duration | Relationship depth over months |
| Conversion rates | Trust scores and delegation comfort |
| Click-through rates | Compounding value (Month 6 vs Month 1) |
| Isolated screens | Continuous relationship context |
| Static preferences | Dynamic pattern evolution |
| One-size-fits-all | Individually adaptive interfaces |
| Explicit navigation | Goal-aligned path construction |
| Binary permissions | Graduated trust evolution |
Remember
- Design for relationships that span months, not sessions
- Trust evolves through three stages: Transparency → Selective → Autonomous
- Memory means understanding patterns, not storing static preferences
- Measure relationship quality, not just engagement metrics
- Systems should plan paths to goals, not just execute predefined flows
- User control over memory, trust levels, and autonomous actions is essential
- Privacy and forgetting are as important as memory and learning
The screens will always matter. But the relationships matter more.
FAQ
What does the agentic ux design - relationship-centric interfaces skill do?
Design AI-first interfaces that build ongoing relationships through memory, trust evolution, and collaborative planning, not just isolated screen interactions
How do I install agentic ux design - relationship-centric interfaces?
Run npx skills add https://github.com/bencium/bencium-marketplace --skill agentic-ux-design---relationship-centric-interfaces in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/agentic-ux-design---relationship-centric-interfaces/ (personal) or .claude/skills/agentic-ux-design---relationship-centric-interfaces/ (project).
Which AI agents can use agentic ux design - relationship-centric interfaces?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is agentic ux design - relationship-centric interfaces safe to install?
No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.
Who maintains agentic ux design - relationship-centric interfaces?
It is published by bencium in bencium/bencium-marketplace. It has 3,333 recorded installs.
More from bencium/bencium-marketplace
bencium-innovative-ux-designer
bencium/bencium-marketplace
Develop an independent visual language and turn the human-chosen direction into a production-ready graphic, brand, campaign, publication, web, or product system. Use when originality and differentiation matter enough to escape generic AI and Big Tech aesthetics. Guides a minimum-evidence start, ten isolated typography-led HTML design directions made only from type, color, and space, visual-first human judgement, explicit commitment, and concrete Round 2 production. Do not use for routine UI fixes, small components, or applying an existing design system.
bencium-impact-designer
bencium/bencium-marketplace
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics. Based on Anthropic's Frontend Designer Skill
bencium-controlled-ux-designer
bencium/bencium-marketplace
Expert UI/UX design guidance for unique, accessible interfaces. Use for visual decisions, colors, typography, layouts. Always ask before making design decisions. Use this skill when the user asks to build web components, pages, or applications.
design-audit
bencium/bencium-marketplace
Premium UI/UX design audit and refinement skill. Conducts systematic visual audits of existing apps and produces phased, implementation-ready design plans. Use this skill whenever the user asks to audit a UI, improve an app's visual design, make an interface feel more polished or premium, review design consistency, fix visual hierarchy, or refine spacing/typography/color. Also trigger when the user says "design review", "make it look better", "UI polish", "visual refinement", "design pass", "audit the design", or references making an app feel more professional. This skill is purely visual — it does not touch functionality, logic, or features. It elevates what exists.
ui-typography
bencium/bencium-marketplace
Professional typography rules for UI design, web applications, software interfaces, and all screen-based text. Enforces timeless typographic correctness that LLMs consistently get wrong: proper quote marks, dashes, spacing, hierarchy, and layout. ENFORCEMENT MODE: When generating ANY HTML, CSS, React, JSX, or UI code containing visible text, auto-apply every rule in this skill silently — do not ask, do not explain, just produce correct typography. AUDIT MODE: When reviewing or improving existing interfaces or legacy code, flag violations and provide fixes. Trigger on: any HTML/CSS/React artifact creation, "build a landing page", "create a component", "design a UI", "fix the typography", "make this look professional", "review this layout", web design, presentation design, dashboard creation, document generation, or any task producing visible text for humans. Even if the user doesn't mention typography, apply these rules whenever generating UI output.
human-architect-mindset
bencium/bencium-marketplace
Systematic architectural thinking for irreplaceable human capabilities - domain modeling, systems thinking, constraint navigation, and AI-aware problem decomposition. Use proactively when detecting architectural decisions, system design discussions, or multi-component planning.
Popular frontend & design skills
setup-matt-pocock-skills
mattpocock/skills
Configure this repo for the engineering skills: set up its issue tracker, triage label vocabulary, and domain doc layout. Run once before first use of the other engineering skills.
frontend-design
anthropics/skills
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
hyperframes-animation
heygen-com/hyperframes
All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.
prototype
mattpocock/skills
Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.
hyperframes-core
heygen-com/hyperframes
The HyperFrames composition contract — build one renderable project. Use for composition structure, the data- timing attributes, class="clip", tracks, sub-compositions, variables, framework-owned media playback, deterministic-render rules, and validation. Read before writing composition HTML.
vercel-react-best-practices
vercel-labs/agent-skills
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.