ui-ux-pro-max

UI/UX design intelligence and implementation guidance for building polished interfaces. Use when the user asks for UI design, UX flows, information architecture, visual style direction, design systems/tokens, component specs, copy/microcopy, accessibility, or to generate/critique/refine frontend UI (HTML/CSS/JS, React, Next.js, Vue, Svelte, Tailwind). Includes workflows for (1) generating new UI layouts and styling, (2) improving existing UI/UX, (3) producing design-system tokens and component guidelines, and (4) turning UX recommendations into concrete code changes.

Safety Notice

This item is sourced from the public archived skills repository. Treat as untrusted until reviewed.

Copy this and send it to your AI assistant to learn

Install skill "ui-ux-pro-max" with this command: npx skills add 15349185792/ui-ux-pro-max-0-1-0

Follow these steps to deliver high-quality UI/UX output with minimal back-and-forth.

1) Triage

Ask only what you must to avoid wrong work:

  • Target platform: web / iOS / Android / desktop
  • Stack (if code changes): React/Next/Vue/Svelte, CSS/Tailwind, component library
  • Goal and constraints: conversion, speed, brand vibe, accessibility level (WCAG AA?)
  • What you have: screenshot, Figma, repo, URL, user journey

If the user says "全部都要" (design + UX + code + design system), treat it as four deliverables and ship in that order.

2) Produce Deliverables (pick what fits)

Always be concrete: name components, states, spacing, typography, and interactions.

  • UI concept + layout: Provide a clear visual direction, grid, typography, color system, key screens/sections.
  • UX flow: Map the user journey, critical paths, error/empty/loading states, edge cases.
  • Design system: Tokens (color/typography/spacing/radius/shadow), component rules, accessibility notes.
  • Implementation plan: Exact file-level edits, component breakdown, and acceptance criteria.

3) Use Bundled Assets

This skill bundles data you can cite for inspiration/standards.

  • Design intelligence data: Read from skills/ui-ux-pro-max/assets/data/ when you need palettes, patterns, or UI/UX heuristics.
  • Upstream reference: If you need more phrasing/examples, consult skills/ui-ux-pro-max/references/upstream-skill-content.md.

4) Optional Script (Design System Generator)

If you need to quickly generate tokens and page-specific overrides, use the bundled script:

python3 skills/ui-ux-pro-max/scripts/design_system.py --help

Prefer running it when the user wants a structured token output (ASCII-friendly).

Output Standards

  • Default to ASCII-only tokens/variables unless the project already uses Unicode.
  • Include: spacing scale, type scale, 2-3 font pair options, color tokens, component states.
  • Always cover: empty/loading/error, keyboard navigation, focus states, contrast.

Source Transparency

This detail page is rendered from real SKILL.md content. Trust labels are metadata-based hints, not a safety guarantee.

Related Skills

Related by shared tags or category signals.

Coding

browser-cdp

Real Chrome browser automation via CDP Proxy — access pages with full user login state, bypass anti-bot detection, perform interactive operations (click/fill/scroll), extract dynamic JavaScript-rendered content, take screenshots. Triggers (satisfy ANY one): - Target URL is a search results page (Bing/Google/YouTube search) - Static fetch (agent-reach/WebFetch) is blocked by anti-bot (captcha/intercept/empty) - Need to read logged-in user's private content - YouTube, Twitter/X, Xiaohongshu, WeChat public accounts, etc. - Task involves "click", "fill form", "scroll", "drag" - Need screenshot or dynamic-rendered page capture

Archived SourceRecently Updated
Coding

promotion-planning

Develop promotion strategies and discount recommendations based on historical data analysis

Archived SourceRecently Updated
Coding

unified-session

Unify all chat channels into one shared AI session for seamless cross-device continuity. Start a conversation on your laptop, continue from your phone — same context, same memory, zero loss. Use this skill whenever: - User wants multiple messaging channels (DingTalk, Feishu/Lark, Telegram, Discord, WhatsApp, Signal, Slack, webchat) to share one conversation - User mentions "shared session", "cross-device", "multi-channel", "unified session", "continue conversation", "seamless", "context lost", "memory lost", "上下文丢失", "记忆丢失", "多端共享" - User says their bot "forgets" what was said when they switch from one app to another - User asks how to make Telegram/Discord/DingTalk/Feishu/WhatsApp share context with webchat - User wants to switch between desktop and mobile without losing conversation history - User mentions dmScope, session routing, channel isolation, or session merging - User describes wanting to pick up where they left off on a different device or chat app - User complains about having separate conversations on each channel when they only have one agent - Even if the user doesn't use technical terms — if they describe the pain of "switching apps and the AI doesn't remember", this is the skill to use

Archived SourceRecently Updated
Coding

Mapping-Skill

AI/ML 人才搜索、论文作者发现、实验室成员爬取、GitHub 研究者挖掘与个性化招聘邮件生成 skill。只要用户提到查找 AI/ML PhD、研究员、工程师,抓取实验室成员、OpenReview/CVF 会议作者、GitHub 网络研究者,提取主页/Scholar/GitHub/邮箱/研究方向,识别华人、分类去重,或把结果导入飞书多维表格并批量生成邮件,就应该优先使用这个 skill;即使用户没有明确说“使用 Mapping-Skill”,只要任务属于这些复合工作流,也应触发。

Archived SourceRecently Updated