@design-ai/cli 4.55.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.claude-plugin/plugin.json +164 -0
- package/AGENTS.ko.md +126 -0
- package/AGENTS.md +182 -0
- package/CHANGELOG.md +6883 -0
- package/CLAUDE.md +39 -0
- package/LICENSE +21 -0
- package/README.ko.md +245 -0
- package/README.md +277 -0
- package/agents/README.md +14 -0
- package/agents/a11y-reviewer.md +121 -0
- package/agents/component-architect.md +57 -0
- package/agents/design-critic.md +46 -0
- package/agents/token-extractor.md +63 -0
- package/cli/bin/design-ai-mcp.mjs +6 -0
- package/cli/bin/design-ai.mjs +40 -0
- package/cli/commands/audit.mjs +111 -0
- package/cli/commands/check.mjs +226 -0
- package/cli/commands/doctor.mjs +141 -0
- package/cli/commands/examples.mjs +58 -0
- package/cli/commands/help.mjs +271 -0
- package/cli/commands/install.mjs +161 -0
- package/cli/commands/learn.mjs +1871 -0
- package/cli/commands/list.mjs +143 -0
- package/cli/commands/mcp.mjs +27 -0
- package/cli/commands/pack.mjs +211 -0
- package/cli/commands/prompt.mjs +199 -0
- package/cli/commands/route.mjs +247 -0
- package/cli/commands/search.mjs +60 -0
- package/cli/commands/show.mjs +52 -0
- package/cli/commands/site.mjs +558 -0
- package/cli/commands/status.mjs +161 -0
- package/cli/commands/uninstall.mjs +119 -0
- package/cli/commands/update.mjs +184 -0
- package/cli/commands/version.mjs +94 -0
- package/cli/commands/workspace.mjs +176 -0
- package/cli/lib/brief.mjs +52 -0
- package/cli/lib/check.mjs +642 -0
- package/cli/lib/dispatch.mjs +109 -0
- package/cli/lib/doctor.mjs +505 -0
- package/cli/lib/examples.mjs +258 -0
- package/cli/lib/exec.mjs +63 -0
- package/cli/lib/help-flags.mjs +5 -0
- package/cli/lib/learn.mjs +3694 -0
- package/cli/lib/log.mjs +47 -0
- package/cli/lib/mcp-server.mjs +426 -0
- package/cli/lib/output.mjs +101 -0
- package/cli/lib/pack.mjs +599 -0
- package/cli/lib/paths.mjs +63 -0
- package/cli/lib/prompt.mjs +603 -0
- package/cli/lib/route.mjs +740 -0
- package/cli/lib/search.mjs +158 -0
- package/cli/lib/show.mjs +161 -0
- package/cli/lib/signals.mjs +2337 -0
- package/cli/lib/site.mjs +6617 -0
- package/cli/lib/skill-proposals.mjs +2046 -0
- package/cli/lib/suggest.mjs +66 -0
- package/cli/lib/workspace.mjs +1056 -0
- package/commands/README.md +25 -0
- package/commands/component-spec.md +34 -0
- package/commands/conversational.md +44 -0
- package/commands/design-from-brief.md +141 -0
- package/commands/design-review.md +62 -0
- package/commands/document-from-brief.md +47 -0
- package/commands/extract-tokens.md +38 -0
- package/commands/game-ui.md +40 -0
- package/commands/illustration.md +37 -0
- package/commands/iterate.md +167 -0
- package/commands/motion-design.md +54 -0
- package/commands/palette-from-brand.md +50 -0
- package/commands/print.md +49 -0
- package/commands/slide-deck.md +46 -0
- package/commands/spatial.md +47 -0
- package/commands/stability-review.md +74 -0
- package/commands/video.md +42 -0
- package/commands/website-improvement.md +77 -0
- package/docs/AGENT-DEVELOPMENT.md +658 -0
- package/docs/AI-LEARNING.md +429 -0
- package/docs/AIDER-INTEGRATION.md +224 -0
- package/docs/ARCHITECTURE.ko.md +183 -0
- package/docs/ARCHITECTURE.md +105 -0
- package/docs/CODEX-INTEGRATION.md +311 -0
- package/docs/COMPANY-WEBSITE-DOGFOOD.ko.md +144 -0
- package/docs/COMPANY-WEBSITE-DOGFOOD.md +150 -0
- package/docs/COMPANY-WEBSITE-INTAKE-TEMPLATE.ko.md +153 -0
- package/docs/COMPANY-WEBSITE-INTAKE-TEMPLATE.md +154 -0
- package/docs/CONTRIBUTING.ko.md +203 -0
- package/docs/CONTRIBUTING.md +242 -0
- package/docs/CURSOR-INTEGRATION.md +220 -0
- package/docs/DISTRIBUTION.ko.md +248 -0
- package/docs/DISTRIBUTION.md +253 -0
- package/docs/DOGFOOD-FINDINGS.md +180 -0
- package/docs/DOGFOOD-V4-FINDINGS.md +139 -0
- package/docs/DOGFOOD-V4-MKDOCS-FINDINGS.md +233 -0
- package/docs/DOGFOOD-V4-NPM-FINDINGS.md +157 -0
- package/docs/DOGFOOD-V4-VSCODE-FINDINGS.md +135 -0
- package/docs/FIGMA-INTEGRATION.md +222 -0
- package/docs/MCP-INTEGRATION.md +243 -0
- package/docs/MIGRATION-v4.md +121 -0
- package/docs/PLUGIN-PACKAGING.md +240 -0
- package/docs/PRODUCT-READINESS.md +66 -0
- package/docs/QUICKSTART.ko.md +178 -0
- package/docs/QUICKSTART.md +179 -0
- package/docs/RELEASE-CHECKLIST.md +292 -0
- package/docs/ROADMAP.md +19495 -0
- package/docs/SESSION-LOG.md +940 -0
- package/docs/TOKEN-SYNC.md +237 -0
- package/docs/USING.ko.md +206 -0
- package/docs/USING.md +218 -0
- package/docs/WEBSITE-IMPROVEMENT.ko.md +75 -0
- package/docs/WEBSITE-IMPROVEMENT.md +89 -0
- package/docs/announcements/README.md +56 -0
- package/docs/announcements/dev-to-korea.md +206 -0
- package/docs/announcements/hashnode-post.ko.md +232 -0
- package/docs/announcements/okky-post.ko.md +158 -0
- package/docs/announcements/press-kit.md +101 -0
- package/docs/announcements/reddit-r-korea.md +196 -0
- package/docs/announcements/show-hn.md +114 -0
- package/docs/announcements/twitter-thread.md +255 -0
- package/docs/external-status.md +34 -0
- package/docs/integrations/aider-walkthrough.ko.md +275 -0
- package/docs/integrations/aider-walkthrough.md +274 -0
- package/docs/integrations/codex-walkthrough.ko.md +297 -0
- package/docs/integrations/codex-walkthrough.md +297 -0
- package/docs/integrations/cursor-walkthrough.ko.md +281 -0
- package/docs/integrations/cursor-walkthrough.md +284 -0
- package/docs/integrations/design-ai-mcp-server.md +169 -0
- package/docs/integrations/figma-mcp.md +149 -0
- package/docs/integrations/github-mcp.md +178 -0
- package/docs/integrations/linear-mcp.md +215 -0
- package/docs/integrations/notion-mcp.md +174 -0
- package/docs/integrations/sdk-walkthrough.ko.md +375 -0
- package/docs/integrations/sdk-walkthrough.md +375 -0
- package/docs/integrations/slack-mcp.md +208 -0
- package/docs/integrations/vscode-walkthrough.ko.md +202 -0
- package/docs/integrations/vscode-walkthrough.md +205 -0
- package/docs/requirements.txt +16 -0
- package/docs/site-overrides/extra.css +83 -0
- package/docs/site-overrides/favicon.svg +4 -0
- package/docs/site-overrides/logo.svg +10 -0
- package/docs/site-overrides/main.html +18 -0
- package/docs/website-console/app.js +2540 -0
- package/docs/website-console/index.html +24 -0
- package/docs/website-console/styles.css +975 -0
- package/examples/README.md +252 -0
- package/examples/cases/dogfood-v4-korean-hr-onboarding.md +356 -0
- package/examples/component-accordion-actions.md +153 -0
- package/examples/component-accordion-details.md +147 -0
- package/examples/component-accordion-summary.md +180 -0
- package/examples/component-accordion.md +229 -0
- package/examples/component-account-card.md +284 -0
- package/examples/component-address-input.md +260 -0
- package/examples/component-affix.md +190 -0
- package/examples/component-alert-dialog.md +210 -0
- package/examples/component-alert-title.md +77 -0
- package/examples/component-alert.md +192 -0
- package/examples/component-amount-input.md +278 -0
- package/examples/component-anchor.md +198 -0
- package/examples/component-app-bar.md +249 -0
- package/examples/component-aspect-ratio.md +156 -0
- package/examples/component-auto-complete.md +199 -0
- package/examples/component-avatar-group.md +170 -0
- package/examples/component-avatar.md +191 -0
- package/examples/component-back-top.md +123 -0
- package/examples/component-backdrop.md +148 -0
- package/examples/component-badge.md +181 -0
- package/examples/component-banner.md +237 -0
- package/examples/component-biometric-gate.md +281 -0
- package/examples/component-blockquote.md +153 -0
- package/examples/component-border-beam.md +207 -0
- package/examples/component-bottom-navigation.md +226 -0
- package/examples/component-box.md +112 -0
- package/examples/component-breadcrumb.md +222 -0
- package/examples/component-button-base.md +190 -0
- package/examples/component-button-group.md +117 -0
- package/examples/component-button.md +213 -0
- package/examples/component-calendar.md +280 -0
- package/examples/component-callout.md +131 -0
- package/examples/component-card-actions.md +101 -0
- package/examples/component-card-content.md +90 -0
- package/examples/component-card-header.md +122 -0
- package/examples/component-card-media.md +79 -0
- package/examples/component-card.md +233 -0
- package/examples/component-carousel.md +266 -0
- package/examples/component-cascader.md +135 -0
- package/examples/component-category-picker.md +271 -0
- package/examples/component-chart.md +237 -0
- package/examples/component-chat-interface.md +399 -0
- package/examples/component-checkbox.md +149 -0
- package/examples/component-click-away-listener.md +87 -0
- package/examples/component-code.md +213 -0
- package/examples/component-collapsible.md +219 -0
- package/examples/component-color-picker.md +110 -0
- package/examples/component-combobox.md +267 -0
- package/examples/component-command.md +299 -0
- package/examples/component-config-provider.md +190 -0
- package/examples/component-context-menu.md +179 -0
- package/examples/component-css-baseline.md +148 -0
- package/examples/component-date-picker.md +249 -0
- package/examples/component-descriptions.md +242 -0
- package/examples/component-dialog-actions.md +111 -0
- package/examples/component-dialog-content-text.md +76 -0
- package/examples/component-dialog-content.md +105 -0
- package/examples/component-dialog-title.md +104 -0
- package/examples/component-dialog.md +176 -0
- package/examples/component-divider.md +182 -0
- package/examples/component-doc-page.md +217 -0
- package/examples/component-drawer.md +257 -0
- package/examples/component-dropdown.md +220 -0
- package/examples/component-email-layout.md +253 -0
- package/examples/component-empty-state.md +269 -0
- package/examples/component-empty.md +172 -0
- package/examples/component-fade.md +87 -0
- package/examples/component-feature-grid.md +201 -0
- package/examples/component-field.md +266 -0
- package/examples/component-filled-input.md +114 -0
- package/examples/component-flex.md +117 -0
- package/examples/component-float-button.md +214 -0
- package/examples/component-form-control-label.md +134 -0
- package/examples/component-form-control.md +113 -0
- package/examples/component-form-controls.md +251 -0
- package/examples/component-form-group.md +86 -0
- package/examples/component-form-helper-text.md +95 -0
- package/examples/component-form-label.md +98 -0
- package/examples/component-form.md +291 -0
- package/examples/component-game-hud.md +362 -0
- package/examples/component-game-menu.md +327 -0
- package/examples/component-grid.md +140 -0
- package/examples/component-grow.md +79 -0
- package/examples/component-hero-block.md +252 -0
- package/examples/component-hover-card.md +211 -0
- package/examples/component-icon-button.md +142 -0
- package/examples/component-icon.md +102 -0
- package/examples/component-illustration.md +280 -0
- package/examples/component-image-list.md +107 -0
- package/examples/component-image.md +282 -0
- package/examples/component-input-adornment.md +101 -0
- package/examples/component-input-base.md +134 -0
- package/examples/component-input-number.md +141 -0
- package/examples/component-input-otp.md +271 -0
- package/examples/component-input.md +213 -0
- package/examples/component-item.md +243 -0
- package/examples/component-kbd.md +197 -0
- package/examples/component-krw-amount.md +219 -0
- package/examples/component-label.md +118 -0
- package/examples/component-layout.md +217 -0
- package/examples/component-link.md +223 -0
- package/examples/component-list-item-avatar.md +72 -0
- package/examples/component-list-item-button.md +139 -0
- package/examples/component-list-item-icon.md +82 -0
- package/examples/component-list-item-text.md +98 -0
- package/examples/component-list-item.md +116 -0
- package/examples/component-list-subheader.md +70 -0
- package/examples/component-list.md +198 -0
- package/examples/component-loading-button.md +125 -0
- package/examples/component-loading-sequence.md +254 -0
- package/examples/component-lottie-player.md +279 -0
- package/examples/component-masonry.md +191 -0
- package/examples/component-mentions.md +189 -0
- package/examples/component-menu-item.md +102 -0
- package/examples/component-menu-list.md +98 -0
- package/examples/component-menu.md +139 -0
- package/examples/component-menubar.md +259 -0
- package/examples/component-message.md +162 -0
- package/examples/component-mobile-stepper.md +155 -0
- package/examples/component-modal.md +220 -0
- package/examples/component-navigation-menu.md +295 -0
- package/examples/component-notification.md +166 -0
- package/examples/component-otp-countdown.md +245 -0
- package/examples/component-outlined-input.md +145 -0
- package/examples/component-page-transition.md +281 -0
- package/examples/component-pagination.md +226 -0
- package/examples/component-paper.md +199 -0
- package/examples/component-pass-auth.md +265 -0
- package/examples/component-payment-brand-button.md +253 -0
- package/examples/component-payment-method-selector.md +272 -0
- package/examples/component-payment-receipt.md +277 -0
- package/examples/component-popconfirm.md +144 -0
- package/examples/component-popover.md +239 -0
- package/examples/component-popper.md +129 -0
- package/examples/component-pricing-cards.md +247 -0
- package/examples/component-progress.md +195 -0
- package/examples/component-qr-code.md +201 -0
- package/examples/component-radio.md +167 -0
- package/examples/component-rate.md +202 -0
- package/examples/component-resizable.md +163 -0
- package/examples/component-result.md +270 -0
- package/examples/component-scroll-area.md +199 -0
- package/examples/component-scroll-reveal.md +320 -0
- package/examples/component-segmented.md +178 -0
- package/examples/component-select.md +258 -0
- package/examples/component-separator.md +177 -0
- package/examples/component-sheet.md +277 -0
- package/examples/component-sidebar.md +257 -0
- package/examples/component-skeleton.md +178 -0
- package/examples/component-slide.md +89 -0
- package/examples/component-slider.md +208 -0
- package/examples/component-snackbar-content.md +92 -0
- package/examples/component-snackbar.md +121 -0
- package/examples/component-sonner.md +165 -0
- package/examples/component-space.md +125 -0
- package/examples/component-spatial-locomotion.md +373 -0
- package/examples/component-spatial-panel.md +330 -0
- package/examples/component-speed-dial-action.md +78 -0
- package/examples/component-speed-dial.md +177 -0
- package/examples/component-spin.md +173 -0
- package/examples/component-spinner.md +204 -0
- package/examples/component-splitter.md +210 -0
- package/examples/component-stack.md +130 -0
- package/examples/component-statistic.md +282 -0
- package/examples/component-step-button.md +157 -0
- package/examples/component-step-connector.md +157 -0
- package/examples/component-step-content.md +121 -0
- package/examples/component-step-icon.md +115 -0
- package/examples/component-step-label.md +101 -0
- package/examples/component-step.md +84 -0
- package/examples/component-steps.md +264 -0
- package/examples/component-stock-chart.md +251 -0
- package/examples/component-swipeable-drawer.md +149 -0
- package/examples/component-switch.md +99 -0
- package/examples/component-tab-scroll-button.md +180 -0
- package/examples/component-tab.md +120 -0
- package/examples/component-table-body.md +82 -0
- package/examples/component-table-cell.md +118 -0
- package/examples/component-table-container.md +75 -0
- package/examples/component-table-footer.md +72 -0
- package/examples/component-table-head.md +78 -0
- package/examples/component-table-pagination.md +137 -0
- package/examples/component-table-row.md +113 -0
- package/examples/component-table-sort-label.md +109 -0
- package/examples/component-table.md +202 -0
- package/examples/component-tabs.md +184 -0
- package/examples/component-tag-badge.md +309 -0
- package/examples/component-tag.md +102 -0
- package/examples/component-testimonial-carousel.md +218 -0
- package/examples/component-textarea-autosize.md +114 -0
- package/examples/component-textarea.md +173 -0
- package/examples/component-time-picker.md +205 -0
- package/examples/component-timeline.md +170 -0
- package/examples/component-toast.md +224 -0
- package/examples/component-toggle-button.md +129 -0
- package/examples/component-toggle.md +220 -0
- package/examples/component-toolbar.md +104 -0
- package/examples/component-tooltip.md +178 -0
- package/examples/component-tour.md +176 -0
- package/examples/component-transaction-list-item.md +243 -0
- package/examples/component-transfer.md +156 -0
- package/examples/component-tree-select.md +202 -0
- package/examples/component-tree.md +297 -0
- package/examples/component-typography.md +215 -0
- package/examples/component-upload.md +295 -0
- package/examples/component-video-hero.md +409 -0
- package/examples/component-video-player.md +340 -0
- package/examples/component-voice-input.md +408 -0
- package/examples/component-watermark.md +217 -0
- package/examples/component-zoom.md +92 -0
- package/examples/doc-explanation-example.md +196 -0
- package/examples/doc-how-to-example.md +205 -0
- package/examples/doc-tutorial-example.md +162 -0
- package/examples/dogfood-korean-fintech-system.md +433 -0
- package/examples/email-transactional-example.md +259 -0
- package/examples/palette-saas-violet.md +235 -0
- package/examples/print-business-card-spec.md +205 -0
- package/examples/print-packaging-spec.md +285 -0
- package/examples/report-example.md +228 -0
- package/examples/slide-deck-example.md +237 -0
- package/examples/website-improvement-report.md +128 -0
- package/examples/website-improvement-workspace.json +126 -0
- package/install.sh +189 -0
- package/knowledge/COVERAGE.md +740 -0
- package/knowledge/PRINCIPLES.md +108 -0
- package/knowledge/a11y/contrast.md +70 -0
- package/knowledge/a11y/keyboard-and-focus.md +108 -0
- package/knowledge/colors/color-theory.md +90 -0
- package/knowledge/colors/mui-palette-structure.md +105 -0
- package/knowledge/colors/palettes-by-product-type.md +876 -0
- package/knowledge/components/INDEX.md +231 -0
- package/knowledge/components/index.json +1470 -0
- package/knowledge/components/shadcn-registry.md +159 -0
- package/knowledge/conversational/ai-chat-interfaces.md +323 -0
- package/knowledge/conversational/chatbot-design.md +312 -0
- package/knowledge/conversational/conversational-ui-fundamentals.md +299 -0
- package/knowledge/conversational/korean-voice-conventions.md +281 -0
- package/knowledge/conversational/voice-ui-patterns.md +297 -0
- package/knowledge/design-tokens/ant-design.md +124 -0
- package/knowledge/design-tokens/material-3.md +235 -0
- package/knowledge/design-tokens/polaris-and-carbon.md +231 -0
- package/knowledge/design-tokens/tailwind-v4.md +284 -0
- package/knowledge/game-ui/game-accessibility.md +317 -0
- package/knowledge/game-ui/game-ui-fundamentals.md +281 -0
- package/knowledge/game-ui/hud-design.md +324 -0
- package/knowledge/game-ui/korean-gaming-conventions.md +312 -0
- package/knowledge/game-ui/menu-systems.md +388 -0
- package/knowledge/i18n/korean-app-store-visual.md +223 -0
- package/knowledge/i18n/korean-document-style.md +301 -0
- package/knowledge/i18n/korean-payments.md +211 -0
- package/knowledge/i18n/korean-product-conventions.md +96 -0
- package/knowledge/i18n/korean-publishing.md +139 -0
- package/knowledge/i18n/korean-typography.md +123 -0
- package/knowledge/icons/curated-sets.md +225 -0
- package/knowledge/illustration/hero-illustrations.md +234 -0
- package/knowledge/illustration/illustration-systems.md +221 -0
- package/knowledge/illustration/mascot-design.md +208 -0
- package/knowledge/illustration/spot-illustrations.md +246 -0
- package/knowledge/illustration/svg-optimization.md +308 -0
- package/knowledge/layout/spacing-and-grid.md +119 -0
- package/knowledge/motion/app-loading-sequences.md +277 -0
- package/knowledge/motion/choreography-depth.md +297 -0
- package/knowledge/motion/marketing-motion.md +223 -0
- package/knowledge/motion/micro-interactions.md +266 -0
- package/knowledge/motion/motion-tools.md +281 -0
- package/knowledge/motion/principles.md +126 -0
- package/knowledge/patterns/auth-flow-design.md +316 -0
- package/knowledge/patterns/b2b-onboarding-flows.md +182 -0
- package/knowledge/patterns/brand-identity.md +238 -0
- package/knowledge/patterns/brand-references.md +97 -0
- package/knowledge/patterns/chart-color-encoding.md +269 -0
- package/knowledge/patterns/chart-types.md +344 -0
- package/knowledge/patterns/dashboard-composition.md +299 -0
- package/knowledge/patterns/design-system-qa.md +356 -0
- package/knowledge/patterns/document-typography.md +248 -0
- package/knowledge/patterns/email-design.md +338 -0
- package/knowledge/patterns/empty-states.md +263 -0
- package/knowledge/patterns/error-states.md +318 -0
- package/knowledge/patterns/form-design.md +237 -0
- package/knowledge/patterns/information-architecture.md +341 -0
- package/knowledge/patterns/landing-hero-design.md +283 -0
- package/knowledge/patterns/landing-page-patterns.md +681 -0
- package/knowledge/patterns/list-and-feed.md +371 -0
- package/knowledge/patterns/mobile-navigation.md +278 -0
- package/knowledge/patterns/money-and-amount.md +301 -0
- package/knowledge/patterns/onboarding.md +300 -0
- package/knowledge/patterns/pricing-page-design.md +261 -0
- package/knowledge/patterns/realtime-data.md +280 -0
- package/knowledge/patterns/report-design.md +330 -0
- package/knowledge/patterns/search-ux.md +373 -0
- package/knowledge/patterns/settings-page.md +325 -0
- package/knowledge/patterns/slide-deck-design.md +316 -0
- package/knowledge/patterns/styles-catalog.md +2599 -0
- package/knowledge/patterns/technical-writing.md +306 -0
- package/knowledge/patterns/ui-reasoning.md +1853 -0
- package/knowledge/patterns/ux-guidelines.md +1454 -0
- package/knowledge/platforms/react-native.md +395 -0
- package/knowledge/print/brochures-and-flyers.md +276 -0
- package/knowledge/print/korean-print-conventions.md +284 -0
- package/knowledge/print/packaging.md +321 -0
- package/knowledge/print/print-fundamentals.md +238 -0
- package/knowledge/print/signage-and-posters.md +235 -0
- package/knowledge/print/stationery.md +262 -0
- package/knowledge/spatial/ar-patterns.md +253 -0
- package/knowledge/spatial/comfort-and-accessibility.md +245 -0
- package/knowledge/spatial/spatial-design-fundamentals.md +346 -0
- package/knowledge/spatial/spatial-ui-elements.md +343 -0
- package/knowledge/spatial/vr-patterns.md +302 -0
- package/knowledge/typography/font-pairings.md +332 -0
- package/knowledge/typography/mui-type-scale.md +57 -0
- package/knowledge/typography/type-scale-fundamentals.md +105 -0
- package/knowledge/video/in-product-video.md +277 -0
- package/knowledge/video/korean-video-conventions.md +247 -0
- package/knowledge/video/marketing-video.md +258 -0
- package/knowledge/video/social-and-short-form.md +257 -0
- package/knowledge/video/video-fundamentals.md +296 -0
- package/package.json +106 -0
- package/skills/README.md +39 -0
- package/skills/color-palette/PLAYBOOK.md +175 -0
- package/skills/color-palette/SKILL.md +6 -0
- package/skills/color-palette/TEMPLATE.md +103 -0
- package/skills/component-spec-writer/PLAYBOOK.md +169 -0
- package/skills/component-spec-writer/SKILL.md +6 -0
- package/skills/component-spec-writer/TEMPLATE.md +115 -0
- package/skills/conversational-ui-designer/PLAYBOOK.md +231 -0
- package/skills/conversational-ui-designer/SKILL.md +6 -0
- package/skills/design-broadcast/PLAYBOOK.md +146 -0
- package/skills/design-broadcast/SKILL.md +6 -0
- package/skills/design-critique/PLAYBOOK.md +137 -0
- package/skills/design-critique/SKILL.md +6 -0
- package/skills/design-pr-review/PLAYBOOK.md +171 -0
- package/skills/design-pr-review/SKILL.md +6 -0
- package/skills/design-system-builder/PLAYBOOK.md +218 -0
- package/skills/design-system-builder/SKILL.md +6 -0
- package/skills/design-system-qa/PLAYBOOK.md +163 -0
- package/skills/design-system-qa/SKILL.md +6 -0
- package/skills/document-author/PLAYBOOK.md +167 -0
- package/skills/document-author/SKILL.md +6 -0
- package/skills/figma-token-sync/PLAYBOOK.md +149 -0
- package/skills/figma-token-sync/SKILL.md +6 -0
- package/skills/game-ui-designer/PLAYBOOK.md +209 -0
- package/skills/game-ui-designer/SKILL.md +6 -0
- package/skills/handoff-spec/PLAYBOOK.md +170 -0
- package/skills/handoff-spec/SKILL.md +6 -0
- package/skills/illustration-designer/PLAYBOOK.md +166 -0
- package/skills/illustration-designer/SKILL.md +6 -0
- package/skills/motion-designer/PLAYBOOK.md +223 -0
- package/skills/motion-designer/SKILL.md +6 -0
- package/skills/print-designer/PLAYBOOK.md +209 -0
- package/skills/print-designer/SKILL.md +6 -0
- package/skills/slide-deck-author/PLAYBOOK.md +198 -0
- package/skills/slide-deck-author/SKILL.md +6 -0
- package/skills/spatial-designer/PLAYBOOK.md +238 -0
- package/skills/spatial-designer/SKILL.md +6 -0
- package/skills/ux-audit/PLAYBOOK.md +142 -0
- package/skills/ux-audit/SKILL.md +6 -0
- package/skills/video-designer/PLAYBOOK.md +240 -0
- package/skills/video-designer/SKILL.md +6 -0
- package/skills/website-improvement/PLAYBOOK.md +118 -0
- package/skills/website-improvement/SKILL.md +6 -0
- package/skills/website-improvement/TEMPLATE.md +103 -0
- package/tools/audit/changelog-generate.py +176 -0
- package/tools/audit/check-coverage.py +483 -0
- package/tools/audit/doctor_assertions.py +256 -0
- package/tools/audit/example-qa.py +108 -0
- package/tools/audit/frontmatter-check.py +199 -0
- package/tools/audit/integration-check.py +95 -0
- package/tools/audit/korean-copy-check.py +161 -0
- package/tools/audit/link-check.py +146 -0
- package/tools/audit/local-ci.py +558 -0
- package/tools/audit/package-contents.py +723 -0
- package/tools/audit/package-smoke.py +22443 -0
- package/tools/audit/raw-hex-check.py +252 -0
- package/tools/audit/registry-smoke.py +8188 -0
- package/tools/audit/release-metadata.py +9832 -0
- package/tools/audit/run-all.py +351 -0
- package/tools/audit/smoke_assertions.py +12742 -0
- package/tools/audit/stability-review.py +332 -0
- package/tools/audit/stale-check.py +156 -0
- package/tools/migrations/add-version-frontmatter.py +132 -0
- package/tools/migrations/bump-last-updated.py +131 -0
- package/tools/migrations/promote-stability.py +172 -0
- package/tools/preview/README.md +58 -0
- package/tools/preview/render-tokens.py +454 -0
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
# Show HN draft
|
|
2
|
+
|
|
3
|
+
Submission target: <https://news.ycombinator.com/submit>
|
|
4
|
+
|
|
5
|
+
## Title (max 80 chars)
|
|
6
|
+
|
|
7
|
+
```
|
|
8
|
+
Show HN: design-ai – senior product designer for any AI coding agent
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
Alt titles (rotate if first doesn't catch):
|
|
12
|
+
- `Show HN: Design knowledge base for Claude Code, Codex, Cursor, Aider`
|
|
13
|
+
- `Show HN: design-ai – 91 design files, 19 skills, model-agnostic`
|
|
14
|
+
|
|
15
|
+
## URL field
|
|
16
|
+
|
|
17
|
+
`https://github.com/sungjin9288/design-ai`
|
|
18
|
+
|
|
19
|
+
## Text field (Show HN body, optional but recommended)
|
|
20
|
+
|
|
21
|
+
```
|
|
22
|
+
Hey HN —
|
|
23
|
+
|
|
24
|
+
design-ai is a hand-curated design knowledge base that turns any AI
|
|
25
|
+
coding agent into a senior product designer. It plugs into Claude
|
|
26
|
+
Code (skills + commands + agents), Codex CLI (AGENTS.md), Cursor
|
|
27
|
+
(.cursorrules), Aider (--read), or any LLM via plain prompts.
|
|
28
|
+
|
|
29
|
+
What's in it:
|
|
30
|
+
- 91 knowledge files synthesized from Ant Design + MUI + shadcn-ui
|
|
31
|
+
- Tokens, components, motion, illustration, print, video, game UI,
|
|
32
|
+
conversational, and spatial design
|
|
33
|
+
- 19 skills with playbooks, 15 slash commands, 4 review agents
|
|
34
|
+
- 160 worked examples
|
|
35
|
+
- 6 CI audits gating every PR
|
|
36
|
+
|
|
37
|
+
What makes it different:
|
|
38
|
+
- Model-agnostic — markdown is the source of truth, not vendor-
|
|
39
|
+
specific skill files
|
|
40
|
+
- Korean fintech / SaaS conventions baked in (Toss, KakaoPay,
|
|
41
|
+
Pretendard, 본인인증, KFDA, GRAC, 분리배출)
|
|
42
|
+
- All knowledge files versioned (semver + last_updated + stability)
|
|
43
|
+
- Stale-content audit fails CI on files >12 months old
|
|
44
|
+
|
|
45
|
+
Try it:
|
|
46
|
+
npx @design-ai/cli install
|
|
47
|
+
|
|
48
|
+
License: MIT.
|
|
49
|
+
|
|
50
|
+
This is v4.0 — the API is now stable across 8 surfaces. Deprecation
|
|
51
|
+
policy: deprecate in 4.x, remove in 5.0.
|
|
52
|
+
|
|
53
|
+
Happy to answer questions about the architecture choices, the
|
|
54
|
+
audit setup, or why I went corpus-first instead of model-fine-tuning.
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
## Comment-prep notes (for replying in thread)
|
|
58
|
+
|
|
59
|
+
Likely questions and prepared responses:
|
|
60
|
+
|
|
61
|
+
### "How is this different from just asking Claude to be a designer?"
|
|
62
|
+
|
|
63
|
+
> The corpus is the difference. A bare LLM produces generic design output —
|
|
64
|
+
> reasonable but not opinionated, not Korean-aware, not citing real design
|
|
65
|
+
> system precedent. design-ai's knowledge files cite Ant / MUI / shadcn for
|
|
66
|
+
> every claim, encode KR conventions (Pretendard, 본인인증, 합쇼체 vs
|
|
67
|
+
> 해요체), and the skills enforce verification phases (output must cite
|
|
68
|
+
> ≥2 references, cover all states, satisfy a11y).
|
|
69
|
+
|
|
70
|
+
### "Why model-agnostic? Just use Claude Code skills."
|
|
71
|
+
|
|
72
|
+
> Same content needs to work in Codex CLI (AGENTS.md convention), Cursor
|
|
73
|
+
> (.cursorrules), Aider (--read flag), VS Code extension. Encoding it
|
|
74
|
+
> only as Claude skill files locks adopters in. Markdown + JSON is the
|
|
75
|
+
> source of truth; the skill system is just one ergonomic surface on top.
|
|
76
|
+
|
|
77
|
+
### "55% component coverage seems low."
|
|
78
|
+
|
|
79
|
+
> 55% covers every flagship primitive across Ant + MUI + shadcn. Remaining
|
|
80
|
+
> 45% is mostly sub-components (Step.Item, Form.Field) and transition
|
|
81
|
+
> primitives. Coverage push to 70% is on the 4.x roadmap. I prioritized
|
|
82
|
+
> distribution + audit infrastructure over chasing 100% coverage on a
|
|
83
|
+
> private repo.
|
|
84
|
+
|
|
85
|
+
### "Korean-focused — does it work for English markets?"
|
|
86
|
+
|
|
87
|
+
> Yes. The non-Korean portions cover Western design systems exhaustively.
|
|
88
|
+
> Korean material is additive, in dedicated files (e.g.,
|
|
89
|
+
> korean-payments.md, korean-typography.md). Adopters who don't load
|
|
90
|
+
> KR-specific files get the Western corpus only.
|
|
91
|
+
|
|
92
|
+
### "Why no fine-tuning?"
|
|
93
|
+
|
|
94
|
+
> Fine-tuning means re-training every time a design system updates.
|
|
95
|
+
> Markdown is grep-able, human-auditable, version-controllable, and
|
|
96
|
+
> works with any LLM. If knowledge grows past ~100K tokens I'd add an
|
|
97
|
+
> embedding index — but it currently fits comfortably in context.
|
|
98
|
+
|
|
99
|
+
## After-submission tasks
|
|
100
|
+
|
|
101
|
+
- Refresh the HN tab every 10 min in the first 90 minutes — early
|
|
102
|
+
upvote velocity decides front page.
|
|
103
|
+
- Reply to *every* substantive comment within 30 min. Show HN's
|
|
104
|
+
ranking partly considers author engagement.
|
|
105
|
+
- If frontpaged: tag the moment in `docs/announcements/posted.md`
|
|
106
|
+
with screenshot + final position.
|
|
107
|
+
|
|
108
|
+
## Don't
|
|
109
|
+
|
|
110
|
+
- Don't ask friends to upvote — HN flags vote rings.
|
|
111
|
+
- Don't reply defensively to criticism. Acknowledge, then offer
|
|
112
|
+
evidence or roadmap.
|
|
113
|
+
- Don't post during US night (KST morning) — HN audience is mostly
|
|
114
|
+
US/EU; aim Tuesday-Thursday 8-10am PT.
|
|
@@ -0,0 +1,255 @@
|
|
|
1
|
+
# X / Twitter thread drafts
|
|
2
|
+
|
|
3
|
+
Two parallel threads — one English, one Korean. Post 2 hours apart so they don't compete for retweets.
|
|
4
|
+
|
|
5
|
+
## English thread (8 tweets)
|
|
6
|
+
|
|
7
|
+
### 1/8 (hook)
|
|
8
|
+
|
|
9
|
+
```
|
|
10
|
+
After 32 phases, design-ai hit v4.0 stable today.
|
|
11
|
+
|
|
12
|
+
It turns any AI coding agent (Claude Code, Codex, Cursor, Aider) into
|
|
13
|
+
a senior product designer. With Korean market depth baked in.
|
|
14
|
+
|
|
15
|
+
npx @design-ai/cli install
|
|
16
|
+
|
|
17
|
+
Architecture choices that shaped it 🧵
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
(images: stats card from press-kit.md)
|
|
21
|
+
|
|
22
|
+
### 2/8 (model-agnostic)
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
1/ Markdown is the source of truth, not vendor-specific skills.
|
|
26
|
+
|
|
27
|
+
Same content runs in Claude Code (skills + commands), Codex CLI
|
|
28
|
+
(AGENTS.md), Cursor (.cursorrules), Aider (--read), VS Code sidebar
|
|
29
|
+
extension, or as a system prompt for any LLM.
|
|
30
|
+
|
|
31
|
+
Lock-in costs adopters. Markdown costs nothing.
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
### 3/8 (Korean depth)
|
|
35
|
+
|
|
36
|
+
```
|
|
37
|
+
2/ Korean conventions aren't a footnote, they're domain depth:
|
|
38
|
+
|
|
39
|
+
• Toss / KakaoPay payment flow trees
|
|
40
|
+
• 본인인증 (PASS / NICE / KCB) integration
|
|
41
|
+
• Pretendard fallback chains
|
|
42
|
+
• 해요체 vs 합쇼체 chatbot register
|
|
43
|
+
• 확률 표시 (game UI)
|
|
44
|
+
• KFDA / GRAC / 분리배출 (regulatory)
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
### 4/8 (distribution before content)
|
|
48
|
+
|
|
49
|
+
```
|
|
50
|
+
3/ Distribution before mass content.
|
|
51
|
+
|
|
52
|
+
At 30% component coverage I built:
|
|
53
|
+
• npm CLI
|
|
54
|
+
• Homebrew formula
|
|
55
|
+
• mkdocs site (EN + KO)
|
|
56
|
+
• Claude plugin manifest
|
|
57
|
+
• VS Code extension
|
|
58
|
+
|
|
59
|
+
A 30% corpus adopters can install > 70% locked in a private repo.
|
|
60
|
+
Coverage caught up later (now 55%).
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
### 5/8 (audit-driven quality)
|
|
64
|
+
|
|
65
|
+
```
|
|
66
|
+
4/ 6 audits gate every PR:
|
|
67
|
+
|
|
68
|
+
• frontmatter shape
|
|
69
|
+
• 360+ internal links
|
|
70
|
+
• Korean voice/register
|
|
71
|
+
• component coverage diff
|
|
72
|
+
• integration walkthrough completeness
|
|
73
|
+
• stale-content (>12mo = CI failure)
|
|
74
|
+
|
|
75
|
+
Each new audit prevented a regression class.
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
### 6/8 (the journey)
|
|
79
|
+
|
|
80
|
+
```
|
|
81
|
+
v2.0 → v4.0 in numbers:
|
|
82
|
+
|
|
83
|
+
Knowledge files 55 → 91
|
|
84
|
+
Worked examples 83 → 160
|
|
85
|
+
Skills 12 → 19
|
|
86
|
+
Slash commands 8 → 15
|
|
87
|
+
Coverage 24% → 55%
|
|
88
|
+
Channels 1 → 4
|
|
89
|
+
Languages 0 → 2
|
|
90
|
+
Audits 4 → 6
|
|
91
|
+
```
|
|
92
|
+
|
|
93
|
+
### 7/8 (what v4.0 means)
|
|
94
|
+
|
|
95
|
+
```
|
|
96
|
+
v4.0 is a graduation release.
|
|
97
|
+
|
|
98
|
+
8 surfaces (knowledge / skills / commands / agents / CLI / plugin /
|
|
99
|
+
VS Code / docs) are now API-stable.
|
|
100
|
+
|
|
101
|
+
Deprecation policy: deprecate in 4.x → maintain in 4.x → remove in 5.0.
|
|
102
|
+
|
|
103
|
+
Adopters can pin and trust.
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
### 8/8 (CTA)
|
|
107
|
+
|
|
108
|
+
```
|
|
109
|
+
Try it:
|
|
110
|
+
|
|
111
|
+
npx @design-ai/cli install
|
|
112
|
+
|
|
113
|
+
GitHub: https://github.com/sungjin9288/design-ai
|
|
114
|
+
Docs: (mkdocs URL)
|
|
115
|
+
License: MIT
|
|
116
|
+
|
|
117
|
+
Questions, feedback, or contributions: GitHub Issues.
|
|
118
|
+
|
|
119
|
+
Especially curious about your Cursor + Figma + Korean fintech setups.
|
|
120
|
+
```
|
|
121
|
+
|
|
122
|
+
## Korean thread (8 tweets, 한국어)
|
|
123
|
+
|
|
124
|
+
### 1/8 (훅)
|
|
125
|
+
|
|
126
|
+
```
|
|
127
|
+
오늘 design-ai가 v4.0 stable에 도달했어요.
|
|
128
|
+
|
|
129
|
+
모든 AI 코딩 에이전트 (Claude Code / Codex / Cursor / Aider)를 시니어
|
|
130
|
+
프로덕트 디자이너로 만드는 오픈소스. 한국 시장 컨벤션이 기본 내장.
|
|
131
|
+
|
|
132
|
+
npx @design-ai/cli install
|
|
133
|
+
|
|
134
|
+
만들면서 한 선택들 🧵
|
|
135
|
+
```
|
|
136
|
+
|
|
137
|
+
### 2/8 (모델 무관)
|
|
138
|
+
|
|
139
|
+
```
|
|
140
|
+
1/ 마크다운이 진실의 원천. 벤더 전용 스킬 파일 아님.
|
|
141
|
+
|
|
142
|
+
같은 콘텐츠가 Claude Code (스킬 + 커맨드), Codex CLI (AGENTS.md),
|
|
143
|
+
Cursor (.cursorrules), Aider (--read), VS Code 확장에서 모두 동작.
|
|
144
|
+
|
|
145
|
+
Lock-in은 adopter한테 비용. 마크다운은 공짜.
|
|
146
|
+
```
|
|
147
|
+
|
|
148
|
+
### 3/8 (한국 시장 깊이)
|
|
149
|
+
|
|
150
|
+
```
|
|
151
|
+
2/ 한국 컨벤션은 footnote가 아니라 도메인 깊이:
|
|
152
|
+
|
|
153
|
+
• Toss / KakaoPay 결제 흐름 트리
|
|
154
|
+
• 본인인증 (PASS / NICE / KCB) 통합
|
|
155
|
+
• Pretendard fallback 체인
|
|
156
|
+
• 해요체 vs 합쇼체 챗봇 톤 분기
|
|
157
|
+
• 확률 표시 (게임 UI)
|
|
158
|
+
• KFDA / GRAC / 분리배출 (규제)
|
|
159
|
+
```
|
|
160
|
+
|
|
161
|
+
### 4/8 (배포 우선)
|
|
162
|
+
|
|
163
|
+
```
|
|
164
|
+
3/ 컨텐츠 양 늘리기 전에 배포 가능하게.
|
|
165
|
+
|
|
166
|
+
커버리지 30%일 때 만들어 놓은 것:
|
|
167
|
+
• npm CLI
|
|
168
|
+
• Homebrew formula
|
|
169
|
+
• mkdocs 사이트 (EN + KO)
|
|
170
|
+
• Claude plugin manifest
|
|
171
|
+
• VS Code 확장
|
|
172
|
+
|
|
173
|
+
설치 가능한 30% > private repo의 70%. 커버리지는 나중에 따라잡았어요
|
|
174
|
+
(현재 55%).
|
|
175
|
+
```
|
|
176
|
+
|
|
177
|
+
### 5/8 (감사 주도 품질)
|
|
178
|
+
|
|
179
|
+
```
|
|
180
|
+
4/ PR마다 6개 감사 게이팅:
|
|
181
|
+
|
|
182
|
+
• frontmatter 형식
|
|
183
|
+
• 360+ 내부 링크
|
|
184
|
+
• 한국어 voice / register
|
|
185
|
+
• 컴포넌트 커버리지 diff
|
|
186
|
+
• 통합 워크스루 완전성
|
|
187
|
+
• stale-content (>12개월 = CI 실패)
|
|
188
|
+
|
|
189
|
+
각 감사가 회귀 케이스 한 종류씩 막아 줘요.
|
|
190
|
+
```
|
|
191
|
+
|
|
192
|
+
### 6/8 (여정)
|
|
193
|
+
|
|
194
|
+
```
|
|
195
|
+
v2.0 → v4.0 숫자로:
|
|
196
|
+
|
|
197
|
+
지식 파일 55 → 91
|
|
198
|
+
워크드 예제 83 → 160
|
|
199
|
+
스킬 12 → 19
|
|
200
|
+
슬래시 커맨드 8 → 15
|
|
201
|
+
커버리지 24% → 55%
|
|
202
|
+
배포 채널 1 → 4
|
|
203
|
+
언어 0 → 2
|
|
204
|
+
CI 감사 4 → 6
|
|
205
|
+
```
|
|
206
|
+
|
|
207
|
+
### 7/8 (v4.0 의미)
|
|
208
|
+
|
|
209
|
+
```
|
|
210
|
+
v4.0은 그래듀에이션 릴리스.
|
|
211
|
+
|
|
212
|
+
8개 표면 (지식 / 스킬 / 커맨드 / 에이전트 / CLI / plugin / VS Code /
|
|
213
|
+
docs) 이 API stable.
|
|
214
|
+
|
|
215
|
+
deprecation 정책: 4.x에서 deprecate → 4.x 유지 → 5.0에서 제거.
|
|
216
|
+
|
|
217
|
+
adopter가 pin하고 믿을 수 있어요.
|
|
218
|
+
```
|
|
219
|
+
|
|
220
|
+
### 8/8 (CTA)
|
|
221
|
+
|
|
222
|
+
```
|
|
223
|
+
시작하기:
|
|
224
|
+
|
|
225
|
+
npx @design-ai/cli install
|
|
226
|
+
|
|
227
|
+
GitHub: https://github.com/sungjin9288/design-ai
|
|
228
|
+
문서 (한국어): docs/USING.ko.md
|
|
229
|
+
라이선스: MIT
|
|
230
|
+
|
|
231
|
+
질문 / 피드백 / 기여: GitHub Issues.
|
|
232
|
+
|
|
233
|
+
Cursor + Figma + 한국 핀테크 워크플로 케이스 특히 궁금해요.
|
|
234
|
+
```
|
|
235
|
+
|
|
236
|
+
## Posting timing
|
|
237
|
+
|
|
238
|
+
- **English thread**: Tuesday-Thursday 8am PT (16:00 UTC).
|
|
239
|
+
- **Korean thread**: same day, KST 9am (00:00 UTC) — 8 hours offset
|
|
240
|
+
from English to hit different timezones.
|
|
241
|
+
- Reply to first 5 comments in each thread within 30 minutes.
|
|
242
|
+
|
|
243
|
+
## Hashtags (last tweet only — clutters earlier ones)
|
|
244
|
+
|
|
245
|
+
EN: `#opensource #design #ai #claude #korea #cursor`
|
|
246
|
+
KO: `#오픈소스 #디자인 #AI #한국 #코드 #프론트엔드`
|
|
247
|
+
|
|
248
|
+
## Don't
|
|
249
|
+
|
|
250
|
+
- Don't use the same image in both threads (algorithm dedupe).
|
|
251
|
+
- Don't @-mention Anthropic / Claude unless tagged organically.
|
|
252
|
+
- Don't post both threads at the same minute — algorithm flags
|
|
253
|
+
duplicates.
|
|
254
|
+
- Don't auto-translate the Korean thread from English. It's written
|
|
255
|
+
in natural Korean.
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
# External Publication Status
|
|
2
|
+
|
|
3
|
+
> Checked: 2026-06-23
|
|
4
|
+
> Scope: npm registry, GitHub Pages, VS Code Marketplace
|
|
5
|
+
|
|
6
|
+
## Summary
|
|
7
|
+
|
|
8
|
+
Local release readiness is verified and GitHub Pages docs are publicly reachable. The npm package name in `package.json` and the VS Code Marketplace extension id still returned no public listing at the time of this check.
|
|
9
|
+
|
|
10
|
+
## Results
|
|
11
|
+
|
|
12
|
+
| Surface | Checked target | Result | Evidence |
|
|
13
|
+
|---|---|---|---|
|
|
14
|
+
| npm registry | `@design-ai/cli` | Not published or not publicly accessible: npm returned `E404` | `evidence/cli-logs/npm-registry-status.log` |
|
|
15
|
+
| GitHub Pages | `https://sungjin9288.github.io/design-ai/` | Published and reachable: HTTP `200`, design-ai MkDocs page rendered | `evidence/cli-logs/github-pages-status.log` |
|
|
16
|
+
| VS Code Marketplace | `sungjin.design-ai-vscode` | No public Marketplace listing found for the publisher/extension id | `evidence/cli-logs/vscode-marketplace-status.log` |
|
|
17
|
+
|
|
18
|
+
## Interpretation
|
|
19
|
+
|
|
20
|
+
- The repository is locally release-ready based on `npm run release:check`.
|
|
21
|
+
- GitHub Pages docs can now be described as publicly deployed.
|
|
22
|
+
- Public npm install and Marketplace install claims should not be used in portfolio or README copy until those surfaces are published and rechecked.
|
|
23
|
+
- For portfolio wording, describe npm/package/Marketplace as "prepared for" or "local/package smoke verified", not "publicly shipped".
|
|
24
|
+
|
|
25
|
+
## Recheck Commands
|
|
26
|
+
|
|
27
|
+
```bash
|
|
28
|
+
npm view @design-ai/cli version name time.modified dist-tags --json
|
|
29
|
+
curl -sS -L -o /tmp/design-ai-pages.html -w 'http_code=%{http_code}\nurl_effective=%{url_effective}\n' https://sungjin9288.github.io/design-ai/
|
|
30
|
+
curl -sS -H 'Content-Type: application/json' \
|
|
31
|
+
-H 'Accept: application/json;api-version=7.2-preview.1' \
|
|
32
|
+
-X POST https://marketplace.visualstudio.com/_apis/public/gallery/extensionquery \
|
|
33
|
+
-d '{"filters":[{"criteria":[{"filterType":7,"value":"sungjin.design-ai-vscode"}]}],"flags":914}'
|
|
34
|
+
```
|
|
@@ -0,0 +1,275 @@
|
|
|
1
|
+
# Aider 워크스루
|
|
2
|
+
|
|
3
|
+
[Aider](https://aider.chat) (터미널 기반 AI 페어 프로그래머)에서 design-ai를 사용하는 구체적인 가이드. [`docs/AIDER-INTEGRATION.md`](../AIDER-INTEGRATION.md)는 설치를, 이 문서는 워크플로를 다뤄요.
|
|
4
|
+
|
|
5
|
+
## 사전 준비
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
pip install aider-chat
|
|
9
|
+
git clone https://github.com/sungjin9288/design-ai.git ~/dev/design-ai
|
|
10
|
+
```
|
|
11
|
+
|
|
12
|
+
Aider는 모델 API 키 (Anthropic, OpenAI 등) 필요:
|
|
13
|
+
|
|
14
|
+
```bash
|
|
15
|
+
export ANTHROPIC_API_KEY=...
|
|
16
|
+
# 또는
|
|
17
|
+
export OPENAI_API_KEY=...
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
## 설치 (60초)
|
|
21
|
+
|
|
22
|
+
```bash
|
|
23
|
+
cd ~/projects/my-app
|
|
24
|
+
aider --read ~/dev/design-ai/AGENTS.md \
|
|
25
|
+
--read ~/dev/design-ai/knowledge/PRINCIPLES.md \
|
|
26
|
+
--model claude-sonnet-4-6
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
`--read`는 파일을 읽기 전용 컨텍스트로 추가해요 (Aider가 수정 안 함). 영구 설정은 `.aider.conf.yml`에 추가:
|
|
30
|
+
|
|
31
|
+
```yaml
|
|
32
|
+
# ~/projects/my-app/.aider.conf.yml
|
|
33
|
+
read:
|
|
34
|
+
- /Users/sungjin/dev/design-ai/AGENTS.md
|
|
35
|
+
- /Users/sungjin/dev/design-ai/knowledge/PRINCIPLES.md
|
|
36
|
+
model: claude-sonnet-4-6
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
## 워크스루 1: 스펙에서 컴포넌트 구현 생성
|
|
40
|
+
|
|
41
|
+
**목표**: Aider가 design-ai Banner spec을 읽고 프로젝트에 작동하는 React 구현 생성.
|
|
42
|
+
|
|
43
|
+
### 세션
|
|
44
|
+
|
|
45
|
+
```
|
|
46
|
+
$ aider src/components/Banner.tsx \
|
|
47
|
+
--read ~/dev/design-ai/examples/component-banner.md \
|
|
48
|
+
--read ~/dev/design-ai/knowledge/i18n/korean-document-style.md
|
|
49
|
+
|
|
50
|
+
Aider v0.x — claude-sonnet-4-6 사용 중
|
|
51
|
+
Read: examples/component-banner.md
|
|
52
|
+
Read: knowledge/i18n/korean-document-style.md
|
|
53
|
+
편집 중: src/components/Banner.tsx (새 파일)
|
|
54
|
+
|
|
55
|
+
> spec에 따라 Banner 구현 주세요. 변형 info / success / warning /
|
|
56
|
+
error / promo. 닫기 가능. 토큰 시스템 (var(--color-...)) 사용.
|
|
57
|
+
기본값에 한국어 인식 카피.
|
|
58
|
+
|
|
59
|
+
[Aider가 구현 생성]
|
|
60
|
+
|
|
61
|
+
[Aider가 diff 제안하고 적용 요청]
|
|
62
|
+
|
|
63
|
+
> y
|
|
64
|
+
|
|
65
|
+
적용됨: src/components/Banner.tsx
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
`--read` 플래그는 Aider에게 design-ai 파일을 컨텍스트로 사용하되 수정하지 말라고 알려요. 편집은 작업 파일 (`src/components/Banner.tsx`)에만 들어가요.
|
|
69
|
+
|
|
70
|
+
## 워크스루 2: 기존 컴포넌트를 spec에 맞춰 리팩토링
|
|
71
|
+
|
|
72
|
+
**목표**: 오래된 `Alert.tsx`를 design-ai spec에 맞게 끌어올리기.
|
|
73
|
+
|
|
74
|
+
### 세션
|
|
75
|
+
|
|
76
|
+
```
|
|
77
|
+
$ aider src/components/Alert.tsx \
|
|
78
|
+
--read ~/dev/design-ai/examples/component-alert.md \
|
|
79
|
+
--read ~/dev/design-ai/knowledge/a11y/contrast.md
|
|
80
|
+
|
|
81
|
+
> 두 파일 다 읽어 주세요. Alert.tsx를 spec에 맞추기 위해 필요한 구체적
|
|
82
|
+
diff 나열. 그리고 적용해 주세요.
|
|
83
|
+
|
|
84
|
+
[Aider가 읽고 5개 diff 나열, 각 적용 요청]
|
|
85
|
+
|
|
86
|
+
> 1, 3, 5만 적용. 2와 4는 건너뛰기 (제품 승인 필요).
|
|
87
|
+
|
|
88
|
+
[Aider가 부분 적용]
|
|
89
|
+
```
|
|
90
|
+
|
|
91
|
+
Aider의 diff별 적용은 spec 컴플라이언스에 좋아요 — 크리티컬 수정은 받아들이고 주관적인 변경은 미룰 수 있어요.
|
|
92
|
+
|
|
93
|
+
## 워크스루 3: 완전한 디자인 시스템 생성
|
|
94
|
+
|
|
95
|
+
**목표**: 브리프에서 디자인 토큰 부트스트랩, 파일로 머터리얼라이즈.
|
|
96
|
+
|
|
97
|
+
### 세션
|
|
98
|
+
|
|
99
|
+
```
|
|
100
|
+
$ aider \
|
|
101
|
+
--read ~/dev/design-ai/skills/design-system-builder/PLAYBOOK.md \
|
|
102
|
+
--read ~/dev/design-ai/skills/color-palette/PLAYBOOK.md \
|
|
103
|
+
--read ~/dev/design-ai/knowledge/colors/color-theory.md \
|
|
104
|
+
--read ~/dev/design-ai/knowledge/i18n/korean-typography.md \
|
|
105
|
+
src/tokens/colors.css \
|
|
106
|
+
src/tokens/typography.css \
|
|
107
|
+
src/tokens/spacing.css \
|
|
108
|
+
tailwind.config.ts
|
|
109
|
+
|
|
110
|
+
> design-system-builder 적용. 브리프: 프리랜서를 위한 한국 핀테크.
|
|
111
|
+
브랜드: 신뢰감, 차분함, 모던. Seed: oklch(56% 0.16 244).
|
|
112
|
+
Pretendard 타이포그래피. 4개 열린 파일에 출력. colors.css
|
|
113
|
+
맨 위에 주석 블록으로 대비 매트릭스.
|
|
114
|
+
|
|
115
|
+
[Aider가 한 번의 적용 패스에서 4개 파일 모두 생성]
|
|
116
|
+
```
|
|
117
|
+
|
|
118
|
+
여러 파일 산출물의 경우, Aider의 "여러 파일을 한 번에 열기 + 원자적 diff 적용" 패턴이 순차적 단일 파일 생성보다 효율적이에요.
|
|
119
|
+
|
|
120
|
+
## 워크스루 4: 한 세션에서 감사 + 수정
|
|
121
|
+
|
|
122
|
+
**목표**: 화면을 a11y 감사하고, 수정 생성, 적용.
|
|
123
|
+
|
|
124
|
+
### 세션
|
|
125
|
+
|
|
126
|
+
```
|
|
127
|
+
$ aider \
|
|
128
|
+
--read ~/dev/design-ai/agents/a11y-reviewer.md \
|
|
129
|
+
--read ~/dev/design-ai/knowledge/a11y/contrast.md \
|
|
130
|
+
--read ~/dev/design-ai/knowledge/a11y/keyboard-and-focus.md \
|
|
131
|
+
src/screens/PricingScreen.tsx \
|
|
132
|
+
src/screens/PricingScreen.css
|
|
133
|
+
|
|
134
|
+
> PricingScreen을 a11y 감사. 발견사항을 CRITICAL / HIGH / MEDIUM / LOW
|
|
135
|
+
로 보고. 그리고 CRITICAL과 HIGH는 자동 수정.
|
|
136
|
+
|
|
137
|
+
[Aider가 감사하고 7개 발견사항 나열]
|
|
138
|
+
[CRITICAL/HIGH 4개 자동 수정]
|
|
139
|
+
[저우선 3개에 대해 질문]
|
|
140
|
+
|
|
141
|
+
> 일단 건너뛰기.
|
|
142
|
+
|
|
143
|
+
[Aider가 명확한 메시지로 수정 커밋]
|
|
144
|
+
```
|
|
145
|
+
|
|
146
|
+
## Aider 전용 패턴
|
|
147
|
+
|
|
148
|
+
### 읽기 전용 vs 편집 가능
|
|
149
|
+
|
|
150
|
+
```
|
|
151
|
+
aider [편집 가능 파일들] --read [읽기 전용 컨텍스트 파일들]
|
|
152
|
+
```
|
|
153
|
+
|
|
154
|
+
design-ai 파일은 항상 `--read` (Aider가 절대 수정 안 함). 프로젝트 파일은 편집 가능.
|
|
155
|
+
|
|
156
|
+
전형적인 세션:
|
|
157
|
+
- 1-3개 편집 대상 파일 (컴포넌트, CSS, 테스트)
|
|
158
|
+
- 5-15개 읽기 전용 design-ai 파일 (스킬 플레이북 + 관련 지식)
|
|
159
|
+
|
|
160
|
+
### 동적 컨텍스트의 `/add` and `/drop`
|
|
161
|
+
|
|
162
|
+
세션 중에:
|
|
163
|
+
|
|
164
|
+
```
|
|
165
|
+
> /add src/components/Button.tsx # 편집 가능에 추가
|
|
166
|
+
> /read ~/dev/design-ai/examples/component-button.md # 읽기 전용에 추가
|
|
167
|
+
> /drop src/components/Button.tsx # 세션에서 제거
|
|
168
|
+
```
|
|
169
|
+
|
|
170
|
+
작업 범위가 중간에 바뀔 때 유용.
|
|
171
|
+
|
|
172
|
+
### 복잡한 spec을 위한 Architect 모드
|
|
173
|
+
|
|
174
|
+
Aider의 `--architect` 모드는 계획에 강력한 모델, 편집에 빠른 모델 사용:
|
|
175
|
+
|
|
176
|
+
```bash
|
|
177
|
+
aider --architect \
|
|
178
|
+
--architect-model claude-opus-4 \
|
|
179
|
+
--editor-model claude-sonnet-4-6 \
|
|
180
|
+
--read ~/dev/design-ai/skills/design-system-builder/PLAYBOOK.md \
|
|
181
|
+
[files...]
|
|
182
|
+
```
|
|
183
|
+
|
|
184
|
+
Architect 모드가 spec을 계획; editor 모델이 적용. 큰 리팩토링에 좋음.
|
|
185
|
+
|
|
186
|
+
### 변경별 자동 커밋
|
|
187
|
+
|
|
188
|
+
Aider는 기본적으로 각 적용을 자동 커밋. design-ai 워크플로에서:
|
|
189
|
+
- Commit 1: "design-ai spec에 맞춰 Banner 컴포넌트 추가"
|
|
190
|
+
- Commit 2: "브리프에서 시맨틱 컬러 토큰 추가"
|
|
191
|
+
- Commit 3: "a11y 리뷰에 따라 CTA 대비를 WCAG AA로 수정"
|
|
192
|
+
|
|
193
|
+
각 커밋이 작게 범위 잡힘. 리뷰 / revert / cherry-pick 쉬움.
|
|
194
|
+
|
|
195
|
+
비활성화: `--no-auto-commits`.
|
|
196
|
+
|
|
197
|
+
### 테스트 모드
|
|
198
|
+
|
|
199
|
+
```bash
|
|
200
|
+
aider --test-cmd "pnpm test" --auto-test
|
|
201
|
+
```
|
|
202
|
+
|
|
203
|
+
Aider가 각 변경 후 테스트 명령 실행. 컴포넌트 구현 시 유용 — 구현 패스 중 회귀 catch.
|
|
204
|
+
|
|
205
|
+
## 팁
|
|
206
|
+
|
|
207
|
+
### design-ai PRINCIPLES를 시스템 리마인더로 사용
|
|
208
|
+
|
|
209
|
+
```bash
|
|
210
|
+
aider --read ~/dev/design-ai/knowledge/PRINCIPLES.md ...
|
|
211
|
+
```
|
|
212
|
+
|
|
213
|
+
해당 파일은 30개 핵심 규칙을 단일 페이지로 요약. 항상 로드; 저렴.
|
|
214
|
+
|
|
215
|
+
### 스킬별 alias
|
|
216
|
+
|
|
217
|
+
흔한 워크플로용 bash alias 추가:
|
|
218
|
+
|
|
219
|
+
```bash
|
|
220
|
+
# ~/.bashrc
|
|
221
|
+
alias aider-design='aider --read ~/dev/design-ai/AGENTS.md --read ~/dev/design-ai/knowledge/PRINCIPLES.md --model claude-sonnet-4-6'
|
|
222
|
+
alias aider-spec='aider-design --read ~/dev/design-ai/skills/component-spec-writer/PLAYBOOK.md'
|
|
223
|
+
alias aider-palette='aider-design --read ~/dev/design-ai/skills/color-palette/PLAYBOOK.md'
|
|
224
|
+
```
|
|
225
|
+
|
|
226
|
+
이후:
|
|
227
|
+
```bash
|
|
228
|
+
aider-spec src/components/NewComponent.tsx
|
|
229
|
+
```
|
|
230
|
+
|
|
231
|
+
### 한국어 기본값
|
|
232
|
+
|
|
233
|
+
```bash
|
|
234
|
+
aider --read ~/dev/design-ai/AGENTS.md \
|
|
235
|
+
--read ~/dev/design-ai/knowledge/i18n/korean-typography.md \
|
|
236
|
+
--read ~/dev/design-ai/knowledge/i18n/korean-document-style.md \
|
|
237
|
+
--read ~/dev/design-ai/knowledge/i18n/korean-product-conventions.md \
|
|
238
|
+
[files...]
|
|
239
|
+
```
|
|
240
|
+
|
|
241
|
+
한국 B2C 팀의 경우 위의 read를 `.aider.conf.yml`에 굽기.
|
|
242
|
+
|
|
243
|
+
## 문제 해결
|
|
244
|
+
|
|
245
|
+
### Aider가 큰 스킬에서 컨텍스트 한도에 부딪힘
|
|
246
|
+
|
|
247
|
+
Aider는 `--read` 파일을 매 턴 컨텍스트에 보내요. 매우 큰 플레이북 + 많은 지식 파일의 경우:
|
|
248
|
+
- 작업당 관련 항목만 `--read`.
|
|
249
|
+
- `/drop`으로 컨텍스트 비우기.
|
|
250
|
+
- 매우 큰 세션은 더 큰 컨텍스트 모델 사용 (Claude Sonnet 4.6 ≥ 200K 토큰, GPT-4o ~ 128K).
|
|
251
|
+
|
|
252
|
+
### 출력이 design-ai 컨벤션 무시
|
|
253
|
+
|
|
254
|
+
Aider에 명시적 리마인더 (세션 중간):
|
|
255
|
+
|
|
256
|
+
```
|
|
257
|
+
> 제가 드린 읽기 전용 파일의 design-ai 컨벤션을 따라:
|
|
258
|
+
destructive 변형 적용해 주세요.
|
|
259
|
+
```
|
|
260
|
+
|
|
261
|
+
또는 `AGENTS.md`가 `--read`로 로드되었는지 확인.
|
|
262
|
+
|
|
263
|
+
### 한국어 텍스트가 깨짐
|
|
264
|
+
|
|
265
|
+
Aider는 모든 주요 모델에서 한국어 작동. 한글이 `?`나 박스로 렌더링되면:
|
|
266
|
+
- 터미널이 UTF-8 지원하는지 확인 (대부분 지원, Windows cmd는 기본 아닐 수 있음).
|
|
267
|
+
- UTF-8 강제: `export PYTHONIOENCODING=utf-8`.
|
|
268
|
+
|
|
269
|
+
## 다음
|
|
270
|
+
|
|
271
|
+
- [`docs/AIDER-INTEGRATION.md`](../AIDER-INTEGRATION.md) — 전체 설치 레퍼런스
|
|
272
|
+
- [`docs/integrations/codex-walkthrough.ko.md`](codex-walkthrough.ko.md) — Codex CLI 변형
|
|
273
|
+
- [`docs/integrations/cursor-walkthrough.ko.md`](cursor-walkthrough.ko.md) — Cursor 변형
|
|
274
|
+
- [`docs/integrations/sdk-walkthrough.ko.md`](sdk-walkthrough.ko.md) — Anthropic / OpenAI SDK
|
|
275
|
+
- [`docs/integrations/vscode-walkthrough.ko.md`](vscode-walkthrough.ko.md) — VS Code 확장
|