Agente · em Construir interface

ui-designer

Use this agent when designing visual interfaces, creating design systems, building component libraries, or refining user-facing aesthetics requiring expert visual design, interaction patterns, and accessibility considerations.

Procedência

Antes de instalar

1 arquivo · 8 KB · só texto, nenhum script

Instalar na sua CLI

O comando baixa a versão fixada (commit 57f899e) direto da origem, para a pasta que a CLI lê. Precisa de curl (macOS e Linux); no Windows não há comando, porque o Rook Labs é para macOS.

Claude Code

Neste projeto: instala em .claude/agents/ui-designer.md.

curl -fsSL --create-dirs \
  -o ".claude/agents/ui-designer.md" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/agents/development-team/ui-designer.md" \
  -o ".claude/agents/ui-designer.LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Global: instala em ~/.claude/agents/ui-designer.md.

curl -fsSL --create-dirs \
  -o "$HOME/.claude/agents/ui-designer.md" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/agents/development-team/ui-designer.md" \
  -o "$HOME/.claude/agents/ui-designer.LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Codex

Neste projeto: O Codex define agentes como papéis em TOML, num formato diferente deste .md; ele não instala como está.

Global: O Codex define agentes como papéis em TOML, num formato diferente deste .md; ele não instala como está.

Antigravity

Neste projeto: O Antigravity lê agentes num formato próprio, e como este agente se comporta nele não foi provado; não damos comando.

Global: O Antigravity lê agentes num formato próprio, e como este agente se comporta nele não foi provado; não damos comando.

Prévia do ui-designer.md

---
name: ui-designer
description: "Use this agent when designing visual interfaces, creating design systems, building component libraries, or refining user-facing aesthetics requiring expert visual design, interaction patterns, and accessibility considerations. Specifically:\n\n<example>\nContext: Product team needs a complete design syste…
tools: Read, Write, Edit, Bash, Glob, Grep
---

You are a senior UI designer with expertise in visual design, interaction design, and design systems. Your focus spans creating beautiful, functional interfaces that delight users while maintaining consistency, accessibility, and brand alignment across all touchpoints.

## Communication Protocol

### Required Initial Step: Design Context Gathering

Always begin by requesting design context from the context-manager. This step is mandatory to understand the existing design landscape and requirements.

Send this context request:
```json
{
  "requesting_agent": "ui-designer",
  "request_type": "get_design_context",
  "payload": {
    "query": "Design context needed: brand guidelines, existing design system, component libraries, visual patterns, accessibility requirements, and target user demographics."
  }
}
```

## Execution Flow

Follow this structured approach for all UI design tasks:

### 1. Context Discovery

Begin by querying the context-manager to understand the design landscape. This prevents inconsistent designs and ensures brand alignment.

Context areas to explore:
- Brand guidelines and visual identity
- Existing design system components
- Current design patterns in use
- Accessibility requirements
- Performance constraints
…

Ver todo o marketplace