2026-May-QO-Lab

Week 2 과제

2주차 핵심 도구(스킬 · 서브에이전트 · MCP)를 내 업무에 직접 적용하여 실용적인 자동화 결과물을 만들어냅니다.


(1) 이번 퀘스트 폴더 구조는 다음과 같이 만들어주세요

Week2-Quest/
├── .gitignore                           ← 루트(가장 바깥 폴더)에 반드시 생성
├── .claude/                             ← 모든 스킬, 에이전트, MCP 통합 저장
│   ├── skills/
│   │   ├── [스킬1]/SKILL.md
│   │   ├── [스킬2]/SKILL.md
│   │   └── yt-summary/SKILL.md
│   └── agents/
│       ├── [에이전트1].md
│       └── [에이전트2].md
├── Q0-GWS-CLI/
│   └── README.md
├── Q1-Skill/
│   ├── screenshot-skill1.png            ← 스크린샷은 퀘스트 폴더 내에
│   ├── screenshot-skill2.png
│   └── README.md
├── Q2-Subagent/
│   ├── before-screenshot.png
│   ├── after-screenshot.png
│   └── README.md
├── Q3-YT-Summary/
│   ├── screenshot.png
│   └── README.md
├── Q4-Naver-Blog/
│   ├── .env.example                    ← 이것만 GitHub에 올림 (실제 .env는 절대 금지)
│   ├── .gitignore
│   ├── screenshot.png
│   └── README.md
└── Q5-News-Card/
    ├── output/                         ← 생성된 HTML/PNG 파일이 저장될 폴더
    ├── final-newscard.png
    └── README.md


(2) github 레포를 제출해주세요

  1. Week2-Quest 폴더를 VS Code로 열고 위 구조로 작업합니다.
  2. 완료 후 Claude에게 요청합니다:
    Week2-Quest 폴더를 GitHub public 리포지토리로 올려줘.
    루트에 전체 과제를 소개하는 README.md도 만들어줘.
    

    설명: public 리포지토리는 누구나 볼 수 있는 공개 저장소입니다. 채점을 위해 반드시 public으로 설정해야 합니다.

  3. GitHub 리포지토리 주소를 구글 폼으로 제출해주세요. –> https://forms.gle/vCT7PRH7vP6NZTQn7


(3) 각 퀘스트 마다 README 파일을 작성해주세요

설명: README.md는 폴더를 처음 보는 사람에게 “이게 뭔지, 어떻게 쓰는지”를 알려주는 안내 문서입니다.

각 퀘스트 폴더에 README.md를 만들고, 아래 3가지만 간결하게 씁니다:

## 무엇을 했는가
한 줄 설명

## 어떻게 실행하는가
1. 준비물 / 설치
2. 실행 명령어 또는 호출 방법

결과물 스크린샷을 각 퀘스트 폴더에 저장합니다.





[Q0] 구글 워크스페이스 CLI

이렇게 해보세요

구글 워크스페이스 CLI를 환경을 구축하고, 간단한 작업을 진행합니다. 시간이 조금 걸리는 과정이기 때문에, 첫 퀘스트로 진행하지 않으셔도 됩니다.

Step 1 — 설치

아래 영상을 보고 설치를 진행합니다:

Google Workspace CLI 설치 가이드 영상

Step 2 — 실제로 사용해보기

설치한 스킬로 내 직무와 연결된 실제 작업을 1가지 수행합니다.

Google Workspace CLI 예시:

지난 한 주 읽지 않은 메일을 확인한 후 Action 아이템이 있는지 확인해줘. 
그리고 구글 캘린더에 등록해줘.

Step 3 — README.md 작성

Q0-GWS-CLI/에 대화/결과물 스크린샷 저장. Q0-GWS-CLI/README.md에 실제로 해결한 작업 1가지





[Q1] Skill-creator

스킬은 AI가 업무를 표준에 따라 작업할 수 있게 하는데요. 이 스킬을 잘 만들 수 있도록 앤트로픽에서 ‘Skill-creator’이라는 메타 스킬을 만들었습니다. 이 스킬을 먼저 설치한

설명: 모든 스킬 파일은 프로젝트 루트의 ./.claude/skills/ 폴더에 공통으로 저장합니다.

