Skills ux-prototyping

📦

ux-prototyping

Name: ux-prototyping
Author: Emz1998

Content revision r1 Safe ⚡ Contains scripts⚙️ External commands

Build Interactive UX Prototypes

Teams need fast validation of flows before engineering work begins. This skill turns UX specs into interactive HTML prototypes with screens, states, and basic interactions.

Supports: Claude Codex Code(CC)

📊 73 Adequate

Install with my Agent

Copy this request to your Agent. It includes the canonical Skill page and manifest.

Agent request

Review the Skillstore skill "ux-prototyping" from https://skillstore.io/skills/emz1998-ux-prototyping.md and its manifest at https://skillstore.io/api/skills/emz1998-ux-prototyping/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Your Agent should still show its plan and request any confirmation required by the security policy.

Agent-readable resources

Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.

Markdown detail GET /skills/emz1998-ux-prototyping.md Signed manifest GET /api/skills/emz1998-ux-prototyping/manifest Signed lockfile GET /api/skills/emz1998-ux-prototyping/lockfile

Test it

Using "ux-prototyping". UX spec for a task manager with sign-in, dashboard, create task modal, and detail view.

Expected outcome:

A single HTML prototype with welcome, login, dashboard, create task, empty state, and task detail screens.

Using "ux-prototyping". Request to validate a mobile checkout flow with payment errors.

Expected outcome:

A responsive prototype showing cart review, shipping, payment, confirmation, declined card, and retry paths.

Using "ux-prototyping". UX designer asks for empty, loading, and error states for a search flow.

Expected outcome:

A prototype that demonstrates skeleton loading, empty results, inline validation errors, and success confirmation views.

Security Audit

Safe

v6 • 7/9/2026 Open versioned report

The only confirmed issue is a medium client-side XSS risk in assets/prototype-template.html where form values are rendered with innerHTML. The remaining static findings are false positives from Markdown backticks, JavaScript template literals, CSS border styles, and local array lookup. No prompt injection or malicious intent was found.

Files scanned

644

Lines analyzed

Review items

False positives ignored

Capability review items (1)

These are real local capabilities that may be expected for this skill, so they require review but are not counted as confirmed malicious behavior.

Medium

assets/prototype-template.html:505

innerHTML assignment (XSS risk)

listContainer.innerHTML = state.items.map(item => `

createItem reads title and description from inputs and stores them in state.items, then renderItems interpolates those values into listContainer.innerHTML. A crafted title or description can inject HTML or event handlers in the prototype.

Risk Factors

⚡ Contains scripts (1)

assets/prototype-template.html:505

⚙️ External commands (16)

assets/prototype-template.html:428 assets/prototype-template.html:433 assets/prototype-template.html:505-513 SKILL.md:12 SKILL.md:15 SKILL.md:21-36 SKILL.md:36-47 SKILL.md:47 SKILL.md:49-52 SKILL.md:52-54 SKILL.md:54-59 SKILL.md:59-62 SKILL.md:62-86 SKILL.md:86-107 SKILL.md:107-121 SKILL.md:121

Audited by: codex View Audit History →

Share & cite this report

Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.

Open versioned report

Copy report link

https://skillstore.io/skills/emz1998-ux-prototyping/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown badge

[![Skillstore security assessment](https://skillstore.io/badges/skills/emz1998-ux-prototyping/security.svg)](https://skillstore.io/skills/emz1998-ux-prototyping?utm_source=security_passport_badge)

HTML badge

<a href="https://skillstore.io/skills/emz1998-ux-prototyping?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/emz1998-ux-prototyping/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Embed card

<iframe src="https://skillstore.io/embed/skills/emz1998-ux-prototyping.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

Academic citations (APA · BibTeX · CFF)

APA citation

Emz1998. (2026). ux-prototyping security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/emz1998-ux-prototyping/audits/6

BibTeX citation

@techreport{emz1998-emz1998-ux-prototyping-2026,
  author = {Emz1998},
  title = {ux-prototyping security audit report (audit version 6)},
  institution = {Skillstore},
  year = {2026},
  number = {6},
  url = {https://skillstore.io/skills/emz1998-ux-prototyping/audits/6},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "ux-prototyping security audit report (audit version 6)"
version: "unspecified"
type: report
authors:
  - name: "Emz1998"
date-released: "2026-07-09"
url: "https://skillstore.io/skills/emz1998-ux-prototyping/audits/6"
identifiers:
  - type: other
    value: "skillstore:emz1998-ux-prototyping:audit:6"
    description: "Skillstore immutable audit report identifier"

Skillstore Score

Why this score Evidence Confidence: High

Architecture

Maintainability

Content

Community

Spec Compliance

What You Can Build

Validate onboarding flows

Turn a UX spec into clickable screens for stakeholder review before committing engineering resources.

Test interaction states

Preview empty, loading, error, and success states to check if the flow feels complete.

Demo an app concept

Create a portable HTML prototype for feedback sessions without building backend services.

Try These Prompts

Create a basic prototype

Create an interactive HTML prototype from specs/architecture/ux.md. Include the main screens, navigation, and empty states.

Prototype a specific flow

Build a prototype for the onboarding flow in [path]. Include form validation, success, error, and recovery states.

Refine interaction behavior

Update the prototype to make screen transitions, modal behavior, disabled buttons, and validation feedback match the UX spec.

Validate complex states

Create a full validation prototype for [feature]. Cover primary, secondary, loading, partial, error, and rollback paths.

Best Practices

Provide the UX spec path and name the primary user flow first.
List required states, including empty, loading, error, and success cases.
Review generated prototype text and interactions before using it in research.

Avoid

Asking for production code, backend integration, or database persistence.
Providing only visual preferences without user journeys or screen requirements.
Sharing prototypes with untrusted users before reviewing generated JavaScript.

Frequently Asked Questions

What does this skill create?

It creates a single HTML prototype with inline styles and scripts for UX validation.

Can it use my existing UX spec?

Yes. Provide the spec path or paste the relevant flow details.

Is the output production-ready?

No. It is intended for validation, review, and demos.

Does it need a backend?

No. It simulates data and interactions inside the prototype.

Can I test mobile flows?

Yes. Ask for a mobile viewport and include the target device constraints.

Which AI tools can use it?

It is listed for Claude, Codex, and Claude Code.

Developer Details

Author

Emz1998

License

MIT

Skillstore revision

Version notice

The author did not declare a version.

Repository

https://github.com/Emz1998/avaris-ai/tree/master/.claude/skills/ux-prototyping

Ref

26421118b848d9f1efc0aa169d8a7a9e7e0a877e

Maintenance freshness

7/18/2026

Usage

7 downloads · 227 views

File structure

📁 assets/

📄 prototype-template.html

📄 SKILL.md