Draw.io Skill

예시 체험

중2 정보 — 짝수와 홀수 판별 알고리즘 순서도 만들기

꾸민 수업 예시 직접 생성 — 에이전트 제작 새 창에서 크게 보기

선생님이 입력한 내용

중학교 2학년 정보 '문제 해결과 알고리즘' 단원 수업 준비. 순차 구조와 선택 구조가 순서도에서 어떻게 나타나는지 학생들에게 화면에 띄워 보여 주고, 수업 중에 바로 고쳐 가며 설명할 편집 가능한 도식이 필요한 상황이다.

중학교 2학년 정보 '문제 해결과 알고리즘' 단원 수업을 준비하고 있어요. 자연수 n을 입력받아 짝수인지 홀수인지 판별하는 알고리즘을 순차·선택 구조가 드러나게 순서도로 그려 주세요. 수업 화면에 띄울 수 있게 편집 가능한 draw.io 파일로 만들고, 시작·입력·판단·처리·출력·끝 기호를 정보 교과에서 배운 모양대로 구분해 주세요. 모든 글자는 한국어로 써 주세요.

나온 결과

판단 — n을 2로 나눈 나머지가 0인가? (예 → 짝수 / 아니요 → 홀수) 기호 약속 — 시작·끝: 타원 / 입력·출력: 평행사변형 / 판단: 마름모 / 처리: 사각형 순차·선택 구조 — 위에서 아래로 흐르는 부분이 순차, 마름모에서 두 갈래로 갈라지는 부분이 선택이다.

직접 해 보기 — 3단계

1. opencode 같은 AI 에이전트에 저장소 안내대로 이 스킬(drawio-skill)을 설치한다. 결과를 PNG·SVG로 내보내려면 draw.io 데스크톱 앱이 함께 있어야 한다.
2. 학년·단원·알고리즘 내용과 쓰고 싶은 도형 기호를 적은 문장을 붙여 넣는다. 위 문장을 바꿔 써도 된다.
3. 나온 .drawio 파일을 draw.io(학습SW)·diagrams.net에서 열어 도형·화살표·글자를 확인하고, 수업 자료와 성취기준에 맞게 고친다.

수업 상황은 이해를 돕기 위해 꾸민 예시입니다. 만든 방법: opencode (DeepSeek) + 이 스킬 (drawio-skill) · 확인일 2026-10-16. 이 스킬의 결과물은 그림이 아니라 편집 가능한 .drawio 파일이다. 이 환경에는 draw.io 데스크톱 앱(내보내기용 CLI)이 없어 스킬의 PNG·SVG 내보내기와 drawiohtml.py 단계는 돌리지 못했고, .drawio XML을 저장소 SKILL.md의 xml-authoring 절차(순서도 프리셋, 선택 분기 처리 규칙)를 그대로 따라 만들었다. 만든 파일은 스킬의 자체 점검 도구 validate.py로 검사해 오류 0건·경고 0건(score 0)을 확인했다. 위 그림은 스킬이 안내하는 브라우저 대체 경로대로 그 .drawio XML을 공식 diagrams.net 뷰어로 그대로 그린 것이며, XML 내용은 손으로 고치지 않았다. 순서도 속 n과 판단 기준(2로 나눈 나머지)은 꾸민 수업 예시이고 측정한 사실이 아니며, 노드·연결 개수는 만들어진 파일을 센 값이다. 스킬은 알고리즘 내용의 정오나 성취기준 적합성을 검증하지 않으므로, 실제 수업 전에 도형 기호가 우리 교과서 약속과 맞는지, 순서도가 성취기준에 맞는지 선생님이 직접 확인해야 한다.

써 보려면

1. 저장소 Agents365-ai/drawio-skill를 엽니다.
2. 설치가 필요합니다. 절차는 저장소 안내를 따릅니다.
3. 이 기록에는 API 키가 필요하지 않다고 되어 있습니다.

출처

스타 수와 라이선스는 공식 저장소 기준이며, 일일 검증이 다시 확인합니다. 정보 정정 요청

라이선스