agentsclimarketplace
Sign in

Design skill

Skill testing-skill/design-skill/skills/design-skill

Use this skill for beginner designers with a guided, hands-on starter that scaffolds simple design projects (landing page, logo, mobile UI) and actionable checklists to learn the design process.From its SKILL.md

Install
npx -y skills add testing-skill/design-skill --skill design-skill

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

2 things to look at

  • no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
  • 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.

SKILL.md

2.5 KB, 494 tokens by cl100k_base, as published. Nobody here has run it

Designing Skill — CLI Skill Definition

Name

Designing Skill — Node.js CLI Template Generator

Purpose

Provide beginner designers with a guided, hands-on starter that scaffolds simple design projects (landing page, logo, mobile UI) and actionable checklists to learn the design process.

Learning Objectives

  • Understand the basic design process: brief → sketch → prototype → iterate.
  • Produce an initial design brief and checklist for any small project.
  • Generate simple starter files you can open in a browser or a design tool and iterate from.

Audience

Beginners and non-designers who want a quick, structured way to start a design project.

Deliverables (generated)

  • design-brief.md — a concise project brief.
  • checklist.md — step-by-step actions to complete the starter.
  • Simple templates:
    • Landing page: index.html, styles.css.
    • Logo: logo.svg (placeholder).
    • Mobile UI: README.md with artboard suggestions.

Usage

  1. Open a terminal in the project folder (D:\DocumentViewerExtension\Design-Skill).
  2. Install dependencies:
npm install
  1. Run the CLI:
npm start
# or when installed globally: design-skill
  1. Follow prompts and open output/<name> to view generated files.

Commands (ssh-like summary)

  • npm install — install dependencies.
  • npm start — launch interactive generator.

How it teaches

Each generated template ships with a short design-brief.md and a checklist.md describing concrete next steps (sketches, iterations, exports). The CLI nudges learners to pick a primary color and name their concept so they practice creating a design brief.

Extensibility

To add new templates or update flows, edit index.js and add a new generator function following the existing patterns (generateLanding, generateLogo, generateMobile). Keep outputs under output/<name>.

Troubleshooting

  • If you see permission errors on Windows, run the terminal as Administrator or use a different output path.
  • If dependencies fail to install, ensure Node.js >=14 is installed.

Contribution

Add issues or pull requests to expand templates, improve checklists, or add automated exports (SVG/PNG) tooling.

What ships with it: 4 files

5.3 KB alongside SKILL.md, 1 of them executable

src/

Keep looking

Skills are one crate of 325,949. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.