AI Skills.

AI Skills › Design设计設計デザイン › ui-ux-pro-max-skill

ui-ux-pro-max-skill

by nextlevelbuilder · Design skill作者:nextlevelbuilder · 设计技能作者:nextlevelbuilder · 設計技能作者:nextlevelbuilder · デザインスキル

An AI skill that provides design intelligence for building professional UI/UX across multiple platforms. Its v2.0 Design System Generator draws on 79 searchable UI styles, 192 palettes, 74 font pairings, and 192 industry reasoning rules to produce polished interfaces instead of generic layouts. It works with Claude Code and other major coding agents.为多平台构建专业 UI/UX 提供设计智能的 AI 技能。其 v2.0 设计系统生成器基于 79 种可检索 UI 风格、192 套配色、74 组字体搭配和 192 条行业推理规则,产出精致的界面而不是通用布局。支持 Claude Code 及其他主流编码智能体。為多平台建構專業 UI/UX 提供設計智慧的 AI 技能。其 v2.0 設計系統產生器基於 79 種可檢索 UI 風格、192 套配色、74 組字體搭配和 192 條產業推理規則,產出精緻的介面而不是通用版面。支援 Claude Code 及其他主流編碼智慧體。複数プラットフォームでプロ仕様の UI/UX を構築するためのデザインインテリジェンスを提供する AI スキル。v2.0 Design System Generator は、検索可能な UI スタイル 79 種、パレット 192 種、フォントの組み合わせ 74 組、業界推論ルール 192 件を活用し、汎用的なレイアウトではなく磨き上げたインターフェースを生み出す。Claude Code やその他の主要なコーディングエージェントで使える。

Quick start快速上手快速上手クイックスタート

What it does

UI UX Pro Max is an AI skill that provides design intelligence for building professional UI and UX across multiple platforms and frameworks. Its v2.0 flagship is the Design System Generator, an AI-powered reasoning engine that analyzes project requirements and generates a complete, tailored design system.

How it works

Generation starts from a user request, then runs five parallel searches: product types across 192 categories, styles from 79 searchable styles, palettes from 192 palettes, landing patterns from 34 patterns, and typography from 74 font combinations. A reasoning engine matches product to category rules, applies style priorities with BM25 ranking, and filters industry anti-patterns, before outputting pattern, style, colors, typography, effects, anti-patterns, and a checklist.

How to use it

  • After installing the skill, describe the product in plain language, for example asking for a landing page for a beauty spa.
  • Read the generated design system as a whole: recommended pattern, conversion approach, call-to-action placement, sections, style, colors, typography, key effects, and items to avoid.
  • Work through the pre-delivery checklist before shipping, including contrast, visible focus states, reduced-motion support, and responsive checks.

Key points

  • The catalog lists 79 searchable UI styles with 50 active, plus 119 UX guidelines and 22 tech stacks.
  • The example output warns against bright neon colors, harsh animations, dark mode, and AI purple and pink gradients for that wellness case, showing that anti-patterns are industry-specific, not universal.
  • No install command is given in the README excerpt used here, so install through the repo itself rather than guessing a command.

它是做什么的

UI UX Pro Max 是一款 AI 技能,为跨平台和框架构建专业 UI 和 UX 提供设计智能。其 v2.0 的旗舰功能是设计系统生成器,这是一个 AI 驱动的推理引擎,能分析项目需求并生成完整且贴合的设计系统。

它怎么工作

生成从用户请求开始,随后并行执行五类搜索:覆盖 192 个品类的产品类型匹配、79 种可搜索风格中的风格推荐、192 套配色中的调色选择、34 种落地页模式,以及 74 组字体搭配。推理引擎再把产品匹配到 UI 品类规则,用 BM25 排序应用风格优先级,过滤行业反模式并处理决策规则,最后输出模式、风格、颜色、字体、动效、反模式和交付前检查清单。

怎么用

  • 安装技能后,用日常语言描述产品,例如请它为美容水疗中心做一个落地页。
  • 整体阅读生成的设计系统:推荐模式、转化思路、行动号召位置、版块、风格、颜色、字体、关键动效和应避免的项。
  • 发布前逐项过交付前检查清单,包括对比度、可见焦点状态、对减动效的支持和响应式检查。

关键要点

  • 目录列出 79 种可搜索 UI 风格,其中 50 种为启用状态,另有 119 条 UX 指南和 22 个技术栈。
  • 示例输出针对该健康类案例排除了亮霓虹色、 强烈动效、深色模式和 AI 紫粉渐变,说明反模式是分行业的,不是通用的。
  • 此处使用的 README 摘录未给出安装命令,因此请通过仓库本身安装,不要猜测命令。

它是做什麼的

