Agent skill
help-system-architect
Design and generate the in-app help system: havainnepolku (visual guidance path) components, help mode (apua-tila), contextual help content, searchable help index, and FAQ/Q&A pairs. Use when (1) creating or updating help pages, (2) building the havainnepolku breadcrumb-path component, (3) implementing help mode overlay, (4) generating help search index, (5) adding contextual tips to pages, (6) brainstorming which guidance paths to create, (7) generating FAQ/Q&A pairs for any app, (8) populating the faq_items table, (9) building searchable help content with keywords. Triggers: "help system", "apua", "havainnepolku", "guidance path", "help mode", "apua-tila", "contextual help", "help content", "help search", "user guidance", "breadcrumb path", "ohje", "opaste", "FAQ", "Q&A", "kysymys", "vastaus", "usein kysytyt", "ukk", "faq items", "help page content".
Install this agent skill to your Project
npx add-skill https://github.com/Spectaculous-Code/raamattu-nyt/tree/main/.claude/skills/help-system-architect
SKILL.md
Help System Architect
Design and generate the in-app help system for Raamattu Nyt and IdeaMachina.
Authority
- Consumes
Docs/ai/core-user-model.jsonas the single source of truth for tasks and paths - NEVER redefines tasks or paths — only explains, guides, and contextualizes them
- The
core-ux-detectiveskill owns task/path definitions; this skill owns help presentation
Two Systems
1. Havainnepolku (Visual Guidance Path)
Interactive step-by-step navigation bar. See references/component-specs.md for specs.
Package: packages/help-guide/ with GuidancePath.tsx, HelpModeProvider.tsx, useHelpMode.ts, HelpTooltip.tsx, HelpSearchIndex.ts.
2. Database FAQ System (faq_items)
Database-driven Q&A pairs with search, per app. Already built:
| Component | Location |
|---|---|
| Table | public.faq_items — system_id, question_fi/en, answer_fi/en, category, keywords[] |
| Hook | src/hooks/useFaq.ts — useFaq() fetches by system_id + published |
| Display | src/components/feedback/FaqSection.tsx — accordion, grouped by category, search bar |
| Admin | /ohjaamo/faq — create/edit/delete, multi-language, publish toggle |
| Page | /ohjeet (HelpPage.tsx) renders <FaqSection /> |
Categories: general, account, billing, features, troubleshooting, privacy, audio, ai
Workflow
Choose scope from user request:
| Request | Action |
|---|---|
| "Generate FAQ" / "Q&A pairs" | → FAQ Generation workflow below |
| "Build help system" | → Full system (havainnepolku + FAQ) |
| "Havainnepolku only" | → GuidancePath component |
| "Help content" | → Help pages for specific tasks |
| "Search index" | → Keyword-to-task mapping |
FAQ Generation Workflow
See references/faq-generator.md for the complete FAQ generation guide including:
- Schema reference and insert patterns
- Feature discovery workflow (scan routes, pages, tabs)
- Category mapping templates
- Starter Q&A sets for Raamattu Nyt (31 pairs) and IdeaMachina (13 pairs)
- Keyword optimization for search
Quick steps:
- Discover — Scan app routes and pages to list features
- Categorize — Map features to FAQ categories
- Generate — Create Q&A pairs (2-4 per feature, fi + en)
- Keywords — Add 3-6 search keywords per pair (fi + en)
- Insert — SQL migration or direct
execute_sql - Verify — Count by
system_id+category, target 30-60 per app
Havainnepolku Workflow
- Read
Docs/ai/core-user-model.json(runcore-ux-detectiveif missing) - Generate GuidancePath data from
user_paths - Build components per references/component-specs.md
Help Content Generation
For each task/path, generate content in Finnish:
{
"task_id": "create_reel",
"title": "Reelsin luominen",
"what": "Luo kaunis kuvajae Raamatun jakeesta.",
"when": "Kun haluat jakaa jakeen someen kuvana.",
"steps": ["Valitse jae", "Paina 'Luo reels'", "Valitse tyyli", "Julkaise"]
}
Rules
- All user-facing text in Finnish (with English translations in
_enfields) - Calm, supportive, non-technical tone
- Short answers: 2-4 sentences max
- Keywords: include both Finnish and English terms
- FAQ search works via
question,answer, andkeywords[]fields - Help mode is non-blocking — user can always dismiss
- Components in
packages/help-guide/, FAQ data infaq_itemstable
Output Files
| File | Purpose |
|---|---|
packages/help-guide/src/*.tsx |
Shared havainnepolku components |
faq_items table |
Database-driven FAQ (via migration or MCP) |
apps/.../components/help/HelpPage.tsx |
Help page (already exists at /ohjeet) |
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
docs-updater
Expert assistant for keeping documentation synchronized with code changes in the KR92 Bible Voice project. Use when updating API docs, maintaining architecture diagrams, syncing README, updating CLAUDE.MD, or generating documentation from code.
ai-prompt-manager
Expert assistant for managing AI prompts, features, and configuration in the KR92 Bible Voice AI system. Use when creating AI prompts, configuring AI features, managing prompt versions, setting up AI bindings, or working with AI pricing and models.
performance-auditor
Expert assistant for monitoring and optimizing performance in the KR92 Bible Voice project. Use when analyzing query performance, optimizing database indexes, reviewing React Query caching, monitoring AI call costs, or identifying N+1 queries.
edge-function-generator
Expert assistant for creating and maintaining Supabase Edge Functions for the KR92 Bible Voice project. Use when creating Edge Functions, setting up CORS, integrating shared modules, adding JWT validation, or configuring environment variables.
admin-panel-builder
Expert assistant for creating and maintaining admin panel pages in the KR92 Bible Voice project. Use when creating admin pages, building admin components, integrating with admin navigation, or adding admin features.
lint-fixer
Expert assistant for analyzing and fixing linting and formatting issues in the KR92 Bible Voice project using Biome and TypeScript. Use when fixing lint errors, resolving TypeScript issues, applying code formatting, or reviewing code quality.
Didn't find tool you were looking for?