본문으로 건너뛰기
cccskills
무료GitHub에 공개

figma-shot-board

Place a set of local screenshots/images into Figma as a labeled, sectioned board (auto-layout, title + section rows, layer names = filenames) using the Figma MCP (upload_assets + use_figma). Works against a new file or an existing file/page, and encodes the non-obvious upload gotchas (default 400x300 FILL frames, first-page placement, natural-size resize, 2x capture scaling). Use when the user wants screenshots arranged in Figma, UI states delivered as a Figma page, or images moved/relocated between Figma files. Triggers: "figma-shot-board", "/figma-shot-board", "figma shot board", "スクショをFigmaに並べて", "FigmaにUIステートを起こして", "スクショをFigmaに起こして", "screenshots to figma", "figma board of screenshots", "put these images in figma", "Figmaに画像を配置".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

hideki5123/agent-skill-set
연동 도구Figma

실행 점수 미검증

설치 방법 보기

포함된 파일(3)

  • SKILL.md5.8 KB
  • references/scenarios.feature1.6 KB
  • scripts/post_uploads.sh635 B

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

figma-shot-board — screenshots → labeled Figma board

Turn N local images into one tidy Figma page: header (title + subtitle) and labeled sections, each a horizontal row of image frames at their natural size.

Inputs to establish first

  • Image files, their order, and a section grouping (section label → files).
  • Scale divisor: captures taken at deviceScaleFactor: 2 should be placed at natural size ÷ 2 (logical 1x). Default divisor 2 for playwright 2x captures, 1 for plain images.
  • Target: an existing Figma file URL (extract fileKey), or a new file (needs plan/team choice — whoami lists plans; ask if multiple).
  • Page: new page name (recommended; never disturb existing pages) or an existing page node-id.

Workflow

  1. Preflight: call whoami (auth check + plan keys; also the tool to cite when rate-limited). MANDATORY prerequisite skills: load figma-create-new-file before any create_new_file call, and figma-use before any use_figma call.
  2. Target file/page: for a new file use create_new_file (lands in drafts — tell the user it can be dragged into a project). For a page inside a design file use use_figma with figma.createPage() (design files only).
  3. Get upload URLs: upload_assets(fileKey, count=N) → N single-use submit URLs (expire in 10 min — upload promptly).
  4. POST the files with scripts/post_uploads.sh (multipart file field — the filename becomes the Figma layer name, so name files descriptively before uploading). Keep URL↔file order aligned.
  5. Fix placement (the big gotchas) via one use_figma call:
    • Uploaded frames land on the first/current page as 400×300 frames with the image as a FILL (cropped!) — NOT at natural size.
    • For each frame: read fills → figma.getImageByHash(fill.imageHash) → await img.getSizeAsync() → frame.resize(w/divisor, h/divisor).
    • Move to the target page with targetPage.appendChild(frame) (works across pages; collect frames from whatever page they landed on).
  6. Build the board (respect ~10 ops per use_figma call — split into 2-3 calls): root figma.createAutoLayout('VERTICAL', {itemSpacing: 56, padding…}) with a light fill, positioned away from (0,0); header (title 28 Semi Bold + subtitle 14 gray); per section a VERTICAL auto-layout (label 18 Semi Bold + HORIZONTAL row, counterAxisAlignItems: 'MIN', itemSpacing 24) and row.appendChild(frame) for its images. Font loads first (Inter styles are Semi Bold, not SemiBold).
  7. Verify: await root.screenshot() in the last call and eyeball it. Return the page URL: https://www.figma.com/design/<fileKey>/<name>?node-id=<pageId with ':'→'-'>.
  8. Relocation ("move this board to file X"): rebuild in the target file (repeat 3-7 — image hashes are per-file, re-upload is required), then mark the old page/file clearly (rename to "MOVED → …"); the MCP cannot delete files — tell the user to delete the old draft.

Gotcha table

