본문으로 건너뛰기
cccskills
무료GitHub에 공개한국어 소개

diagram-maker

개념, 업무 흐름, 소프트웨어와 클라우드 구성을 도표로 정리합니다. 브라우저에서 여는 SVG 포함 HTML이나 편집 가능한 Excalidraw 파일로 저장합니다.

원문원문 설명 보기

Create SVG/HTML or Excalidraw diagrams for concepts, architecture, flows, and whiteboards.

openclaw/openclaw
AI 평가100점/ 100설치 방법 보기

이럴 때 유용합니다

  • 학습 자료의 개념을 도표로 설명할 때
  • 업무 흐름을 순서도로 만들 때
  • 소프트웨어와 클라우드 구성도 작성
  • 편집 가능한 화이트보드 도표 작성

한국어 소개

할 수 있는 일

diagram-maker는 개념, 처리 흐름, 소프트웨어와 클라우드 구성을 도표 파일로 정리합니다. 요소와 그룹, 짧은 이름표, 화살표로 나타낼 관계를 정리하고 좌우 방향, 상하 방향, 레인 구분 등의 배치를 선택합니다. 설명할 내용에 따라 개념도, 구성도, 손으로 그린 듯한 도표를 만듭니다. 결과는 SVG가 포함된 단일 HTML 파일이나 편집 가능한 Excalidraw 형식으로 저장합니다.

이럴 때 유용합니다

학습 자료에서 개념을 설명하거나 업무 절차를 공유하고, 서비스와 데이터베이스의 관계를 정리할 때 활용합니다. 브라우저에서 볼 도표는 SVG/HTML로, 나중에 편집하거나 함께 작업할 도표는 Excalidraw로 만들 수 있습니다. 주요 요소를 추려 내용이 지나치게 빽빽해지지 않도록 정리합니다.

사용 예시

  • “이 업무 흐름을 브라우저에서 열 수 있는 도표로 만들어 주세요.”
  • “서비스와 데이터베이스의 관계를 구성도로 그려 주세요.”
  • “편집 가능한 Excalidraw 형식으로 순서도를 만들어 주세요.”

주의 사항

SVG/HTML은 외부 글꼴, JavaScript, 이미지, 원격 자료를 사용하지 않는 단일 파일입니다. 경로를 지정하지 않으면 ./diagram.html 또는 ./diagram.excalidraw에 저장하며, 가능한 범위에서 구문을 확인합니다.

이 소개문은 공개된 SKILL.md를 바탕으로 AI(OpenAI Codex)가 작성했습니다. 정확한 사양은 아래 원문을 확인하세요.

객관 평가

AI가 SKILL.md의 내용만을 근거로 4가지 관점에서 판정했습니다. 스타 수나 인기도는 판정에 넣지 않았습니다.

지시의 명확성언제 쓰고 무엇을 하는지 알 수 있는가
A양호개념도, 구성도, 편집용 도표의 용도와 출력 형식 선택 기준이 명시되어 있습니다.
절차의 구체성절차·입출력·예시가 구체적으로 적혀 있는가
A양호요소 추출부터 배치, 저장, 구문 확인까지의 절차와 두 출력 형식의 규칙이 있습니다.
안전성전송·삭제·명령 실행 등을 명시하고 있는가
A양호저장 경로를 명시하며 SVG/HTML에서 외부 자료와 JavaScript 사용을 금지합니다.
도입의 용이성필요한 도구나 API 키가 적고 적혀 있는가
A양호추가 도구나 API 키를 요구하지 않으며 참조할 템플릿의 경로가 제시되어 있습니다.

총점은 각 항목을 A=25점, B=15점, C=5점으로 더한 값입니다. 2026년 10월 19일 기준으로 AI(OpenAI Codex)가 판정했습니다. 참고용이므로 설치 전에 원문도 확인해 주세요.

평가가 다르다고 생각되면 재검토를 요청하기

어느 항목이 왜 다르다고 생각하는지 적어 주세요. 로그인은 필요 없습니다. SKILL.md와 대조해 평가를 다시 만들고 이곳에 반영합니다.

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

포함된 파일(3)

  • SKILL.md2.3 KB
  • references/excalidraw-patterns.md1.4 KB
  • references/svg-template.md1.9 KB

SKILL.md(원문)

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

Diagram Maker

Create diagrams as artifacts, not prose. Choose one output mode:

  • clean-svg: educational concepts, physical systems, processes, lifecycle, simple data flow.
  • architecture-svg: software/cloud/infra topology, services, databases, queues, trust zones.
  • excalidraw: editable hand-drawn whiteboard, flowchart, sequence, architecture sketch.

