Inject guided onboarding flows into existing web or mobile apps.
npx skills add https://github.com/Swear4/agent_rules --skill tutorial-inject
Please help me install this Agent Skill. Skill: tutorial-inject Source: https://github.com/Swear4/agent_rules/tree/main/agent-universal/skills/tutorial-inject Command: npx skills add https://github.com/Swear4/agent_rules --skill tutorial-inject
Injecte un systeme de tutoriel/onboarding complet dans une application existante (web ou mobile). Utiliser quand l'utilisateur demande d'ajouter un tutoriel, un onboarding, une visite guidee, un product tour, ou des etapes guidees a son app. Compatible React/Vite, Next.js, React Native (Expo & CLI), Angular, Vue.
Démarrez l'injection en déclarant le flux principal et en activant l'injecteur sur la première page.
High-intent search queries and answers about installing and using this skill.
You can inject a complete onboarding system to add a guided product tour to your React application. This supports configurable 3 to 8 step flows with transitions and validations during execution directly in your existing app.
Yes, the onboarding injection supports Next.js and React Native, including Expo and CLI setups. It also works with React/Vite, Angular, and Vue, using MMKV persistence for React Native environments.
A guided tour injection system integrates configurable onboarding flows into an existing app. It works by declaring a main flow and activating an injector on the first page, providing deterministic flows and provider separation for product tours.
You can configure product onboarding flows with 3 to 8 steps. These guided tours support transitions and validations during execution to ensure users complete the necessary onboarding interactions.
Yes, the React Native onboarding flow supports MMKV persistence. This involves migrating from AsyncStorage to MMKV to maintain guided tour state and provide better performance for your onboarding steps.
A limitation when injecting onboarding flows into existing web apps is that it requires a SKILL.md frontmatter with a name and description. You must also follow specific architecture rules for provider separation and deterministic flows.
MudassarAbrarProvide design guidelines, palettes, typography, and UX patterns across nine technology stacks.
alejandro-technologyCreate persistent Zustand stores with MMKV for React Native global state.
daffy0208Build cross-platform mobile apps with React Native and Expo.
jiaiyanOrchestrate step-by-step UI tours in Vue applications with configurable props.