UI UX Pro Max 是一款 AI 技能,為跨平台與框架建構專業 UI 與 UX 提供設計智慧。其 v2.0 的旗艦功能是設計系統產生器,這是一個 AI 驅動的推理引擎,能分析專案需求並產生完整且貼合的設計系統。

它怎麼運作

產生從使用者請求開始,隨後平行執行五類搜尋:涵蓋 192 個品類的產品類型比對、79 種可搜尋風格中的風格推薦、192 套配色中的調色選擇、34 種到達頁模式,以及 74 組字體搭配。推理引擎再把產品比對到 UI 品類規則,用 BM25 排序套用風格優先順序,過濾產業反模式並處理決策規則,最後輸出模式、風格、顏色、字體、動效、反模式與交付前檢查清單。

怎麼用

  • 安裝技能後,用日常語言描述產品,例如請它為美容水療中心做一個到達頁。
  • 整體閱讀產生的設計系統:推薦模式、轉換思路、行動呼籲位置、版塊、風格、顏色、字體、關鍵動效與應避免的項目。
  • 發布前逐項通過交付前檢查清單,包括對比度、可見焦點狀態、對減少動效的支援與響應式檢查。

關鍵要點

  • 目錄列出 79 種可搜尋 UI 風格,其中 50 種為啟用狀態,另有 119 條 UX 指南與 22 個技術堆疊。
  • 範例輸出針對該健康類案例排除了亮霓虹色、強烈動效、深色模式與 AI 紫粉漸層,說明反模式是分產業的,不是通用的。
  • 此處使用的 README 摘錄未給出安裝指令,因此請透過專案本身安裝,不要猜測指令。

何をするのか

UI UX Pro Max は、複数のプラットフォームとフレームワークでプロの UI と UX を作るためのデザイン知能を提供する AI スキルだ。v2.0 の目玉は Design System Generator で、プロジェクト要件を分析して完全で用途に合わせたデザインシステムを生成する AI 駆動の推論エンジンだ。

仕組み

生成はユーザーリクエストから始まり、5 つの並列検索を行う。192 カテゴリの製品タイプ照合、79 の検索可能なスタイルからのスタイル推薦、192 パレットからのカラーパレット選択、34 パターンからのランディングページパターン、74 通りのフォント組み合わせからのタイポグラフィ搭配だ。推論エンジンは製品を UI カテゴリルールへ照合し、BM25 ランキングでスタイル優先度を適用し、業界のアンチパターンを除去し、決定ルールを処理する。その後、パターン、スタイル、色、タイポグラフィ、エフェクト、アンチパターン、出荷前チェックリストを出力する。

使い方

  • スキルをインストールした後、製品を日常言語で説明する。例は美容スパのランディングページの依頼だ。
  • 生成されたデザインシステムは全体で読む。推奨パターン、コンバージョンの考え方、CTA の配置、セクション、スタイル、色、タイポグラフィ、主要エフェクト、避けるべき項目だ。
  • 出荷前に出荷前チェックリストを通す。コントラスト、見えるフォーカス状態、モーション削減への対応、レスポンシブ確認を含む。

押さえておきたい点

  • カタログは 79 の検索可能な UI スタイルを含み、うち 50 が有効で、さらに 119 の UX ガイドラインと 22 の技術スタックがある。
  • 例の出力は、そのウェルネス事例に対して明るいネオン色、激しいアニメーション、ダークモード、AI 紫ピンクのグラデーションを避けるよう示す。アンチパターンは業界固有で、普遍ではない。
  • ここで使った README 抜粋にインストールコマンドは無いため、コマンドを推測せずリポジトリ経由でインストールする。

Supported platforms支持的平台支援的平台対応プラットフォーム

Claude CodeCursorWindsurfAntigravityGitHub CopilotKiroQoderRoocodeGemini CLIOpenCodeContinueCodebuddyDroidKilocodeWarpAugmentCodewhaleZcodeKimi CodeAmazon QOpenClawCodexGeneric

Notes备注備註備考

v2.0 Design System Generator, 79 searchable UI styles (50 active), 192 palettes, 74 font pairings, 192 industry reasoning rules.v2.0 设计系统生成器、79 种可检索 UI 风格(50 种启用)、192 套配色、74 组字体搭配、192 条行业推理规则。v2.0 設計系統產生器、79 種可檢索 UI 風格(50 種啟用)、192 套配色、74 組字體搭配、192 條產業推理規則。v2.0 Design System Generator、検索可能な UI スタイル 79 種(50 種が有効)、パレット 192 種、フォントの組み合わせ 74 組、業界推論ルール 192 件。

More Design skills更多设计技能更多設計技能その他のデザインスキル

View all →查看全部 →查看全部 →すべて見る →

