Memi Design Tooling

Enrichit les agents de codage avec des preuves de conception d'interface, des audits de systèmes de design et la génération de design-to-code pour Grok Build.

déclencheurs:UI designinterface understandingUX auditsdesign systemsdesign-to-code

GitHub SKILL.md

Ce qu'il fait

Fournit aux agents de codage des preuves d'interface spécifiques au dépôt et un contexte de design avant qu'ils n'effectuent des modifications front-end majeures. Cela permet aux agents de réaliser des audits UX et de vérifier l'adhésion au système de design sans nécessiter de connexions ou de comptes Figma manuels.

Quand l'utiliser

Activez cette compétence lorsqu'une tâche implique la conception d'interface utilisateur, la compréhension de l'interface, le travail avec des systèmes de design (comme shadcn/ui ou Tailwind), la réalisation d'audits UX ou la génération de code à partir de spécifications de design.

Ce qui est inclus

Instructions : Fournit un flux de travail pour utiliser le @memi-design/cli afin de briefer les agents et de diagnostiquer les problèmes d'interface.
Processus : Met l'accent sur l'utilisation des niveaux d'Atomic Design, des jetons sémantiques et la vérification des routes rendues.

Agents compatibles

Principalement conçu pour Grok Build / les agents basés sur Grok, mais applicable à tout agent de codage capable d'exécuter des commandes NPX.

Étiquettes

#ui-design #ux-audit #design-systems #shadcn #tailwind #grok-build #frontend #design-to-code

Pas encore audité

Cette compétence n'a pas encore été examinée par notre pipeline d'audit automatisé.

Informations

Dépôt: memi
Étoiles: 37

Compétences similaires

Clerk Vue Patterns

Vue 3 integration patterns for Clerk: composables, router guards, and Pinia auth store integration.

React Development Expert

Provides authoritative React guidance on hooks, state patterns, Server Components, performance optimization, and common architectural patterns.

ClearShot — Screenshot UI Analysis

Structured UI screenshot analysis using a 5×5 spatial grid, full element inventory, and design system extraction. Escalates to full implementation blueprint whe

Colorize — Strategic UI Color Introduction

Introduce purposeful color to monochromatic interfaces to improve hierarchy, meaning, and visual engagement while preserving accessibility.

DAUB UI

A drop-in CSS+JS component library with 70+ carefully designed components and 20 theme families for fast, consistent UI building.

dotLottie Web

Guidelines and patterns for implementing performant dotLottie/Lottie animations on the web (vanilla JS and React), including workers, state machines, and themin

React Context Setup

Automates guidance and code patterns for setting up React Context, providing step-by-step configuration and best-practice examples for frontend projects.

Angular Migration

Guides developers through migrating AngularJS (1.x) apps to modern Angular (2+), with hybrid ngUpgrade approaches, component/service conversions, DI strategies,

Retour aux compétences