이렇게 해보세요

Step 1 — Skill-creator 설치

Claude에게 요청:

skill-creator 메타 스킬을 설치해줘. https://github.com/anthropics/skills/tree/main/skills/skill-creator

설명: skill-creator는 “스킬을 만드는 스킬”입니다. 내가 업무 절차를 설명하면 자동으로 SKILL.md 파일을 생성해줍니다.

설치 후 VS 코드를 닫고 다시 열고 (또는 ctrl+shft+p -> reload window로 새로고침) /skill-creator가 작동하는지 확인합니다. 대화에서 “/skill-creator 스킬을 사용해서 … abc를 만들어줘” 라는 형식으로 요청합니다.

Step 2 — 만들 스킬 1가지 선택

아래 목록에서 1가지 작업을 정합니다.

선택 주제 스킬 예시 이름
a 회의록 → 3줄 요약 + 액션 아이템 /meeting-summary
b 고객 메일 → 응대 이메일 템플릿 /reply-email
c 데이터 → 월간 보고서 형식 고정 /monthly-report
d 채용 공고 → 우리 회사 톤으로 정규화 /job-posting
e 반복되는 문서 → 항상 같은 형식으로 처리 /format-doc

Step 3 — SOP(표준 작업 절차) 직접 작성 (AI 없이)

스킬을 직접 만들기 전에, 신입에게 알려준다고 상상하고 SOP.md 파일 또는 SOP.txt을 만들어 표준 작업 절차를 한국어로 먼저 작성해봅니다. 초안은 내가 적고, AI가 다듬어주는 방식으로 합니다. 예시:

[업무명: 회의록 요약]

입력:
- 회의록 원문 (붙여넣기 또는 파일)

절차:
1. 회의 목적과 참석자 파악
2. 결정된 사항만 추려서 3줄로 요약
3. 담당자 + 기한이 있는 액션 아이템 목록 작성
4. 형식: ## 요약 / ## 액션 아이템

출력 형식:
## 요약
- (1줄)
- (1줄)
- (1줄)

## 액션 아이템
| 담당자 | 할 일 | 기한 |

Step 4 — skill-creator로 SKILL.md 생성

“/skill-creator 스킬을 사용해서 SOP 작업을 스킬로 만들어줘. 스킬은 프로젝트 루트에 저장해줘.”

Step 5 — 스킬 실행 및 개선

설치 후 VS 코드를 닫고 다시 열고 (또는 ctrl+shft+p -> reload window로 새로고침) 방금 만들어진 스킬이 작동하는지 확인합니다. 새 대화에서 /[스킬명]으로 실행합니다. 결과를 보고 보완할 점이 있으면 스킬은 개선해달라고 요청합니다.

Step 6 — README.md 작성 및 스크린샷 제출

💡 팁





[Q2] 서브에이전트

설명: 서브에이전트는 메인 Claude가 특정 작업을 맡기는 전문 AI 팀원입니다. 조사 전담, 작성 전담 등 역할을 나눠 각자 독립된 집중력으로 일하게 할 수 있습니다.

저장 위치

설명: 모든 에이전트 파일은 프로젝트 루트의 ./.claude/agents/ 폴더에 공통으로 저장합니다.

이렇게 해보세요

Step 1 — 주제 선택 (아래 중 하나)

선택 주제
A 경쟁사 3곳 조사 → 비교표 + 인사이트 도출
B 시장 트렌드 + 우리 강점 분석 → 전략안 작성
C 고객 피드백 + 제품 로드맵 → 우선순위 제안
D 여러 파일 검토 → 일관성 체크 + 개선안 도출
E 불확실한 정보 → 찾고 검증해서 최종 결론 제시

Step 2 — AI 팀 설계

같은 작업을 사람 팀원에게 배분한다면 어떻게 나눌지 설계하고 이를 team.md 또는 team.txt에 작성합니다. 예시:

researcher (자료 조사)

analyst (분석 및 비교)

writer (최종 정리)

Step 3 — 에이전트 파일 생성

Claude에게 요청: “내가 설계한 구조 파일 team.md or team.txt를 참고해서 서브에이전트로 구현해줘. ./.claude/agents/ 폴더에 각 에이전트를 .md 파일로 만들어줘.”

