Menu
Personas, touchpoint mapping, phase models, onboarding, customer retention, and data-driven journey analysis for user-centered web design.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
WCAG conformance, BFSG compliance, semantic HTML, ARIA, keyboard navigation, contrast, forms, and assistive technologies. Defines binding rules for accessible web interfaces per WCAG 2.1 AA.
Design patterns for chat interfaces, agent UX, streaming UI, and tool visualization. Covers chat architecture, message types, streaming rendering, tool execution cards, and sandbox UI derived from 21st.dev Agents SDK documentation and templates.
AI tool integration into the design process, structured prompting for designers, creative AI usage with clear boundaries, and review workflows.
Brand strategy, visual identity, positioning, corporate design, portfolio presentation, and consistent brand management across all digital touchpoints.
Color models, palettes, contrast, color psychology, color harmonies, and dark mode for web projects. Defines the 60-30-10 rule, semantic color coding, design tokens, and WCAG contrast requirements.
Modern UI component selection, composition, and theming patterns for web applications. Covers compound components, design tokens, variant systems, responsive patterns, and form architecture derived from 21st.dev SDK, Godly featured products, and current best practices.
| name | customer-journey |
| description | Personas, touchpoint mapping, phase models, onboarding, customer retention, and data-driven journey analysis for user-centered web design. |
Every design decision begins with the user's needs, motivations, and questions — not with the company's internal organizational structure.
Use this skill when you:
Every design decision begins with the user, not with the internal structure.
Every point of contact generates emotions and influences the purchase decision. No touchpoint should be left to chance.
Users jump between phases, skip steps, and return. Designs must account for this non-linearity.
Personas and journey maps are based on research (analytics, interviews, surveys) — not on gut feeling.
Customer retention, referral, and win-back are integral components.
Each point of contact pursues exactly one primary call to action.
At project kickoff and before every relaunch. Horizontal axis = phases, vertical axis = touchpoints, emotions, channels, pain points, opportunities. Result: Visual artifact for shared understanding. See references/journey-map-template.md for details.
After purchase decision or registration: 1. Welcome message with a clear next step, 2. Step-by-step introduction (max. 3 steps), 3. First success within 60 seconds, 4. Follow-up after 24 hours and 7 days.
When the primary conversion is too far from first contact: Define 3–5 intermediate goals (newsletter, whitepaper, webinar) that progressively guide the user closer to the primary conversion.
For inactive existing customers: Trigger-based communication (e.g., 30 days of inactivity), personalized offer, easy re-entry, feedback request.
When personas are based on assumptions or are older than 6 months: 1. Translate hypotheses into an interview guide, 2. Conduct 5–8 interviews, 3. Cross-reference with analytics, 4. Update or discard the persona.
Before a relaunch or when conversions are declining: 1. Capture all touchpoints in a matrix, 2. Walk through and evaluate from the user's perspective, 3. Identify gaps, 4. Prioritize the top 3 optimizations.
The website structure mirrors the departmental structure instead of the customer journey. Users must understand the company's internal logic. Solution: Structure along user needs and journey phases.
Too many contact points at once, without priorities. Inconsistent brand experience. Solution: Better to have 5 excellent than 20 mediocre touchpoints.
All energy flows into acquisition; the customer experience after purchase is neglected. Solution: Allocate at least 30% of journey design effort to phases 5 and 6.
Generic personas from templates without project-specific data. Solution: Every persona needs at least 3 project-specific data points.
design-process — The customer journey informs the briefing and concept phaselanding-pages — Landing pages are central touchpoints in the journeywebsite-audit — Journey analysis is a core component of every relaunch auditux-design — UX design as the framework for user-centered journey designai-design-workflow — AI can accelerate persona development and touchpoint analysis