NioPD PD wireframe

Skill 8421bit/NioPD-Skills/plugins/niopd/skills/NioPD-PD-wireframe

Agent Skills for AI-powered Product Management with Claude Code.

Install

npx -y skills add 8421bit/NioPD-Skills --skill NioPD-PD-wireframe

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Creates wireframe specifications for UI concepts. Use for design handoff, stakeholder review, or early prototyping.

SKILL.md

1.7 KB, as published. Nobody here has run it

Wireframe Specification Skill

This skill creates text-based wireframe specifications.

Instructions

Step 1: Define Screen Purpose

What screen/page?
What user goal?
What context?

Step 2: Describe Layout

┌─────────────────────────────────────┐
│ Header: [Logo] [Nav] [User Menu]    │
├─────────────────────────────────────┤
│ Main Content Area                   │
│ ┌─────────┐ ┌─────────────────────┐ │
│ │ Sidebar │ │ Content             │ │
│ └─────────┘ └─────────────────────┘ │
├─────────────────────────────────────┤
│ Footer                              │
└─────────────────────────────────────┘

Step 3: Detail Components

For each component:

Purpose
Content
Interactions
States (loading, error, empty)

Step 4: Note Technical Requirements

Responsive behavior
Accessibility needs
Performance considerations

Step 5: Generate Document

File path: 03-docs/[YYYYMMDD]-wireframe-v0.md

Output Specifications

File Naming: [YYYYMMDD]-wireframe-v0.md
Location: 03-docs/
Template: references/wireframe-template.md