Communitygithub.com

WangZetian-IVERSON/uiux-demo-skill

Habilidade de construção de portfólio UI/UX com IA. Um prompt → estudo de caso completo e rico em imagens. Funciona com Copilot, Claude Code, Codex. Pipeline Python baseado em configuração com revisão de qualidade automatizada.

O que é uiux-demo-skill?

Esta habilidade (skill) permite que agentes de IA, como Copilot, Claude Code e Codex, gerem automaticamente estudos de caso completos para portfólios de design UI/UX a partir de um único prompt. O usuário fornece uma descrição do projeto ou requisitos de design, e a habilidade coordena uma pipeline Python configurável para produzir um deck de portfólio rico em imagens. A pipeline inclui etapas automatizadas de revisão de qualidade, garantindo que o resultado final atenda a altos padrões visuais e de conteúdo. É ideal para designers freelancers, estudantes ou profissionais que desejam criar rapidamente apresentações impactantes de seus trabalhos sem esforço manual. A habilidade é totalmente baseada em configuração, o que significa que os parâmetros de saída (como estilo visual, número de slides, etc.) podem ser ajustados sem modificar o código principal.

Funciona com✓Claude Code✓Codex CLI~Cursor
npx skills add WangZetian-IVERSON/uiux-demo-skill

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

O que uiux-demo-skill faz?

Habilidade de construção de portfólio UI/UX com IA. Um prompt → estudo de caso completo e rico em imagens. Funciona com Copilot, Claude Code, Codex. Pipeline Python baseado em configuração com revisão de qualidade automatizada.

Instruções de uso:

  1. Forneça um prompt descrevendo seu projeto UI/UX (ex.: "Aplicativo de fitness com foco em gamificação").
  2. A habilidade automaticamente:
    • Gera o conteúdo do estudo de caso (problema, solução, processo).
    • Cria imagens mockup e diagramas de fluxo usando IA generativa.
    • Monta um deck de slides (formato PDF ou PPTX).
    • Aplica uma revisão de qualidade automatizada (verificando consistência visual, gramática e layout).
  3. O deck final é salvo no diretório de saída configurado.

Configuração:

Edite o arquivo config.yaml para personalizar:

  • output_format: "pdf" ou "pptx" (padrão: "pdf")
  • image_style: "moderno", "minimalista", "colorido"
  • quality_check: booleano (padrão: true)
  • slide_count: número de slides (padrão: 8)

Plataformas compatíveis:

  • Copilot
  • Claude Code
  • Codex

Dependências:

  • Python 3.10+
  • Bibliotecas: pillow, python-pptx, fpdf2, openai (para geração de imagens)

Exemplo de comando:

python build_portfolio.py --prompt "Redesign do site de comércio eletrônico com foco em acessibilidade"

Nota: Certifique-se de que as variáveis de ambiente OPENAI_API_KEY (ou similar) estejam configuradas para geração de imagens.


Esta habilidade foi projetada para ser executada em ambientes de agente de IA. Nenhuma modificação manual é necessária além da configuração inicial.

Habilidades Relacionadas