create-step-json

Name: create-step-json
Availability: InStock
Author: Rocapine

Generate ComposableScreen step JSON with UIElement trees and explicit step IDs.

2|1|Updated Sep 30, 2025

Search Tags:#onboarding #generate #payload #step-json #composable-screen #design-profile

Ready to run

npx skills add https://github.com/Rocapine/react-native-onboarding --skill create-step-json

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: create-step-json
Source: https://github.com/Rocapine/react-native-onboarding/tree/main/claude-plugin/skills/create-step-json
Command: npx skills add https://github.com/Rocapine/react-native-onboarding --skill create-step-json

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Drafting precise ComposableScreen step JSON for onboarding flows is time-consuming and error-prone; this skill automates the process by producing a design-profile-aligned step ready for Studio.

Core Features & Use Cases

Inspects the target app's design system, fonts, tokens, and copy voice to tailor a ComposableScreen step
Generates a complete step JSON with type, id, nextStep, payload, and UIElement structure based on the ComposableScreen schema
Outputs deterministic, Studio-ready JSON that can be dropped into Rocapine Onboarding Studio for rapid iteration
Use cases include drafting a new onboarding screen, prototyping a step, or exporting a ready-to-run step for a project

Quick Start

Provide the target app's design profile and request a step JSON for a new onboarding screen.

Frequently Asked Questions about create-step-json

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I generate onboarding step JSON for a ComposableScreen?▼

To generate onboarding step JSON, provide a target app's design profile and onboarding goals. The skill analyzes typography, tokens, and copy voice to output a faithful UIElement tree with explicit step IDs and a payload containing only a UIElement array.

What is ComposableScreen step JSON used for in onboarding flows?▼

ComposableScreen step JSON defines the structure for onboarding screens in a format ready for Rocapine Onboarding Studio. It maps UI elements, step IDs, and nextStep links so you can prototype or export deterministic onboarding flows without manual JSON drafting.

Can I use my app's existing design tokens and typography to generate onboarding steps?▼

Yes, the skill inspects an app's design system, fonts, tokens, and copy voice to tailor the ComposableScreen step. This ensures the generated UIElement tree faithfully matches the target app's visual profile and typography.

Does the generated step JSON include explicit linking for onboarding navigation?▼

Yes, the generated step JSON ensures compliance with the ComposableScreen schema by including explicit nextStep linking. It also generates deterministic UUIDs for all elements within the payload to ensure proper navigation tracking.

Why does my onboarding screen JSON fail schema validation in Studio?▼

Onboarding screen JSON fails schema validation when the payload structure is incorrect. This skill prevents errors by outputting a payload containing only a UIElement array, complete with required type, id, and deterministic UUIDs.

What's the best way to prototype a new onboarding screen for Rocapine Onboarding Studio?▼

The best way to prototype an onboarding screen is to provide the target app's design profile to this skill. It generates a complete, Studio-ready step JSON that can be dropped directly into Rocapine Onboarding Studio for rapid iteration.