SymptomCause / fix
All frames 400×300, images croppedDefault placement is FILL on a fixed frame — resize to getSizeAsync() ÷ divisor
Frames on the wrong pageUploads land on the current/first page — targetPage.appendChild() them
Blurry at 100%2x captures placed at pixel size — divide by 2
Layer named "image"POSTed raw bytes — use multipart file field so the filename is used
Upload URL 4xxSingle-use / expired (10 min) — request fresh URLs with upload_assets
figma.createPage throwsFigJam/Slides file — pages are design-file only
Font error "SemiBold"Inter style strings contain a space: Semi Bold

References

  • references/scenarios.feature — BDD spec. Read only when auditing or amending this skill; not needed for normal execution.
  • scripts/post_uploads.sh — multipart POST loop for submit URLs (usage: post_uploads.sh mapping.tsv where each line is submitUrl<TAB>filepath).

Retrospective

After the board is delivered, reflect on the run:

  1. Consider: mid-session corrections (wrong file/team, re-uploads, layout redo)?
  2. Ask the user (in Japanese): 「今回のFigmaボード作成のフィードバック (1-5の評価、気になった点、または何もなければEnter)」 If the rating is < 5, ALWAYS follow up: 「なぜその評価ですか？ (改善のために具体的に教えてください)」 and record the answer verbatim as Rating reason.
  3. If feedback was given OR corrections occurred: create feedback/ next to this SKILL.md if missing (resolve via git rev-parse --show-toplevel), create feedback/log.md with the standard header if missing, and prepend an entry (Skill Version / Task / Outcome / Rating / Rating reason / Corrections / Issues / User Note). Confirm in one short Japanese sentence.
  4. If skipped and no corrections occurred, end without recording.

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

adversarial-panel

무료

Run a multi-model adversarial mutual review with facilitator synthesis: 2+ panelists (different model families where possible — use codex-server / codex-cli for the external-family seat) independently answer, adversarially critique each other across rounds, and the main session acts as facilitator, synthesizing agreements, live disagreements, and calibrated confidence into one answer. Use ONLY on high-stakes, hard-to-reverse claims, designs or decisions, and only when the user EXPLICITLY asks to debate or adversarially review with multiple models — "discuss with Opus and Codex", "red-team this", "devil's advocate", 敵対的レビュー, 相互レビュー, 多モデル討論, 議論させて. A full run costs ~6 subagent/CLI dispatches: state the panel size and round count and get a go-ahead before launching. Where the Workflow tool is available, run the panel as a Workflow (judge-panel / adversarial-verify) instead of ad-hoc fan-out. Do NOT self-trigger on a bare "are you sure?" — that is a cue to OFFER the panel, not to run it.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

hideki5123/agent-skill-set22026년 10월 21일 업데이트

agent-swarm

무료

Orchestrate multiple coding-agent sessions (Claude Code, Codex, Gemini) over the mcp_agent_mail MCP server, observe their progress on a recurring auto-loop, and prevent inconsistencies (file/edit conflicts and contradictory decisions) between concurrent tasks. Auto-manages the agent-mail server, derives the shared room key from the git repo, and runs either as the orchestrator/observer or as a participating worker. Handles the operational details (server startup, room key, reservation conventions) so the user does not have to remember them. Use when coordinating several agent sessions on different tasks at once, watching a swarm of sessions for conflicts, or wiring already-running sessions into a shared coordination room. Trigger phrases: "agent-swarm", "/agent-swarm", "orchestrate agents", "orchestrate multiple claude sessions", "coordinate sessions", "watch for conflicts between agents", "observe the swarm", "prevent inconsistency between sessions", "multi-agent observe", "複数セッションを協調", "エージェント協調", "セッション間の不整合監視", "スウォーム監視", "複数のClaudeを束ねて".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

hideki5123/agent-skill-set22026년 10월 21일 업데이트

agents-init

무료

Generate AGENTS.md (cross-tool agent context — Codex CLI, Aider, Cursor, etc.) and wire CLAUDE.md as a symlink so Claude Code reads the same file. Delegates content generation to Claude's built-in /init when needed, then renames + symlinks. Idempotent. Triggers — /agents-init, "generate agents.md", "create agents.md", "share claude and codex context", "set up agents file", "init agents", "agents-init", "cross-tool agent context", "wire claude and agents".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

