● 강의 데모 · 로그인 필요없음

AI로 만든 것들

강의에서 보여드린 예시들을 모아둔 갤러리입니다 · 카드를 눌러 직접 체험해보세요 · 각 예시 하단엔 실제로 쓴 프롬프트도 있어요

🎯 코칭 · 자기이해 도구

삶의 수레바퀴

8개 영역에 점수를 매기면 레이더 차트로 균형이 보이는 코칭 셀프 체크 도구.

wheel-of-life.html →

목표 달성 계산기

현재값·목표값·기한을 넣으면 진행률과 하루 필요 페이스가 계산돼요.

goal-calculator.html →

무드 트래커

기분을 고르고 날짜를 클릭하면 달력에 색으로 쌓이는 감정 기록 도구.

mood-tracker.html →

강점카드 뽑기

카드를 뽑으면 20가지 강점 중 하나가 무작위로 나오는 아이스브레이킹용 인터랙션.

strength-cards.html →

감정 단어 카드

카드를 뽑으면 감정 단어 하나가 무작위로 나오는, 감정 어휘를 넓히는 도구.

emotion-cards.html →

🎮 게임

반응속도 테스트

초록불이 켜지는 순간 클릭! 밀리초 단위로 반응속도를 측정하는 미니게임.

reaction-game.html →

사다리타기

참가자·결과 명단을 넣고 이름을 클릭하면 사다리를 따라 결과가 나오는 그 게임.

ladder-game.html →

🧰 범용 도구

사장님 관제 대시보드

가상의 1인 베이커리 창업자를 위한 오늘의 할 일·매출 현황 대시보드 (샘플 데이터).

example-dashboard.html →

포모도로 집중 타이머

25분 집중 + 5분 휴식을 반복하는 원형 카운트다운 타이머.

focus-timer.html →

원하는 시간을 설정해 카운트다운 — 실습 시간 제한, 발표 시간 재기에 활용.

투두리스트

할 일을 추가·체크·삭제하고 진행률이 실시간으로 계산되는 기본 예시.

todo-list.html →

조편성 프로그램

참가자 명단과 조 개수를 넣으면 무작위로 조를 나눠주는 워크숍용 도구.

team-grouping.html →

간단 가계부

수입/지출을 입력하면 잔액이 실시간으로 계산되는 기초 장부.

expense-tracker.html →

키·몸무게를 넣으면 체질량지수와 체중 구간을 바로 계산.

bmi-calculator.html →

색깔 팔레트 생성기

기준 색을 고르면 배색 방식에 따라 어울리는 5색 팔레트를 만들어줘요.

color-palette.html →

QR코드 생성기

텍스트나 링크를 입력하면 QR코드가 바로 만들어져요.

qr-generator.html →

🧮

다음 강의에서 추가 예정

회계 프로그램, 심리테스트 등 새 예시가 이곳에 계속 추가됩니다.

📊 대시보드

AI 개념 정리 대시보드

LLM, 멀티모달, 토큰, RAG, 에이전트 등 핵심 용어를 한 화면에 정리했어요.

ai-concepts.html →

최신 AI 트렌드 대시보드

웹 검색으로 확인한 2026년 현재 AI 업계 트렌드 8가지 요약.

ai-trends.html →

🧠 개념 설명 데모

AI 에이전트란?

요청 → 계획 → 도구 호출 → 결과 종합 과정을 단계별 애니메이션으로.

what-is-agent.html →

같은 질문에 스킬 없이 vs 스킬 적용 답변을 나란히 비교해봐요.

what-is-skill.html →

프롬프트 엔지니어링 비교

허술한 프롬프트와 잘 짜인 프롬프트, 결과 차이를 눈으로 확인.

prompt-comparison.html →

토큰 계산기

텍스트를 넣으면 대략 몇 토큰인지 감을 잡아볼 수 있는 도구.

token-counter.html →

멀티 에이전트 협업

여러 에이전트가 동시에 작업을 나눠 처리하고 종합하는 과정을 시각화.

multi-agent.html →

RAG(검색 증강 생성)란?

질문 → 문서 검색 → 답변 생성으로 이어지는 흐름을 단계별로.

what-is-rag.html →

MCP 도구 연결 지도

AI가 이메일·캘린더·노션 같은 외부 도구에 연결되는 구조를 클릭해서 탐색.

what-is-mcp.html →

Claude(Cowork)로 만든 데모 갤러리