Design & Media

peterbamuhigire Bundle

Use when auditing imagery, brand assets, UI screens, or AI product features for visual and product slop. Unlike ai-slop-typography-audit, this excludes type; written-copy slop routes to the digital-research engine.

peterbamuhigire Bundle

Use when defining or refreshing a distinctive visual identity across logo usage, colour, type, spacing, imagery, and applications. Unlike logo-and-wordmark-design, this owns the whole identity system; detailed palette and type construction route to specialist skills.

peterbamuhigire Bundle

Use when constructing or specifying a logo, wordmark, lockups, clear space, responsive marks, favicons, or app icons. Unlike brand-visual-identity, this owns mark geometry and reduction; strategy, palette, typography, and the broader system remain upstream.

peterbamuhigire Bundle

Use when configuring variable-font axes, optical sizing, numerals, or OpenType features after a face is chosen. Unlike font-selection-and-pairing, this implements type mechanics; embedding and licence work routes to font-embedding-and-licensing.

peterbamuhigire Bundle

Use when structuring current Figma files, variables, modes, auto-layout, component properties, Dev Mode, branches, or library publishing. Use design-tokens-and-naming for the platform-neutral token contract and design-handoff-and-dev-spec for delivery evidence.

peterbamuhigire Bundle

Use when defining reusable component anatomy, variants, states, slots, composition, APIs, or component documentation. Use design-tokens-and-naming for shared values and figma-and-tooling-workflow for tool-specific library operations.

peterbamuhigire Bundle

Use when designing or auditing an icon family, grid, keylines, stroke, terminals, metaphors, optical corrections, small-size fitting, naming, or export contract. Use illustration-style-and-systems for expressive scenes and component-library-architecture for icon-button behaviour.

peterbamuhigire Bundle

Use when sourcing, selecting, shooting, treating, cropping, or licensing photography and producing a photographic art-direction brief. Use ai-image-generation-art-direction for model generation controls and illustration-style-and-systems for drawn imagery.

peterbamuhigire Bundle

Use when a game needs visual pillars, shape language, colour scripting, character/world readability, cultural motif governance, 2D/3D cohesion, VFX hierarchy, an asset bible, style scalability, performance-aware art, or engine handoff. Use illustration-style-and-systems for non-game illustration sets.

peterbamuhigire Bundle

Use when defining, building, or auditing an illustration language, spot-art set, scene system, character rules, or ownable visual motif. Use photography-art-direction for photographs and iconography-system-design for reductive grid-bound glyphs.

peterbamuhigire Bundle

Use when turning an art-direction brief into generated imagery, prompts, negative constraints, reject gates, provenance notes, and post-processing instructions. Use photography-art-direction for sourced photos and visual-product-slop-audit for product-wide review.

nvidia-nemo Skill

Screenshot-driven visual development workflow using Playwright MCP. Use when implementing designs from mockups or Figma, building new UI components, or fixing visual bugs.

memi-design Bundle

Add or review DialKit controls when a React, Solid, Svelte, or Vue interface needs live tuning of animation, layout, color, typography, or component parameters.

memi-design Bundle

Foundational Figma canvas skill — structure, Auto Layout, variables, MCP tools, self-healing loop

memi-design Bundle

Figma sync workflow patterns — bidirectional design-code sync, conflict resolution, incremental updates, multi-file orchestration

memi-design Bundle

Audit Figma file for design system consistency, accessibility, token adoption, Code Connect coverage

memi-design Bundle

Orchestrate multiple Claude instances on Figma canvas with box widgets, coordinated handoffs, error recovery

memi-design Bundle

Apple's approach to interface design and fluid, physical motion, translated for the web. Use when building or reviewing gesture-driven UI, spring animations, drag/swipe/sheet interactions, momentum and interruptible transitions, translucent materials and depth, typography (optical sizing, tracking, leading), reduced-motion, or the design foundations (feedback, spatial consistency, restraint) behind Apple-style interfaces.

memi-design Bundle

Extract a public website's design system when a task needs evidence about its colors, typography, spacing, radii, shadows, components, or Tailwind tokens.

memi-design Bundle

Design system architecture and governance — token taxonomy, component APIs, versioning strategy, adoption metrics, multi-brand theming, and cross-platform consistency

memi-design Bundle

Route generation of Figma-aware repository rules to Figma's current official MCP workflow without reproducing upstream instructions. Use when AGENTS.md, CLAUDE.md, or client rules must reflect verified Figma and codebase conventions.

memi-design Bundle

Build interactive Figma prototypes with flows, transitions, and user journey mapping

memi-design Bundle

UX tenets and traps framework for code, Figma, screenshot, and Studio critique workflows.

memi-design Bundle

Route exact Figma Plugin API questions to current official typings and developer documentation without redistributing upstream reference material. Use when an implementation depends on verified node, variable, component, style, or editor API behavior.

memi-design Bundle

Select and classify interface components when planning a design system, mapping Figma to code, or checking component-library coverage.

memi-design Bundle

Route creation of a new Figma Design or FigJam file to Figma's current official MCP workflow without reproducing upstream instructions. Use when an authorized Figma integration must create a new file before another workflow begins.

memi-design Bundle

Figma web capture workflow - import live webpages or DOM elements into editable Figma layers with the public html-to-design capture.js bookmarklet

memi-design Bundle

Route a Figma Code Connect request to Figma's current official workflow and documentation without reproducing upstream instructions. Use when mapping published Figma components to code implementations requires the official Figma MCP integration.

memi-design Bundle

Design token architecture — multi-tier token systems, semantic naming, theme switching, CSS custom properties, Tailwind mapping, and Figma variable sync

memi-design Bundle

Docker-aware Mémoire operation — CI/CD headless pipelines, shared MCP server, agent worker containers, and Figma bridge port-forwarding for containerized setups

memi-design Bundle

Route Figma-specific component, variable, style, and library questions to Figma's current official design-system guidance without reproducing upstream material. Use as a reference when exact Figma behavior matters.

memi-design Bundle

Create new Figma screens and pages using existing components, variables, and design system

memi-design Bundle

Route a Figma library build to Figma's current official MCP workflow and this repository's portable design-system skills without reproducing upstream instructions. Use when creating tokens, components, documentation, and code mappings in Figma.

memi-design Bundle

Generate Figma component library from React/shadcn codebase with Code Connect parity

memi-design Bundle

Route Figma-to-code implementation to Figma's current official MCP workflow while preserving repository conventions and independent verification. Use when a supplied Figma selection must become production code.

memi-design Bundle

Set up and operate Mémoire's CLI, MCP server, agent kits, design preflight, UX audits, craft checks, tokens, and registry evidence. Use when a repository explicitly needs Mémoire tooling; use portable design skills when Mémoire is unavailable.