A curated collection of DESIGN.md analyses of popular brand design systems — 70+ real-brand systems including Claude, Apple, Stripe, and Linear. Drop one file into your project and let your coding agent generate a UI that matches that brand's look. The DESIGN.md concept comes from Google Stitch, and the collection keeps growing.知名品牌设计系统的 DESIGN.md 分析合集,已收录 70 多个真实品牌系统,包括 Claude、Apple、Stripe、Linear 等。把其中一个文件放进项目,编码智能体就能生成与该品牌风格一致的界面。DESIGN.md 这个概念来自 Google Stitch,合集还在持续增长。知名品牌設計系統的 DESIGN.md 分析合集,已收錄 70 多個真實品牌系統,包括 Claude、Apple、Stripe、Linear 等。把其中一個檔案放進專案,編碼智慧體就能生成與該品牌風格一致的介面。DESIGN.md 這個概念來自 Google Stitch,合集還在持續增長。人気ブランドのデザインシステムを DESIGN.md として分析したキュレーション集。Claude、Apple、Stripe、Linear など 70 以上の実在ブランドのシステムを収録する。ファイルを 1 つプロジェクトに置くだけで、コーディングエージェントがそのブランドの見た目に合った UI を生成する。DESIGN.md の概念は Google Stitch 由来で、コレクションは増え続けている。

Design设计設計デザインGeneric
Copy a DESIGN.md file into your project root (no installer; file-drop usage)

Agent skills that give coding agents taste: art direction, reference images, and a browser check instead of generic AI pages. Rather than accepting the first generic layout, the skill pushes the agent to pick a direction, ground it in references, and verify the result in a real browser. Version 2 holds a single skill, design-taste-frontend; older skills moved to taste-skill-classics and imagegen-skills.给编码智能体品味的智能体技能:艺术指导、参考图和浏览器检查,而不是千篇一律的 AI 页面。它不让智能体接受第一个通用布局,而是推动智能体选定方向、用参考图 grounding,并在真实浏览器里验证结果。v2 只有一个技能 design-taste-frontend,旧技能已移到 taste-skill-classics 和 imagegen-skills。給編碼智慧體品味的智慧體技能:藝術指導、參考圖和瀏覽器檢查,而不是千篇一律的 AI 頁面。它不讓智慧體接受第一個通用版面,而是推動智慧體選定方向、用參考圖 grounding,並在真實瀏覽器裡驗證結果。v2 只有一個技能 design-taste-frontend,舊技能已移到 taste-skill-classics 和 imagegen-skills。コーディングエージェントにセンスを与えるスキル。アートディレクション、リファレンス画像、ブラウザチェックによって、汎用的な AI ページを避ける。最初に出た汎用レイアウトを受け入れるのではなく、方向を選び、リファレンスに根付かせ、実際のブラウザで結果を検証するようエージェントを促す。バージョン 2 は design-taste-frontend の 1 件のみで、旧スキルは taste-skill-classics と imagegen-skills に移った。

Design设计設計デザインClaude CodeCodexGeneric
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"

The design vocabulary for your coding agent: steer with polish and bolder, review with critique and audit, and catch AI slop before it ships. It gives agents a shared language for visual quality instead of vague 'make it nicer' prompts, and ships a CLI detector for checking work outside the agent. It works with Claude Code, Cursor, Codex, Copilot, and many other coding tools.给编码智能体的设计词汇表:用 polish 和 bolder 引导方向,用 critique 和 audit 做评审,在 AI 味设计上线之前就把它拦下来。它让智能体拥有关于视觉质量的共同语言,而不是含糊的“做得好看点”,还附带一个 CLI 检测器,可以在智能体之外检查成果。支持 Claude Code、Cursor、Codex、Copilot 等众多编码工具。給編碼智慧體的設計詞彙表:用 polish 和 bolder 引導方向,用 critique 和 audit 做審查,在 AI 味設計上線之前就把它攔下來。它讓智慧體擁有關於視覺品質的共同語言,而不是含糊的「做得好看點」,還附帶一個 CLI 檢測器,可以在智慧體之外檢查成果。支援 Claude Code、Cursor、Codex、Copilot 等眾多編碼工具。コーディングエージェントのためのデザインボキャブラリー。polish と bolder で方向付けし、critique と audit でレビューし、AI 臭さが出荷される前に食い止める。曖昧な「もっときれいに」ではなく、視覚品質についての共通言語をエージェントに与え、エージェント外で確認できる CLI 検出ツールも付属する。Claude Code、Cursor、Codex、Copilot など多数のツールに対応する。

Design设计設計デザインClaude CodeCursorCodexGitHub Copilot+15 more+15 个更多+15 個更多+15 件
npx impeccable install