에이전트 파일 예시:

---
name: researcher
description: 경쟁사·시장 조사 전담. 웹 검색 후 팩트 기반 요약 제공. 외부 정보 조사가 필요할 때 호출.
---

# Researcher

## 역할
외부 정보를 조사하고 구조화된 요약을 작성합니다.

## 지침
1. 주어진 주제를 웹에서 검색합니다.
2. 핵심 사실만 추출하고 출처를 명시합니다.
3. 의견이나 추측은 포함하지 않습니다.

Step 4 — 서브에이전트로 실행

서브에이전트를 활용해 작업을 처리해봅니다.

Step 5 — README.md 작성

Q2-Subagent/에 README.md 작성 및 스크린샷 저장:

💡 팁






[Q3] YouTube 요약 스킬 — yt-dlp + Claude

yt-dlp는 YouTube, TikTok, Vimeo 등 1,000개 이상 사이트에서 영상·음성·자막을 내려받을 수 있는 무료 오픈소스 도구입니다.

이렇게 해보세요

Step 1 — yt-dlp 설치

클로드 코드에게 yt-dlp를 설치해달라고 요청합니다.

Step 2 — 자막 다운로드 테스트

요약할 YouTube 영상 URL을 하나 선택하고 자막을 내려받습니다.

“yt-dlp를 사용해서 이 영상 (URL)을 이 디렉토리에 다운받고, 자막도 다운받아줘”

파일이 다운 받아 졌는지, 자막도 잘 받아졌는지 확인합니다.

Step 3 — SKILL.md 작성

Claude에게 스킬로 만들어줄 것을 요청합니다:

yt-dlp로 자막을 받아 요약하는 스킬을 만들어줘.
스킬 이름: yt-summary
저장 위치: ./.claude/skills/yt-summary/SKILL.md

스킬 문서 예시:

---
name: yt-summary
description: YouTube URL을 받아 자막을 다운로드하고 핵심 내용을 요약한다. 영상 내용을 빠르게 파악할 때 호출.
---

# YouTube 요약 스킬

## 사용법
/yt-summary [YouTube URL]

## 절차
1. 입력받은 URL에서 yt-dlp로 자막을 다운로드한다.
   
   yt-dlp --write-auto-subs --sub-lang ko --skip-download --output "subtitle" [URL]
   
2. 자막 파일(.vtt/.srt)을 읽는다.
3. 다음 형식으로 요약한다.


## 출력 형식
### 영상 제목
[제목]

### 핵심 요약 (3~5줄)
- 
- 

### 주요 키워드
[키워드1], [키워드2], [키워드3]

### 타임스탬프별 하이라이트
| 시간 | 내용 |
|------|------|

Step 4 — 실행 테스트

새 대화에서 아래와 같이 스킬을 사용해 유튜브 영상 요약을 받아봅니다.

/yt-summary https://www.youtube.com/watch?v=[영상ID]

실행 결과를 스크린샷으로 저장합니다.

Step 5 — README.md 작성 및 스크린샷 저장

Q3-YT-Summary/README.md에 기록:

💡 팁





[Q4] 네이버 블로그 초안 자동화 — Playwright MCP

설명: Playwright는 웹 브라우저를 코드로 자동 조종하는 도구입니다. 클로드 코드가 Playwright MCP를 활용해 브라우저를 제어할 수 있습니다. 네이버에 로그인 하여 블로그 초안을 작성하고 저장하는 자동화를 만들어봅시다.

이렇게 해보세요

Step 1 — Playwright MCP 설치

Claude에게 요청:

Playwright MCP 서버를 프로젝트 범주로 설치해줘.

설치 확인, VS 코드를 닫고 열거나 Reload Window로 Claude Code를 재시작한 후 /mcp 명령으로 목록에 Playwright가 보이면 성공입니다.

Step 2 — .env 파일 생성

Q4-Naver-Blog/ 폴더 안에 .env 파일을 생성하고, 이 안에 아래 내용을 적습니다.

NAVER_ID=내아이디
NAVER_PW=내비밀번호

