本文へ移動
cccskills
無料GitHub で公開

system-deconstruction

Break a design system into its constituent decisions and evaluate each one. Use when auditing design systems, evaluating consistency, or understanding how a product maintains quality at scale.

インストール方法を見る

含まれるファイル(1)

  • SKILL.md1.6 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

System Deconstruction

Take a design system apart. Understand every decision.

How to use

  • /system-deconstruction Apply system analysis constraints to this conversation.

Constraints

System Layers

  • MUST identify and evaluate each layer independently:
    • Token layer: colors, spacing, radii, shadows, type scale
    • Component layer: buttons, inputs, cards, modals, navigation
    • Pattern layer: forms, tables, dashboards, settings, onboarding
    • Layout layer: grids, breakpoints, density modes
  • MUST check consistency within each layer and between layers

Quality Signals

  • Consistent spacing scale across all components
  • Type scale that follows a mathematical ratio
  • Color palette with clear, non-overlapping roles
  • Components that compose predictably
  • States that are systematically covered (not ad-hoc)

Quality Warnings

  • More than 3 one-off components that don't fit the system
  • Spacing values that almost match but don't (15px next to 16px)
  • Colors that serve different semantic roles in different contexts
  • Components that look similar but behave differently

Anti-Patterns

  • Evaluating a design system by its documentation instead of its actual usage
  • Ignoring the gap between what the system defines and what the product actually ships
  • Treating the system as sacred (systems should serve products, not the other way around)

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

Notice what's deliberately missing from a design. Restraint is a taste signal. Use when studying minimalist products, evaluating design maturity, or understanding the power of removal.

日本語の概要は準備中です。原文の説明を表示しています。

Dragoon0x/taste-skills62026年2月27日 更新

Explain the same design observation to a designer, a developer, and a non-technical stakeholder. Same insight, three languages. Use when working cross-functionally or presenting design decisions to mixed audiences.

日本語の概要は準備中です。原文の説明を表示しています。

Dragoon0x/taste-skills62026年2月27日 更新

Palette roles, restraint, semantic consistency, and when fewer colors means better design. Use when building color palettes, evaluating color usage, or diagnosing color-related design problems.

日本語の概要は準備中です。原文の説明を表示しています。

Dragoon0x/taste-skills62026年2月27日 更新

Understand the constraints a design was built under and evaluate quality within that context. Use when reviewing work that had limited time, budget, or team size, or when assessing whether constraints were handled well.

日本語の概要は準備中です。原文の説明を表示しています。

Dragoon0x/taste-skills62026年2月27日 更新

Structured exposure habits for building taste through relentless, intentional consumption. Not passive scrolling. Active intake across design, architecture, film, music, food, and culture. Use when building a taste practice, advising on professional development, or diagnosing why someone's design range feels narrow.

日本語の概要は準備中です。原文の説明を表示しています。

Dragoon0x/taste-skills62026年2月27日 更新

Consistent radii, pixel-perfect alignment, state coverage, and the details that signal design quality. Use when polishing designs, auditing quality, or evaluating whether a design is ready to ship.

日本語の概要は準備中です。原文の説明を表示しています。

Dragoon0x/taste-skills62026年2月27日 更新

Dragoon0x のスキルをすべて見る

このスキルの問題を報告する