onboarding

Analyze a codebase and generate six designer handoff documents with templates.

Updated Mar 26, 2026
One-click install
npx skills add https://github.com/Valyay/vibe-design-kit --skill onboarding-valyay
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: onboarding
Source: https://github.com/Valyay/vibe-design-kit/tree/main/skills/onboarding
Command: npx skills add https://github.com/Valyay/vibe-design-kit --skill onboarding-valyay

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Reduces the time and confusion that comes with joining a new codebase by automatically generating a designer-friendly knowledge base from existing project artifacts.

Core Features & Use Cases

  • Generates a product overview, entity map, screen inventory, component graph, user flows, and visual language audit to accelerate design handoff.
  • Produces templates and reference documents that support ongoing design collaboration, documentation, and memory across projects.

Quick Start

Provide the project context and run onboarding to generate the six core documents and supporting templates for a designer handoff.

Frequently Asked Questions about onboarding

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

FAQPage Schema
How do I onboard a designer to an existing codebase quickly?

Generate a designer-friendly knowledge base from your codebase to onboard designers fast. It produces six core documents including a product overview, entity map, screen inventory, component graph, user flows, and visual language audit to accelerate design handoff.

What is included in a design handoff knowledge base?

A design handoff knowledge base includes six core documents: a product overview, entity map, screen inventory, component graph, user flows, and visual language audit, plus supporting templates with frontmatter and references for ongoing design work.

How do I document product context and user flows from an existing codebase?

Document product context and user flows by analyzing your codebase to automatically extract and map entities, screen inventories, and user flows into structured reference documents with frontmatter for future design collaboration.

Can I generate a visual language audit and component graph from existing project artifacts?

Yes, you can generate a visual language audit and component graph from existing project artifacts. The analysis produces structured documentation mapping your visual language and component relationships for design reference.

Do I need any specific dependencies or components to generate design documentation?

No specific dependencies or components are required to generate design documentation. You simply provide the project context and run the onboarding process to produce the core documents and supporting templates.

When should I use an automated knowledge base for design onboarding?

Use an automated knowledge base for design onboarding when a designer joins a project, asks for onboarding context, or needs documented design handoff and reference templates to reduce confusion and accelerate understanding.