시작하기 전에 필독
-
1
데스크톱 앱을 설치하고, 앱에서 진행합니다웹 브라우저의 채팅창이 아니라 내 컴퓨터에 설치한 데스크톱 앱에서 해야 AI가 파일을 직접 만들고 고칩니다. Claude Code는 Claude Desktop, Codex는 ChatGPT 앱을 설치합니다.
-
2
내 컴퓨터에 폴더를 만들고, 앱에서 그 폴더를 선택한 뒤 시작합니다바탕화면 등에 실습용 새 폴더를 하나 만들고, 앱에서 작업 폴더로 그 폴더를 선택합니다. AI는 선택한 폴더 안에서만 파일을 만들고 고칩니다. 폴더를 고르지 않으면 만든 파일이 어디 있는지 찾기 어렵습니다.
- 01부터 순서대로 진행하세요. 앞 과제에서 만든 파일을 다음 과제에서 계속 활용합니다
- 프롬프트를 그대로 복사하지 말고, 내 상황에 맞게 제품명·색상·기능을 바꿔보세요
- 결과가 마음에 안 들면 "더 고급스럽게", "모바일 최적화", "애니메이션 추가" 등으로 이어서 요청하세요
- 오류가 나도 당황하지 마세요. 오류 메시지를 그대로 AI에게 보내면 스스로 고칩니다
- ★ 표시 스킬은 그 과제에서 처음 배우는 핵심 개념입니다. 특히 집중해서 실습하세요
난이도
★☆☆☆☆ 입문
★★☆☆☆ 기초
★★★☆☆ 중급
★★★★☆ 고급
★★★★★ 실전
01
▼
스탑워치 만들기 · 디자인 변경
★☆☆☆☆
결과물: 피카소풍 얼굴이 배경에 깔린 스탑워치
약 15분
이 과제로 배우는 것
요청 한 줄로 앱을 만들고, 다음 요청 한 줄로 이미 만든 파일을 고칩니다. AI가 내 컴퓨터의 파일을 직접 만들고 고친다는 점을 확인합니다.
1단계 · 만들기
스탑워치 웹페이지를 만들어줘.
2단계 · 디자인 변경
피카소가 그린 얼굴이 시계 배경으로 나오도록 디자인 변경해줘.
완료 기준
막히면 · 자주 나오는 문제 3가지
파일을 만들었다는데 화면이 보이지 않습니다
방금 만든 스탑워치 파일을 브라우저에서 열어줘.
디자인을 바꾸라고 했더니 새 파일이 생겼습니다
새로 만들지 말고 처음 만든 스탑워치 파일을 고쳐줘.
배경 그림이 깨지거나 빈칸으로 나옵니다
외부 이미지 주소를 쓰지 말고, 피카소풍 얼굴을 SVG로 직접 그려서 넣어줘.
02
▼
멀티 페르소나로 개선하기
★★☆☆☆
결과물: 다섯 역할이 채점하고 고친 스탑워치와 점수 변화표
약 20분
프롬프트
방금 만든 스탑워치 화면을 아래 다섯 명이 함께 개선해줘.
각자 자기 역할의 기준으로만 보고, 다른 사람과 같은 지적은 하지 마.
블랙 · UI/UX 디자이너 (수행자)
나머지 네 명의 지적을 모아 화면을 직접 고친다. 무엇을 왜 바꿨는지 한 줄씩 남긴다.
레드 · QA 엔지니어 (이성 비평가)
기능이 맞게 작동하는지 본다. 시간 오차, 버튼을 연달아 누를 때, 랩 기록 순서, 새로고침했을 때.
실버 · 육상 경기 계측원 (분야 전문가)
실제 계측 장비 기준으로 본다. 1/100초 표시, 랩과 구간 구분, 기록 표기 방식, 빠진 기능.
블루 · 사용성 연구원 (공감 비평가)
처음 쓰는 사람이 어디서 멈칫하는지 본다. 버튼 이름, 지금 상태가 보이는지, 글자 대비, 누르기 쉬운 크기.
골드 · 트랙 코치 (실제 사용자)
운동장에서 휴대폰 한 손으로 선수 랩을 잰다. 햇빛 아래서 3초 안에 쓸 수 있는지 본다.
진행 순서
1. 블랙을 뺀 네 명이 각자 10점 만점 점수, 근거, 고칠 것 3개를 낸다.
2. 블랙이 지적을 중요한 순서로 정리해 직접 고친다.
3. 네 명이 다시 채점한다. 네 명 평균이 9.5점을 넘을 때까지 반복한다. 최대 3번.
4. 마지막에 역할별 점수가 처음과 끝에 어떻게 바뀌었는지 표로 보여줘.
기대 효과
답변 하나로 끝내지 않고 다섯 관점에서 검토한 뒤 스스로 고칩니다. 혼자 볼 때는 지나쳤던 문제가 드러납니다.
03
▼
GitHub 업로드
★★★☆☆
결과물: 내 아이디 주소로 열리는 웹사이트
약 30분
GitHub
진행 순서
1. GitHub.com 아이디 생성 (크롬에서 로그인해 둔 상태로 진행)
2. New Repository 생성
3. AI에게 GitHub 로그인 요청
"GitHub CLI(gh)를 설치하고 gh auth login을 웹 브라우저 방식으로 실행해줘"
4. 화면에 뜬 여덟 자리 코드(XXXX-XXXX)를 복사 → 크롬이 열리면 코드를 붙여넣고 Authorize github 클릭
: 토큰이나 비밀번호를 AI에게 직접 줄 필요가 없음
5. AI에게 "이 폴더를 방금 만든 Repository에 올려줘(Push)"라고 요청
6. GitHub.com에서 해당 Repo 클릭 → Settings → Pages → Branch에서 main, /root 선택하고 Save
7. 아이디.github.io/Repository명 으로 웹사이트로 접근
기대 효과
git init부터 commit, push, Pages 배포까지 자연어 한 줄로 끝냅니다. 내 작품이 인터넷에 공개되는 순간을 경험합니다.
04
▼
엑셀 실적 데이터로 시사점 뽑고 컨설팅 슬라이드 만들기
★★★☆☆
결과물: 시사점 문서(insights.md)와 HTML 슬라이드
약 30분
이 실습의 순서
두 단계로 진행합니다. 먼저 데이터에서 시사점 5개를 뽑아 파일로 남기고, 그 파일을 근거로 슬라이드를 만듭니다. 워크북에는 원본 실적 외에 매장·메뉴·공급사·플랫폼 마스터와 사건로그, 데이터사전이 들어 있습니다. 첫 시트 '안내'에 구조와 함정이 적혀 있습니다. 같은 파일을 06번에서 온톨로지와 지식 그래프로 다시 씁니다.
그다음 아래 프롬프트를 입력합니다.
해당 폴더의 엑셀 파일("피자 매장별 실적 데이터.xlsx")을 탐색적 데이터 분석해서
경영진에게 보고할 맥킨지 수준의 시사점 5개를 뽑아줘. 결과는 insights.md로 저장해줘.
2단계 · 시사점으로 컨설팅 슬라이드 만들기
1단계에서 만든 insights.md가 있는 폴더에서 아래 프롬프트를 입력합니다.
insights.md의 시사점 5개로 경영진 보고용 맥킨지 스타일 HTML 슬라이드를 만들어줘.
기대 효과
엑셀 원본에서 시사점을 근거 숫자와 반증 조건까지 붙여 뽑고, 그 결론을 액션 타이틀로 슬라이드에 옮깁니다. 분석 결과를 파일로 남긴 뒤 다음 프롬프트가 그 파일을 읽게 하는, 단계를 나눠 맡기는 방식을 익힙니다.
05
▼
구글 스프레드시트 기반 대시보드 만들기
★★★☆☆
결과물: 시트를 고치면 따라 바뀌는 경영자 대시보드
약 20분
프롬프트
아래 구글 스프레드시트("피자 매장별 실적 데이터")를 바탕으로 경영자용 대시보드를 만들어줘.
https://docs.google.com/spreadsheets/d/1ZUOzgPdXKMp7mkyjTOhZ9wfaRRe9IuuGkekKNKG41ZQ/edit?gid=38840795
대시보드에는 탐색적 분석을 할 수 있는 인터랙티브 차트를 넣어줘.
데이터는 Google Sheets의 CSV 주소에서 직접 읽어 오게 해줘.
디자인은 뉴모피즘 스타일로 해줘.
기대 효과
구글 스프레드시트를 인터랙티브 웹 대시보드로 바꾸는 일을 자동화합니다. 시트를 고치면 화면에 바로 반영됩니다. 시각화 도구 없이도 경영진 보고용 대시보드를 그 자리에서 만듭니다.
설치 없이 · 채팅에서 만들기
Claude의 아티팩트 기능이나 ChatGPT의 사이트 기능을 쓰면 채팅 안에서 대시보드를 만들고, 만든 결과물을 링크로 외부에 공개할 수 있습니다. 아래 프롬프트를 채팅에 붙여 넣으면 됩니다. 단, 팀·엔터프라이즈 계정은 회사 정책에 따라 외부 공개가 막혀 있을 수 있으니 먼저 관리자에게 문의하세요.
아래 구글 스프레드시트("피자 매장별 실적 데이터")를 읽어서 경영자용 인터랙티브 대시보드를 아티팩트나 사이트로 만들어줘.
https://docs.google.com/spreadsheets/d/1ZUOzgPdXKMp7mkyjTOhZ9wfaRRe9IuuGkekKNKG41ZQ/edit?gid=38840795
탐색적 분석이 가능한 인터랙티브 차트를 포함하고, 시트 데이터는 대시보드 안에 직접 담아줘.
06
▼
엑셀 실적 데이터로 온톨로지와 지식 그래프 만들기
★★★★☆
결과물: 온톨로지와 지식 그래프를 담은 HTML 한 장
약 40분
이 실습의 순서
엑셀 파일 속 대상(매장, 메뉴, 공급사, 배달 플랫폼, 사건)과 그 관계를 AI에게 정리하게 합니다. 대상과 관계의 규칙이 온톨로지, 그 규칙대로 실제 대상을 이은 그림이 지식 그래프입니다. 1단계에서 온톨로지를 HTML로 저장하고, 2단계에서 같은 HTML에 지식 그래프를 더합니다. 파일에는 함정이 두 개 있습니다. 시트마다 같은 매장이 다른 이름으로 적혀 있고, 매출 항목에 상품이 아닌 배달비가 섞여 있습니다. AI가 이 함정을 알아채는지가 이 실습의 핵심입니다.
1단계 프롬프트 · 온톨로지
해당 폴더의 엑셀 파일("피자 매장별 실적 데이터.xlsx")의 모든 시트를 읽고 온톨로지를 설계해서 html로 저장해줘.
2단계 프롬프트 · 지식 그래프
앞서 만든 온톨로지 html에 엑셀 파일의 실제 대상들을 연결한 지식 그래프를 추가해줘.
그리고 아래 질문 3개에 그래프를 따라가며 답해줘.
1. 배민 수수료 인상은 어느 매장의 어느 달 이익률에 영향을 줬나?
2. 밀크팜 치즈 단가 인상은 어떤 메뉴와 매장에 영향을 주나?
3. 2026년 4월 홍대점 클레임 폭증은 어떤 사건들과 이어져 있나?
기대 효과
같은 데이터를 표가 아니라 개체와 관계로 보는 눈이 생깁니다. 이름이 다른 같은 대상을 하나로 합치고, 분류가 애매한 항목을 규칙으로 못 박고, 수수료 인상이 어느 매장의 어느 달 이익에 닿았는지처럼 여러 시트를 건너야 나오는 답을 그래프에서 찾습니다. 컴퍼니 브레인의 LLM 위키가 왜 규칙과 지도를 함께 두는지 손으로 확인합니다.
07
▼
마인크래프트 같은 3D 블록 세계 만들기
★★★★★
결과물: 고양이를 조종해 구슬을 모으는 3D 블록 게임
약 60분
1단계 · 채팅에서 먼저
마인크래프트처럼 네모난 블록으로 된 3D 게임을 브라우저에서 만들려고 해.
해 질 녘 사원 정원에서 장화 신은 고양이를 3인칭으로 조종해 영혼의 구슬 7개를 모으는 게임이야.
아래 내용을 담은 PLAN.md를 작성해줘.
- 화면: 노을 하늘, 블록 픽셀 질감, 빛 번짐, 반딧불과 벚꽃잎
- 조작: WASD·방향키 이동, 마우스 시점, Shift 질주, Space 점프
- 게임: 타이틀 화면, 나침반·타이머, 일시정지, 다 모으면 불꽃놀이 축하 장면
- 기술 스택(React, Three.js, Vite), 파일 구조, 구현 순서
2단계 · 코딩 도구에서
PLAN.md대로 게임을 구현해줘. 고급 게임처럼 보이게 만들어줘.
다 만들면 직접 플레이해서 구슬 7개를 모두 모을 수 있는지 확인해줘.
기대 효과
복잡한 프로젝트일수록 채팅에서 PLAN.md를 먼저 설계하고, 코딩 도구에서 실행합니다. 코딩 전에 설계하는 습관이 완성도를 결정합니다.
7가지를 모두 만들었나요?
만든 프로젝트를 인터넷에 공개할 차례입니다.
GitHub에 올리면 내 작품이 전 세계 어디서나 열리는 URL을 갖습니다.