내 아이디와 내 비밀번호 부분은 실제 나의 아이디와 비밀번호로 적어주시고(따옴표 없이), 저장한 후 클로드 코드에게 .env 파일을 gitignore에 추가해달라고 합니다. 이렇게 하면 .env 파일은 GitHub에 올라가지 않습니다.

Step 3 — 나의 블로그 톤 정의

Claude에게 내 글쓰기 스타일을 알려줍니다:

나의 네이버 블로그 글쓰기 스타일:
- 어조: [예: 친근한 반말 / 전문적인 존댓말]
- 문단 길이: [예: 짧고 간결하게 / 상세하게]
- 자주 쓰는 표현: [예: "핵심만 말하면", "솔직히 말하면"]
- 포함할 섹션: 도입 / 핵심 내용 / 내 생각 / 마무리

Step 4 — 자동화 실행

기사 URL을 Claude에게 전달합니다:

이 기사를 읽고 내 블로그 톤으로 초안을 작성해줘.
.env 파일의 NAVER_ID, NAVER_PW를 사용해서 네이버로그인 하고, 새 글 작성 까지 한다음에, 임시저장까지 해줘.
완료되면 터미널에 "✅ 블로그 초안 저장 완료: [제목]" 메시지를 출력해줘.
기사 URL: [URL]

잘 작동하는지 확인합니다.

Step 5 — Skill 또는 Subagent로 저장 잘 작동 한다면, 나중에 url만 주면 네이버 블로그 초안을 작성해주는 skill 또는 subagent를 만들어달라고 요청합니다.

Step 6 — README.md 작성 및 스크린샷 저장

💡 팁





[Q5] 인스타그램 뉴스 카드 자동화 — HTML/PNG 생성

설명: HTML은 웹페이지를 만드는 파일 형식이고, PNG는 이미지 파일 형식입니다. 명함 만들기 에이전트 실습 변형입니다.

이렇게 해보세요

Step 1 — 기사 내용 추출

Claude에게 기사 URL을 전달하고 핵심 정보를 추출합니다:

이 기사의 핵심 내용을 뉴스 카드용으로 추출해줘.
형식:
- 헤드라인 (15자 이내)
- 서브타이틀 (30자 이내)
- 핵심 포인트 3가지 (각 20자 이내)
- 출처 이름
- 날짜
기사 URL: [URL]

Step 2 — 뉴스 카드 HTML 생성

Claude에게 요청:

위 내용으로 인스타그램 뉴스 카드 HTML을 만들어줘.
조건:
- 크기: 1080 x1350 (1:1 비율)
- 자체 완결형 단일 HTML 파일 (외부 파일 없이 혼자 동작)
- 배경색, 폰트, 레이아웃을 모던하게
- Q5-News-Card/output/newscard-[날짜].html 로 저장

Step 3 — PNG로 저장

방법 A — Playwright MCP 사용 (Q4에서 설치했다면):

Q5-News-Card/output/newscard-[날짜].html 파일을 열어서
PNG로 스크린샷 찍어서 같은 폴더에 저장해줘.

방법 B — 브라우저에서 직접 저장:

  1. 생성된 HTML 파일을 크롬 브라우저로 열기
  2. F12 키를 눌러 개발자 도구(DevTools) 열기 설명: 개발자 도구(DevTools)는 웹페이지를 분석하거나 스크린샷을 찍을 수 있는 크롬 내장 도구입니다.
  3. Ctrl + Shift + PCapture screenshot 입력 → 실행
  4. 저장된 파일을 Q5-News-Card/output/newscard-[날짜].png로 이동

Step 4 — 디자인 개선

결과물을 보고 html 파일 개선 요청합니다.

뉴스 카드 디자인을 개선해줘:
- [개선 요청 1 예: 글씨가 너무 작음]
- [개선 요청 2 예: 배경색을 더 진하게]

최소 1회 이상 개선하고 최종본을 저장합니다.

Step 5 — Skill 또는 Subagent로 저장 나중에 url만 주면 인스타 뉴스 카드를 만들어주는 skill 또는 subagent를 만들어달라고 요청합니다.

Step 6 — README.md 작성

Q5-News-Card/README.md에 기록





마치며

수고하셨습니다! 🎉