Yagami38

Designing In Figma — Design skill for Claude Code

Design community

Skill Claude Code : méthode de conception de sites et d'apps dans Figma (plan gratuit) via le MCP Figma.

How to install Designing In Figma

This entry records only its repository, not the path inside it, so there is no exact command to give. Open Yagami38/designing-in-figma and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Designing In Figma does

Skill Claude Code : méthode de conception de sites et d'apps dans Figma (plan gratuit) via le MCP Figma.

Alternatives in Design

Plannotator — Interactive plan review UI for Claude Code with visual annotation, offline sharing, and Obsidian/Bear integrat 3.3k ★
Claude Code Plugins (jeremylongshore) — Marketplace-style repo bundling instruction-template plugins and MCP plugin packs, with install docs 1.7k ★
App Onboarding Questionnaire — A Claude Code skill that designs and builds high-converting questionnaire-style app onboarding flows — modelle 751 ★

README

designing-in-figma

A skill for Claude Code that encodes a method for designing websites and apps in Figma through the Figma MCP server: scoping questions, a moodboard analyzed and validated choice by choice, a minimalist variable-based UI kit, components with all their states, and a first mockup validated before the other pages are derived. It is written for Figma's **free plan** (three pages per file, one mode per collection, no team library).

The skill asks the user which language to use for page, variable and component names, and applies it consistently across the file.

Requirements

Claude Code with the Figma connector enabled (the claude.ai Figma MCP server).
A Figma account, free or paid plan.

Installation

For every project on the machine:

git clone https://github.com/Yagami38/designing-in-figma.git ~/.claude/skills/designing-in-figma

For a single project, from its root:

git clone https://github.com/Yagami38/designing-in-figma.git .claude/skills/designing-in-figma

Update with `git pull` inside the folder. Claude Code loads the skill as soon as a conversation is about designing in Figma; it can also be invoked with `/designing-in-figma`.

What the repository contains

File	Content
`SKILL.md`	the method: free-plan constraints, the three validation gates, scoping, the five phases, the non-negotiable rules, the rationalizations to recognize, the mandatory checklist before every gate
`references/setup.md`	existing or new file