Routing

  • User wants editable/collaborative: choose Excalidraw.
  • User wants polished standalone browser output: choose SVG/HTML.
  • Software architecture with infra components: choose architecture SVG.
  • Science, product, process, concept map, physical object: choose clean SVG.
  • Unsure: ask one short question only if output format matters; otherwise choose clean SVG.

Workflow

  1. Extract nodes, groups, labels, and directed relationships.
  2. Pick layout first: left-to-right, top-down, hub-spoke, swimlanes, layered stack, sequence.
  3. Keep labels short. Prefer 5-9 main elements over dense diagrams.
  4. Generate the file at the requested path, or ./diagram.html / ./diagram.excalidraw.
  5. Verify syntax by opening/parsing when feasible.

SVG/HTML rules

  • Single standalone .html file with inline CSS and inline SVG.
  • No external fonts, JS, images, gradients, glows, decorative blobs, or remote assets.
  • Use semantic colors, not rainbow sequences: neutral, input, process, storage, external, risk.
  • Draw connectors before nodes so arrows sit behind boxes.
  • Every connector path has fill="none" and a marker arrow when directed.
  • Leave 24px text padding inside boxes; do not let text touch borders.
  • Legend only when symbols/colors are not obvious.

SVG template

Use references/svg-template.md as the wrapper and replace <!-- SVG -->.

Excalidraw rules

  • Save .excalidraw JSON with type, version, source, elements, and appState.
  • Use bound text for shape labels. Do not use a nonstandard label property.
  • Keep bound text immediately after its container in the elements array.
  • Minimum labeled shape: 120x60. Minimum body text: 16px.
  • Use roughness 1, fontFamily: 1, and simple fills.

For exact Excalidraw element snippets, read references/excalidraw-patterns.md.

리뷰

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

댓글

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

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

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

0 / 1,000자

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

같은 저장소의 스킬

1password

무료

Set up and authenticate the 1Password CLI, then supply stored passwords and API keys to commands or configuration. The skill covers desktop integration, service accounts, and interactive sign-in while keeping secrets out of chat and logs.

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

  • Setting up the 1Password CLI
  • Supplying API keys to commands
  • Using service account authentication in CI
openclaw/openclaw39.2만2026년 10월 18일 업데이트

acp-router

무료요약 있음AI 평가 80점

OpenClaw에 전달한 자연어 요청을 Claude Code 같은 외부 코딩 에이전트로 연결합니다. ACP나 acpx로 작업을 시작하거나 이어가며 대화 맥락을 유지합니다.

  • 스레드에서 Claude Code 시작
  • 외부 에이전트의 기존 작업 계속
  • acpx로 직접 지시 전달
openclaw/openclaw39.2만2026년 10월 18일 업데이트

add-model-provider

무료

Add a model provider to OpenClaw and verify it with a real response. The skill validates configuration, keeps credentials in environment or file references, and reports test results and any default model changes.

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

  • Adding a model provider to OpenClaw
  • Configuring credentials through environment or file references
  • Checking whether a model returns a real response
openclaw/openclaw39.2만2026년 10월 18일 업데이트

agent-transcript

무료

Prepare an agent activity transcript for a GitHub pull request or issue. Extract relevant prompts, decisions, and results from local logs, remove sensitive material, and preview the edited record before separately authorized publication.

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

  • Preparing an agent activity record for a pull request
  • Extracting task-relevant prompts and results from local logs
  • Previewing a transcript with sensitive information removed
openclaw/openclaw39.2만2026년 10월 18일 업데이트

apple-notes

무료

Manage Apple Notes on macOS through memo, a command-line tool. Create, browse, search, edit, delete, and move notes between folders, or export selected notes to HTML or Markdown for use outside the app.

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

  • Creating notes with titles
  • Finding notes by folder or approximate search
  • Editing notes and organizing them into folders
openclaw/openclaw39.2만2026년 10월 18일 업데이트

apple-reminders

무료

Manage Apple Reminders from your Mac with remindctl, a terminal tool. View tasks by date, add or edit reminders, organize lists, and mark tasks complete or delete them, including personal to-dos that sync to iOS.

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

  • Review today’s tasks and overdue reminders
  • Add personal to-dos with due dates
  • Organize tasks visible on an iPhone or iPad
openclaw/openclaw39.2만2026년 10월 18일 업데이트

openclaw의 스킬 모두 보기

이 스킬의 문제 신고