hideki5123/agent-skill-set22026년 10월 21일 업데이트

chrome-use

무료

Drive an already-running, LOGGED-IN Chromium browser on macOS via AppleScript — navigate, click, fill forms, scroll, and extract page content from the user's REAL session, with the browser left open and NO profile copy and NO restart. Use when the task needs the existing logged-in session (cookies, auth, current tabs) reused as-is. Trigger phrases: "chrome-use", "ブラウザから取得", "ログイン済みの Chromeで", "ブラウザを操作して", "このページ読んで", "Xのスレッド読んで", "ログインしたまま取得", "自分のセッションでスクレイプ", "read this page in my browser", "scrape with my session", "drive my chrome", "execute JS in my (logged-in) browser", "automate my logged-in browser". Chromium family (Chrome default; Brave/Edge/Arc/Vivaldi via --app). NOT for isolated/throwaway automation where login reuse is unneeded — use playwright-cli for that. macOS only.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

hideki5123/agent-skill-set22026년 10월 21일 업데이트

codex-cli

무료

Run OpenAI Codex CLI from the terminal for batch / one-shot `codex exec` invocations with output captured to an `-o` file. Use for fire-and-forget runs, scripted CI, code review batches (`codex review`), and resuming a specific session by id (`codex exec resume`). Always use this skill instead of `mcp__codex__codex` and `mcp__codex__codex-reply` MCP tools — CLI is faster and more capable. For streaming UX, multi-turn dialogues that need live state, structured (JSON schema) output, attaching images, or programmatic event handling → **use codex-server instead**. codex-server uses the user's ChatGPT subscription via Codex App Server and decoupled async invocation that bypasses the Bash 2-minute timeout entirely. Trigger patterns (batch-only — chat/streaming triggers belong to codex-server): codex-cli / codex CLI / codex exec / codex review / codex resume / codex fork / batch + {codex, gpt} / one-shot + {codex, gpt} / non-interactive + codex / codex {to a file, -o, output file, captured output} / CI + {codex, gpt} / scripted + {codex, gpt} / fork codex session / resume codex session by id

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

hideki5123/agent-skill-set22026년 10월 21일 업데이트

codex-server

무료

Run OpenAI Codex via the Codex App Server (JSON-RPC-over-stdio) for streaming multi-turn chat sessions with persistent threads, structured output, image input, and rich event streams. Default entry point for ChatGPT/GPT/Codex-like conversations from the terminal. Uses the user's ChatGPT subscription (Plus / Pro / Team) exclusively via `codex login` — never consumes OPENAI_API_KEY billing, by design. Implementation: TypeScript on deno with npm:@openai/codex-sdk; spawns the existing system codex binary. Decoupled async invocation: every turn returns turn-id in <1 s; the actual SDK work runs in a detached worker that streams to per-turn files under ~/.codex-server/turns/<turn-id>/ — Bash's 2-min timeout never applies. Prefer this over codex-cli for streaming UX, multi-turn dialogues that need live state, structured (JSON schema) output, attaching images, or programmatic event handling. Use codex-cli only for one-shot batch invocations that pre-capture to an -o file. For OpenAI Platform API calls specifically (embeddings, image generation, audio, moderation, batches, files) — not open-ended chat — use openai-cli instead; that path bills OPENAI_API_KEY, this one uses the ChatGPT subscription. Trigger patterns (match any variation): codex / codex-server / codex app server / codex app-server / openai / open ai / OpenAI / chatgpt / chat gpt / ChatGPT / GPT / ask gpt / chat with gpt / gpt session / codex session / streaming chat / multi-turn chat / multi turn chat / second opinion / cross-check / cross check / ai pair programming / another AI / external AI / ask another model / get GPT's take / what does openai think / show me what gpt thinks / structured output from gpt / json schema gpt / resume codex thread / continue codex conversation / continue codex session / /codex-server

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

hideki5123/agent-skill-set22026년 10월 21일 업데이트

hideki5123의 스킬 모두 보기

이 스킬의 문제 신고