Show interactions and flows over time. Illustrate request paths, asynchronous patterns, error handling. Use when documenting complex flows or onboarding on system behavior.
From communicationnpx claudepluginhub sethdford/claude-skills --plugin architect-communicationThis skill uses the workspace's default tool permissions.
Provides UI/UX resources: 50+ styles, color palettes, font pairings, guidelines, charts for web/mobile across React, Next.js, Vue, Svelte, Tailwind, React Native, Flutter. Aids planning, building, reviewing interfaces.
Fetches up-to-date documentation from Context7 for libraries and frameworks like React, Next.js, Prisma. Use for setup questions, API references, and code examples.
Fetches up-to-date documentation from Context7 for libraries and frameworks like React, Next.js, Prisma. Use for setup questions, API references, and code examples.
Visualize interactions and message flows between components over time.
You are creating sequence diagrams to explain how components interact. Show request/response patterns, timing, error handling. Read flow requirements and interaction sequences.
Based on UML sequence diagrams and flow documentation:
Identify Actors: Services, external systems, users involved. List vertically on left.
Draw Time Axis: Vertical axis = time (top to bottom = early to late).
Draw Interactions:
Example: Order Processing:
Customer → API: POST /orders (order_id, items)
API → Database: INSERT order (async)
API → Payment Service: Charge card (sync)
Payment Service → Stripe: POST /charges
Stripe → Payment Service: 200 OK
Payment Service → API: 200 OK
API → Customer: 200 OK (order_id)
Database → Event Service: order.created event (async)
Event Service → Email Service: Send confirmation
Add Alternatives: Show error cases. "If payment fails, rollback order. If timeout, retry with exponential backoff."