Communitygithub.com

AuGa7/unify-ui-pages-skill

Codex-Fähigkeit zum Extrahieren von UI-Designspezifikationen und Angleichen von Unterseiten an eine anspruchsvolle Hauptschnittstelle.

Was ist unify-ui-pages-skill?

Diese Codex-Fähigkeit wurde entwickelt, um UI-Designspezifikationen aus einer polierten Hauptschnittstelle zu extrahieren und diese Designelemente konsistent auf Unterseiten anzuwenden. Sie ist speziell für Entwickler und KI-Agenten konzipiert, die mit Code-Editoren wie Codex zusammenarbeiten. Die Fähigkeit automatisiert den Prozess, visuelle Details wie Farben, Abstände, Typografie und Komponentenstile zu analysieren und daraus einheitliche Spezifikationen zu generieren. Dadurch wird sichergestellt, dass Unterseiten visuell perfekt an die Hauptschnittstelle angeglichen werden, ohne manuelle Nacharbeit. Dies spart Zeit, reduziert Inkonsistenzen und verbessert die Qualität der Benutzeroberfläche. Die Fähigkeit unterstützt gängige Frontend-Technologien und Frameworks.

Funktioniert mit~Claude Code✓Codex CLI~Cursor
Part ofDesign & UI
npx skills add AuGa7/unify-ui-pages-skill
Original anzeigen→Alle Skills durchsuchen

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

Dokumentation

Was macht unify-ui-pages-skill?

Codex-Fähigkeit zum Extrahieren von UI-Designspezifikationen und Angleichen von Unterseiten an eine anspruchsvolle Hauptschnittstelle.

Beschreibung

Diese Fähigkeit extrahiert automatisch UI-Designspezifikationen aus einer bestehenden Hauptschnittstelle (z. B. einem Startbildschirm oder Dashboard) und wendet diese Spezifikationen auf Unterseiten an. Sie analysiert visuelle Attribute wie Farben, Abstände, Schriftarten und Komponentenstile, um konsistente Designrichtlinien zu generieren.

Verwendung

  1. Stelle sicher, dass der Haupt-UI-Design (z. B. main_screen.tsx) im Arbeitsbereich verfügbar ist.
  2. Führe den Befehl @unify-ui-pages-skill im Chat von Codex aus.
  3. Gib den Pfad zur Hauptschnittstelle und den Ziel-Unterseiten an.
  4. Die Fähigkeit erstellt einen Bericht mit Designunterschieden und schlägt Änderungen vor.

Anforderungen

  • Codex oder ein kompatibler KI-Code-Editor.
  • Zugriff auf die Quelldateien der UI-Komponenten.
  • Grundkenntnisse in React oder einem ähnlichen Frontend-Framework.

Unterstützte Plattformen

  • Codex (primär)
  • Claude Code (experimentell)
  • Cursor (mit Einschränkungen)

Lizenz

MIT

Verwandte Skills

steipete/sag

ElevenLabs text-to-speech with mac-style say UX.

community

steipete/oracle

Oracle CLI second-model review/debug/refactor/design with selected files, dry-run token checks, API or browser engine.

community

steipete/peekaboo

Capture and automate macOS UI with the Peekaboo CLI.

community

mattpocock/design-an-interface

Generate multiple radically different interface designs for a module using parallel sub-agents. Use when user wants to design an API, explore interface options, compare module shapes, or mentions "design it twice".

community

mattpocock/prototype

Build a throwaway prototype to flesh out a design — a runnable terminal app for state/business-logic questions, or several radically different UI variations toggleable from one route.

community

mattpocock/grill-me

Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, or mentions "grill me".

community