Inha University Workshop

Google AI Studio로
교육미디어 제작하기

INTERACT 모델 기반으로 프롬프트, 멀티모달 자료, 앱 프로토타입, 피드백 루프를 하나의 수업 설계 흐름으로 묶는 실습형 워크샵

Prompt Media Prototype Feedback 2026-05-02 업데이트 반영
Dr. Jewoong Moon · University of Alabama

Poster / Program Copy

워크숍 안내문은 “콘텐츠 생성”이 아니라
“수업 설계 산출물”을 약속해야 합니다.

AI Studio는 단순한 콘텐츠 생성 도구를 넘어 수업 설계의 매개가 됩니다. 본 워크숍에서는 INTERACT 모델을 기준으로 프롬프트, 멀티모달 자료, 앱 프로토타입을 하나의 수업 설계 흐름으로 묶는 절차를 실습형으로 다룹니다. 참가자는 본인의 교과 주제에 곧바로 적용 가능한 설계안과 산출물 초안을 가지고 돌아갈 수 있습니다.

강의 주요 내용

1AI Studio Build Mode 인터페이스와 핵심 버튼 살펴보기
2INTERACT 모델 기반 프롬프트·산출물 스키마 설계
3Build Mode로 교실용 앱 프로토타입 만들고 검수·공유하기
워크숍 안내 문구 · 2026-05-08 업데이트

Imagegen2 Visual Anchor

오늘의 핵심 흐름을 한 장면으로 보면
설계 → 생성 → 검수 → 공유입니다.

AI Studio workshop visual showing prompt brief, multimodal materials, app prototype, and quality gate workflow
Imagegen2 생성 시각자료: AI Studio를 콘텐츠 공장이 아니라 교수설계 스튜디오로 설명

Prompt brief

수업 목표, 학습자, 상호작용, 피드백 조건을 먼저 씁니다.

Multimodal materials

이미지, 표, 음성, 화면 흐름을 같은 학습목표에 맞춥니다.

Prototype

Build Mode에서 검수 가능한 앱 초안을 만듭니다.

Quality gate

사실성, 접근성, 개인정보, 저작권, 수업 적합성을 통과시킵니다.

Imagegen2 custom asset · workshop visual anchor · 2026-05-08

Imagegen2 Algorithm Visual

효과적인 제작 알고리즘: 목표 → 자료 → 프롬프트 → 생성 → 검수 → 개선 → 공유

효과적인 교육미디어 제작 워크플로 알고리즘 시각자료

프롬프트 맥락

목표와 자료를 먼저 고정한 뒤, 역할·조건·출력형식·검수기준을 프롬프트로 씁니다.

수업목표자료입력프롬프트 설계

멀티모달 맥락

이미지, 표, 화면, 음성은 따로 만들지 않고 같은 목표 아래에서 서로 검증하게 합니다.

자료입력생성검수

Build Mode 맥락

앱이 돌아가는지만 보지 않고 학생 행동, 피드백, 데이터 저장, 공유 위험을 함께 봅니다.

생성검수개선공유

운영 맥락

120분 안에는 하나의 산출물을 완성하고, 나머지는 같은 알고리즘으로 후속 과제로 확장합니다.

공유다음 반복
Imagegen2 custom asset · 효과적 제작 워크플로 알고리즘 · 2026-05-08

Framing

초점은 “AI로 자료 만들기”가 아니라
“학습경험을 설계하기”입니다.

콘텐츠

설명문, 이미지, 퀴즈, 활동지 초안을 빠르게 생성합니다.

상호작용

학습자가 예측하고 조작하고 비교하는 화면 흐름을 설계합니다.

피드백

오개념을 드러내고 다음 행동을 안내하는 정보를 제공합니다.

평가

정답만 보지 않고 상호작용 전체에서 관찰 증거를 남깁니다.

근거: 기존 2026-04-28 덱의 문제 제기 확장

2025-2026 Research Update

최근 연구는 “도구 소개”보다
설계·검수·책임 있는 활용 역량을 강조합니다.

Prompting as curriculum

고등교육 프롬프트 엔지니어링 리뷰는 프롬프트를 학습 산출물의 품질을 조절하는 교육과정 요소로 봅니다.

Lee & Palmer, 2025

Pedagogical use cases

최근 체계적 문헌고찰은 생성형 AI 활용을 콘텐츠 제작, 피드백, 튜터링, 평가 지원 등 수업 활동 단위로 분류합니다.

Qian, 2025

Classroom integration gap

수업 적용 리뷰는 생성형 AI가 여러 전공에 확산됐지만 실제 교실 전략은 도구 유형, 과목, 활동 구조에 따라 다르게 설계해야 한다고 봅니다.

Wang et al., 2025

Teacher readiness

2026년 교원 연구 종합은 태도와 실천이 빠르게 변하지만 정책, 윤리, 수업 설계 지원이 함께 필요하다고 정리합니다.

Baggia et al., 2026
덱 보강 방향: 그래서 이 워크숍은 “좋은 프롬프트 몇 개”가 아니라 INTERACT brief, output schema, Build Mode prototype, quality gate를 하나의 설계 루프로 묶습니다.
최근 자료조사 반영 · prompt engineering, GenAI pedagogy, HE policy literature · 확인일 2026-05-08

Learning Outcomes

워크샵 후 참가자가 가져갈 수 있어야 하는 것

1. 설계 문제 정의

학습목표, 대상 학습자, 예상 오개념, 매체 조건을 하나의 brief로 정리한다.

2. AI Studio 화면 이해

Prompt box, AI Chips, Gallery, Annotation, Code tab, Share/Deploy 버튼의 용도를 설명한다.

3. 멀티모달 자료 제작

텍스트, 이미지, 음성, 표, 화면 흐름을 같은 학습목표에 맞춰 생성한다.

4. 구조화 산출물 생성

JSON/표/루브릭을 통해 AI 결과를 재사용 가능한 수업 데이터로 바꾼다.

5. 산출물 활용

앱 링크, GitHub repo, ZIP, JSON, 이미지/음성 자료를 LMS와 수업활동으로 연결한다.

6. Antigravity 연동

AI Studio 시제품을 Antigravity에서 개선·검증·배포 가능한 수업도구로 발전시킨다.

근거: UTK worksheet + AIL606/CAT100 activity plan 통합

Workshop Flow

120분 웨비나 운영안: 설명은 짧게, 실습은 바로

0-10분워크숍 목표, 계정/브라우저 확인, 민감정보 금지 안내
10-25분AI Studio 화면·Build Mode·Annotation GIF 빠른 투어
25-45분INTERACT brief와 시스템 지시문 작성
45-70분멀티모달 sidecar guide로 이미지/스크린샷/표 테스트
70-100분Build Mode로 미니 앱 초안 제작·수정
100-120분검수 체크리스트, 공유 방식, Antigravity 다운로드/후속 경로
운영 원칙: 세 가지 실습 시나리오를 모두 완성하지 않습니다. 참가자는 하나만 선택하고, 나머지는 수업 적용 아이디어로 가져갑니다.
2시간 웨비나 기준 · 실습 1개 완성 + 후속 경로 안내

Before We Start

실습 전에 확인할 계정·권한·자료 체크리스트

브라우저와 계정

Chrome 또는 Edge에서 Google AI Studio 접속을 확인합니다. 학교 Google Workspace 계정이 막히면 개인 Google 계정으로 대체합니다.

수업 주제 1개

실제 강의에서 쓰고 싶은 개념, 활동, 오개념, 평가 기준을 하나 가져옵니다. 빈 화면에서 시작하지 않습니다.

민감정보 금지

학생 이름, 학번, 얼굴, 음성, 성적, 상담 기록, 비공개 자료는 넣지 않습니다. 필요하면 P01/P02처럼 익명화합니다.

GitHub 선택

Antigravity나 외부 개발 흐름까지 해볼 사람은 GitHub 계정을 준비합니다. 수업 적용만 볼 사람은 선택 사항입니다.

Cloud/Firebase 선택

Cloud Run, Firebase, 외부 API 연결은 고급 경로입니다. 비용과 권한이 생길 수 있으므로 워크샵에서는 시연 또는 선택 실습으로 둡니다.

대체 산출물

배포가 안 되면 screenshot, 짧은 시연 영상, prompt brief, JSON/표 산출물만으로도 LMS 적용 계획을 만들 수 있습니다.

운영 체크: Google AI Studio Build Mode access, sharing, deployment, API key security 기준

2026 Snapshot

AI Studio Build Mode는 이제
agent-assisted full-stack 제작 환경입니다.

교수설계 brief목표, 학습자, 상호작용, 피드백, 검수 기준
→
Full-stack appReact 기본값, server-side Node runtime, npm packages
→
Agent iterationAntigravity Agent가 다중 파일 수정과 실행 검증 지원
→
출고 경로Share, GitHub, ZIP, Cloud Run, LMS 자료화

교육적으로 중요한 변화는 “코드를 얼마나 아는가”보다, 수업 목표·상호작용·데이터·보안 기준을 얼마나 정확히 말하고 검수하는가입니다.

출처: Build apps in Google AI Studio docs · 2026-04-28 업데이트 기준

Capability Map

워크샵에서 다룰 최신 기능 지도

Full-stack Build Mode

프론트엔드 화면뿐 아니라 server-side logic, secure API calls, npm package를 포함한 앱 초안을 자연어로 만듭니다.

Secrets Manager

외부 API 키와 자격증명을 Settings에서 보관하고, 수업용 앱 코드에 직접 노출하지 않도록 설계합니다.

Firebase / Auth

Firestore 같은 지속 저장소와 Google 로그인 흐름을 붙여 출석, 제출, 개인화 피드백의 가능성을 시연합니다.

Antigravity Agent

AI Studio 안에서는 다중 파일 맥락을 유지하며 수정하고, 외부 Antigravity에서는 repo 단위 검증과 브라우저 테스트로 확장합니다.

Media & Live

이미지, 음성, Live API, TTS를 수업 장면·발표 코칭·스토리보드·접근성 자료로 연결합니다.

Structured Output

JSON schema로 산출물 형태를 고정해 활동지, 루브릭, LMS 데이터, 앱 상태값으로 재사용합니다.

출처: Gemini API docs, release notes, Build mode docs · 2026-05-02 확인

Actual Screen

AI Studio 시작 화면은 “기능칩 + 프롬프트 + 빌드”로 읽습니다.

Google AI Studio vibe coding start screen with prompt box, feature chips, and build button
Prompt box, AI Chips, model setting, I'm Feeling Lucky, Build button이 한 화면에 모입니다.

1. 먼저 칩을 고르기

이미지, 지도, 검색, 챗봇처럼 필요한 기능을 고른 뒤 수업 목표를 붙입니다.

2. 프롬프트는 설계서

학습자, 목표, 상호작용, 피드백, 검수 기준을 한 문단에 넣습니다.

3. Build는 시작점

처음 결과는 완성품이 아니라 live preview에서 검수할 초안입니다.

이미지 출처: Google Blog · Introducing vibe coding in Google AI Studio

Interface Anatomy

AI Studio Build Mode: 세 패널을 수업 설계 화면으로 읽기

Chat & Instructions

교수설계 언어

학습자, 목표, 오개념, 피드백 규칙을 자연어로 지정

System instructions AI Chips
Code Editor
const lesson = { goal: "예측-조작-비교", feedback: misconceptions.map(rule) };
Live Preview
Interactive Lesson
Click-to-edit Version diff
근거: UTK_PD_Faculty_Worksheet_v2의 three-panel workspace 요약

Button Map · Start

처음 시작할 때 누르는 버튼들

Prompt box · 시작 입력창

무엇을 만들지 자연어로 쓰는 곳입니다. 수업에서는 “앱을 만들어줘”가 아니라 학습목표, 학습자, 상호작용, 피드백 조건을 함께 씁니다.

시작점

AI Chips · 기능칩

이미지 생성, 지도/검색, 특정 도구처럼 필요한 기능을 프롬프트에 붙이는 빠른 선택지입니다. 교육적으로는 “어떤 매체·데이터가 필요한가”를 고르는 단계입니다.

기능 추가

I'm Feeling Lucky · 아이디어 뽑기

아이디어가 없을 때 Gemini가 앱 아이디어 프롬프트를 제안합니다. 워크샵에서는 영감용으로만 쓰고, 반드시 내 수업목표에 맞게 다시 씁니다.

아이디어 생성

Speech-to-text · 말로 입력

타이핑 대신 말로 앱 아이디어를 입력합니다. 교사는 수업 장면을 말로 설명한 뒤, 생성된 문장을 설계 brief로 정리할 수 있습니다.

음성 입력

App Gallery · 예시 보관함

이미 만들어진 예시 앱을 열어 보고 Copy App으로 복제합니다. 처음부터 만드는 것보다 “리믹스하며 배우기”에 적합합니다.

예시 리믹스

Settings · 환경 설정

프레임워크, 모델, 앱 설정, Secrets Manager(비밀키 보관함), Firebase 연결 등을 조정합니다. 실습 전에는 무료 기능과 계정 권한을 먼저 확인합니다.

환경 설정
출처: Build apps in Google AI Studio docs · 2026-04-28 업데이트

Actual Screen · App Gallery

처음부터 만들기 어렵다면 Gallery에서 리믹스합니다.

Google AI Studio App Gallery with example apps and category chips
App Gallery는 예시 앱을 보고, 카테고리별로 탐색하고, Copy App으로 수업용으로 바꾸는 출발점입니다.

교수자용 사용법

완전히 새 앱을 만들기보다, 가까운 예시를 고르고 학습목표·언어·피드백 기준만 바꿉니다.

워크샵 안내 문장

“예시를 베끼는 것”이 아니라 “구조를 읽고 내 수업 설계로 바꾸는 것”이라고 설명합니다.

이미지 출처: Google Blog · App Gallery screenshot

Button Map · Iterate

초안을 고칠 때 쓰는 버튼과 패널

Chat panel · 대화/수정 요청

수정 요청

“힌트를 단계형으로 바꿔줘”, “교사용 요약 화면을 추가해줘”처럼 기능 단위로 요청합니다.

Iterate with Gemini · 반복 수정 Prompt history · 이전 지시
Code tab · 원본 확인
// 교사가 직접 확인할 부분 questions: [...] feedbackRules: [...] localStorage keys: [...]
Edit directly · 직접 수정
Live preview · 학생 화면
Click UI → describe change
Annotation mode · 화면 선택 수정 Build issue fix · 오류 고치기
수업용 설명: Chat panel은 조교에게 말하는 곳, Code tab은 수업자료 원본을 확인하는 곳, Live preview는 학생 입장에서 눌러 보는 곳입니다.
출처: Google AI Studio Build Mode docs · annotation mode, code tab, chat iteration

Actual Screen · Annotation Mode

화면을 직접 찍고 말로 고치는 흐름을 보여줍니다.

Google AI Studio Annotation Mode showing a UI region selected and edited with a natural language request
Annotation Mode는 코드 설명 대신 “이 부분을 이렇게 바꿔줘”라고 화면 위에서 말하는 수정 방식입니다.

초보자에게 특히 중요

CSS나 컴포넌트 이름을 몰라도, 눈에 보이는 부분을 선택해 수정 요청을 만들 수 있습니다.

수업자료 검수 언어

“버튼을 크게”, “힌트를 단계형으로”, “색 대비를 높여”처럼 학습자 경험 중심으로 말하게 합니다.

이미지 출처: Google Blog · Annotation Mode GIF

Live Screen Motion · Google AI Studio

실제 화면이 움직이는 장면으로
“찍고, 말하고, 고치는” 감각을 먼저 보여줍니다.

Animated Google AI Studio Annotation Mode screen capture showing a UI area selected and edited with a natural language request
공식 Google AI Studio GIF: 앱 화면 일부를 선택하고 자연어로 수정 요청을 만드는 Annotation Mode 흐름
공식 Google Blog GIF · “Make changes to your app in a more natural way”

Button Map · Share / Export

완성 후 “어디로 보낼지” 결정하는 버튼들

버튼/기능무엇을 하나?교육 현장 활용주의
Share app
공유 링크		앱을 다른 사람에게 보여주거나 협업·시연워크샵 산출물 공유, 동료 피드백공유받은 사용자가 코드와 구조를 볼 수 있음
Deploy to Cloud Run
웹앱 배포		공개 URL로 배포수업에서 실제 사용 가능한 웹앱비용, API 키 사용량, 개인정보 처리 확인
Push to GitHub
저장소로 보내기		저장소로 내보내고 버전관리학생/교수자 포트폴리오, 코드 리뷰, Antigravity 연동공개 저장소에 키·학생정보 금지
Download ZIP
압축파일 받기		로컬 개발환경으로 가져가기Antigravity, VS Code, Cursor 등에서 후속 개발클라이언트 코드에 실제 API 키를 넣으면 노출됨
Secrets Manager
비밀키 보관함		API 키와 외부 서비스 자격증명 저장Maps, DB, 외부 API 연결서버측에서만 사용하도록 설계
출처: Build apps in Google AI Studio docs · limitations/API key security

Easy Explainer

AI Studio를 “교사용 제작실”로 설명하기

아이디어 책상Prompt box(입력창) · AI Chips(기능칩) · Gallery(예시)
→
시제품 작업대Code tab(원본) · Live preview(학생 화면) · Annotation(화면 선택 수정)
→
검수대사실성 · 접근성 · 개인정보 · 비용
→
출고문Share(공유) · GitHub(저장소) · ZIP(압축) · Cloud Run(배포)

참가자에게는 이 네 공간만 먼저 이해시키면 됩니다. 모든 버튼은 결국 “시작, 수정, 검수, 공유” 중 하나입니다.

도식: 워크샵 설명용 간단 모델

Core Claim

좋은 프롬프트는 “명령문”이 아니라
작은 교수설계 문서입니다.

대상학년, 전공, 선행지식, 언어 수준
목표관찰 가능한 수행과 성공 기준
활동예측, 조작, 설명, 비교, 수정
피드백오개념별 힌트와 다음 행동
증거로그, 답변, 루브릭, reflection
한 줄 원칙: AI가 무엇을 만들지보다, 학습자가 무엇을 하게 될지를 먼저 지정합니다.
근거: 기존 덱 7-8번 슬라이드 + INTERACT 변환

Theory Lens

INTERACT 모델: 멀티미디어 상호작용을 설계 변수로 보기

학습환경기기, 매체, 과제 맥락
→
행동 활동클릭, 조작, 말하기, 선택
→
인지·메타인지예측, 설명, 점검, 수정
→
동기·정서·결과흥미, 안전한 실패, 학습 증거

AI Studio는 이 요소들을 프롬프트 변수와 산출물 조건으로 바꿔주는 실행 환경으로 사용할 수 있습니다.

출처: Domagk, Schwartz, & Plass (2010); 기존 덱 5-6번

Imagegen2 · Domagk et al. Framework

INTERACT는 화면 효과가 아니라
학습자의 행동·인지·정서·결과를 잇는 설계 프레임입니다.

Conceptual imagegen2 visualization of the INTERACT model for interactivity in multimedia learning
Imagegen2 생성 시각화: Domagk, Schwartz, & Plass (2010)의 멀티미디어 상호작용 모델을 수업 설계 흐름으로 번역

Learning environment

기기, 매체, 과제 맥락, 시간 제약을 먼저 정합니다.

Behavioral activity

학생이 클릭, 조작, 말하기, 선택 중 무엇을 실제로 하는지 정합니다.

Cognition / metacognition

예측, 설명, 점검, 수정처럼 머릿속 활동을 밖으로 끌어냅니다.

Motivation / emotion / outcomes

안전한 실패, 재시도, 학습 증거를 결과물에 남깁니다.

근거: Domagk, Schwartz, & Plass (2010) · Imagegen2 visual interpretation

Translation Table

INTERACT를 AI Studio 입력 변수로 변환하기

이론 요소프롬프트 질문교육미디어 산출물
학습환경어떤 기기, 수업맥락, 시간 제약인가?웹앱, 활동지, 교사용 안내
행동 활동학습자가 무엇을 조작하거나 말하는가?슬라이더, 선택지, 말하기/녹음, 시뮬레이션
인지·메타인지예측과 결과를 비교하고 수정하는가?예측-확인-수정 질문, reflection prompt
동기·정서실패해도 안전하고 다시 시도할 수 있는가?힌트, 난이도 조절, 격려 문장
학습 결과무엇을 증거로 남길 것인가?로그, 루브릭, 요약 대시보드, 교사용 메모
근거: 기존 덱 6번 슬라이드 재구성

Prompt Engineering View

INTERACT는 프롬프트 요구사항 명세서입니다.

1. Context Contract

학습자, 수업 시간, 기기, 자료 범위, 금지 데이터, 접근성 조건을 먼저 고정합니다.

learner, setting, constraints

2. Interaction Contract

학습자가 반드시 해야 할 행동과 AI가 그 행동 뒤에만 할 수 있는 반응을 정의합니다.

predict → manipulate → compare → explain

3. Output Contract

텍스트가 아니라 화면, JSON, 루브릭, 교사용 메모, 로그 필드까지 산출물 구조를 지정합니다.

schema, screens, evidence

4. Verification Contract

오개념, 저선행지식, 접근성, 개인정보, 출처 환각 테스트를 통과해야 사용합니다.

test cases, acceptance criteria

핵심 전환: “좋은 앱을 만들어줘”가 아니라 “이 학습상호작용 명세를 만족하는 산출물을 만들어라”라고 지시합니다.
엔지니어링 관점: INTERACT → prompt contract → output schema → test cases

Copy-Ready Engineering Template

INTERACT 프롬프트는 7개 블록으로 설계합니다.

[ROLE] 당신은 교육미디어 설계자이자 형성평가 튜터입니다. [CONTEXT] 학습자: [수준/선행지식/오개념], 환경: [기기/시간/수업형태] [INTERACTION] 학생은 먼저 예측하고, 조작하고, 결과를 비교한 뒤 설명해야 합니다. [COGNITION] 정답 제공 전 학생 설명을 요구하고, 오개념별 힌트 ladder를 제공합니다. [AFFECT] 실패를 비난하지 말고 재시도 가능한 언어와 난이도 조절을 포함합니다. [OUTPUT] 화면 흐름, 활동 단계, JSON 데이터, 루브릭, 교사용 노트를 분리해 출력합니다. [TEST] 저선행지식 학생, 대표 오개념, 접근성, 개인정보, 출처 검증 사례를 통과해야 합니다.
워크샵용 prompt contract · INTERACT 요소를 시스템/사용자 지시문으로 변환

Schema-First Design

산출물 구조를 먼저 정하면 재사용이 쉬워집니다.

필드타입INTERACT 의미수업/앱 활용
learner_profileobject학습자와 선행지식난이도, 힌트, 예시 수준 결정
interaction_stepsarray행동 활동 순서화면 단계, 버튼, 입력 UI로 변환
misconception_rulesarray인지·메타인지 점검오답 피드백, 재시도 질문, 튜터 반응
affective_supportobject동기·정서 지원격려 문장, 실패 후 다음 행동, 난이도 조절
evidence_logarray학습 결과 증거교사용 요약, LMS 제출, 형성평가 루브릭
quality_gatesarray검수 기준사실성, 접근성, 개인정보, 저작권, 안전성
출처: Gemini API structured output docs + INTERACT prompt engineering 변환

Prompt QA

프롬프트도 테스트를 통과해야 합니다.

테스트AI Studio에 넣는 검사 질문통과 기준
Happy path평균 수준 학습자가 예상대로 예측-조작-설명을 완료하는가?단계 누락 없음, 피드백이 목표와 연결됨
오개념대표 오개념 2개를 넣었을 때 바로 정답을 말하지 않는가?힌트 ladder, 재시도 질문, 비교 활동 제공
저선행지식초보 학습자에게 용어를 과하게 쓰지 않는가?쉬운 언어, 예시, 선택 가능한 도움
접근성이미지·음성·색상 정보에 대체 경로가 있는가?alt text, 자막/전사, 키보드, 색 대비 포함
개인정보학생 식별정보나 민감자료 입력을 요구하지 않는가?최소 데이터, 로컬 저장, 익명화 안내
출처 환각자료 근거가 없는 사실을 만들어내지 않는가?모르면 “확인 필요” 표시, URL/인용 직접 검증
워크샵 운영: prompt test harness · 품질 게이트와 연결

Copy-Ready Template

교육미디어 설계 brief: 생성 전에 채우는 8문장

역할: 당신은 교육미디어 설계자입니다. 주제/목표: [학습목표]를 달성하도록 설계합니다. 학습자: [학년/전공/선행지식/예상 오개념] 상호작용: 학습자가 예측-조작-비교-수정을 하게 합니다. 자료: [교재/URL/강의안/표준/논문]만 근거로 사용합니다. 피드백: 오개념별 힌트와 재시도 질문을 포함합니다. 평가: 관찰 가능한 형성평가 증거를 남깁니다. 산출물: 활동 흐름, 화면 구성, JSON 데이터, 교사용 노트를 만듭니다.
근거: 기존 덱 7번 슬라이드 + UTK iterative cycle

Motion Demo · Prompt Assembly

좋은 프롬프트는 조각을 순서대로 붙이는 과정입니다.

1. 대상누가 배우는가?
학습자선행지식
2. 활동무엇을 하게 할 것인가?
예측조작설명
3. 피드백AI가 언제 무엇을 말할 것인가?
힌트오개념
대상: 1학년, 선행지식 낮음 활동: 예측 → 조작 → 설명 피드백: 오개념별 힌트와 재시도
설명 포인트: “앱을 만들어줘”가 아니라 수업 설계 조각을 순서대로 붙여 말합니다.
움직이는 도식: prompt brief assembly · 워크샵 설명용

System Instructions

시스템 지시문은 AI의 “교수자 역할”을 정합니다.

해야 할 것

역할, 대상, 피드백 기준, 금지된 도움, 출력 형식, 검증 절차를 분리해서 씁니다.

예: 정답을 바로 주지 말고 먼저 학습자의 예측을 요구한다.

피해야 할 것

“잘 설명해줘”, “재미있게 만들어줘”처럼 평가 기준 없는 지시문은 결과 품질을 검토하기 어렵습니다.

문제: 재미있지만 목표와 맞지 않는 자료.

워크샵 실습: 같은 학생 질문을 “격려형 튜터”, “소크라테스식 질문자”, “전공 TA” 세 역할에 넣고 반응 차이를 비교합니다.
근거: CAT100 Activity C3 System Instructions Lab

Pattern 1

멀티모달 팩트체크: 스크린샷을 비판적 읽기 자료로 바꾸기

System 당신은 미디어 리터러시 튜터입니다. 소셜미디어 게시물 이미지를 받으면, 사실 주장, 검증 신뢰도, 정서적 설득 장치, 추가 확인이 필요한 부분을 분리해 표로 제시하세요.

학습자 과제

1. 최근 7일 이내 테크/교육 관련 게시물 캡처

2. AI Studio로 주장과 신뢰도 분류

3. 고신뢰 주장 1개와 저신뢰 주장 1개를 원출처로 직접 검증

4. AI가 맞힌 것, 놓친 것, 과장한 것을 100자로 기록

근거: CAT100 Activity C1 Multimodal Fact-Check

Motion Demo · Multimodal Critique

이미지 입력은 “답변 받기”가 아니라 주장 분해 → 검증 질문으로 이어집니다.

스크린샷게시물·차트·광고
image
주장 추출사실 주장과 감정 표현 분리
claims
근거 질문어디서 확인해야 하는가?
evidence
학생 판단AI가 놓친 것 기록
critique
이미지에서 사실 주장 3개 표시 근거 부족 항목을 노란색으로 표시 학생: 원출처 확인 후 100자 반박
설명 포인트: AI의 판단을 최종 답으로 쓰지 않고, 학생 검증 과제를 만드는 중간 도구로 씁니다.
움직이는 도식: screenshot → claims → evidence questions → student critique

Pattern 2

차트 해석 코치: 데이터 시각화를 읽고 반박하게 하기

내 차트학생이 직접 만든 Excel/Sheets 차트
→
AI 해석추세, 대안 설명, 오해 가능성
→
나의 해석AI를 복사하지 않고 독립 설명
→
비교AI가 잡은 것, 놓친 것, 확장한 것
검증 규칙: “AI가 놓친 것”은 반드시 차트 안에 실제로 보이는 요소를 지칭해야 합니다.
근거: CAT100 Activity C2 Chart Interpretation Lab

Pattern 3

발표 오디오 코치: 음성을 피드백 가능한 자료로 만들기

Input

90초 발표 도입부 음성 파일

MP3/WAV

AI Feedback

속도, filler words, thesis clarity, timestamp별 개선점

audio input

Revision

같은 내용을 다시 녹음하고 한 가지 개선만 추적

before/after

핵심은 “잘했는지” 평가가 아니라, 같은 내용을 다시 수행하며 변화를 확인하는 것입니다.

근거: CAT100 Activity C4 Presentation Audio Coach; Live/TTS docs

Pattern 4

스토리보드 자산 생성: 이미지·내레이션·대체텍스트를 함께 만들기

프레임AI Studio 산출물교수설계 검토
Frame 1학습 상황 이미지, 20초 내레이션, alt textcoherence: 불필요한 장식 제거
Frame 2과정 설명 이미지, 신호어가 있는 스크립트signaling: 무엇에 주목해야 하는지 분명한가
Frame 3형성평가 장면, 피드백 문장accessibility: 시각 자료 없이도 이해 가능한가
산출물 규칙: 생성된 자산마다 prompt와 “수용/수정/폐기” 디자이너 메모를 남깁니다.
근거: AIL606 Activity G1 Storyboard Asset Generation

Structured Output

JSON으로 만들면 교육자료가 “복붙 텍스트”에서 데이터가 됩니다.

{ "learning_goals": [], "misconceptions": [], "interactions": [], "feedback_rules": [], "assessment_items": [], "teacher_notes": [] }

PPT·활동지

슬라이드 구조와 학생 워크시트로 변환

앱 데이터

Build Mode, React 컴포넌트, 퀴즈 배열 입력

루브릭

교사용 평가 기준과 피드백 문장으로 재사용

출처: Gemini API structured output docs; 기존 덱 10번

Build Mode

자연어 설계서를 앱 프로토타입으로 전환하기

설계서학습자 행동, 시스템 반응, 피드백 규칙, 평가 데이터
→
코드와 미리보기React/HTML/CSS/JS 초안, live preview, click-to-edit
→
검수와 수정View diff, 반복 수정, 접근성/보안/출처 확인

Build Mode의 장점은 “완성 앱”이 아니라, 교수자가 상호작용 아이디어를 빠르게 테스트할 수 있다는 점입니다.

출처: Build mode in Google AI Studio docs; 기존 덱 12번

Motion Demo · Build Mode Loop

Build Mode는 생성 한 번이 아니라 미리보기와 검수를 반복하는 루프입니다.

설계 brief목표, 행동, 피드백, 데이터 범위
prompt
파일 생성UI, 상태, 데이터 구조, 서버 로직
code
Live preview클릭하고 오작동을 찾기
preview
수정 요청근거 있는 변경만 반복
diff
preview: 학생 선택 후 피드백 없음 request: 오답별 힌트와 재시도 추가 check: 모바일, 키보드, 저장 범위 확인
설명 포인트: “만들기”보다 “클릭해서 결함을 찾고 구체적으로 고치기”가 핵심입니다.
움직이는 도식: design brief → generated files → live preview → revision request

Copy-Ready Prompt

Build Mode에 넣을 수 있는 설계 중심 프롬프트

중학교 과학 “물의 순환” 인터랙티브 시뮬레이션을 만드세요. 학습자는 햇빛, 온도, 바람을 조절하고 결과를 예측합니다. 시스템은 증발, 응결, 강수, 집수 변화를 시각화합니다. 각 조작 후 예측과 실제 결과를 비교하게 하세요. 오개념별 피드백, 형성평가 문항, 교사용 요약 화면을 포함하세요. 모든 코드는 한 페이지에서 실행되게 하고, 학생 데이터는 브라우저 localStorage에만 저장하세요.
근거: 기존 덱 14-15번 물의 순환 사례 확장

Prototype Example

교실 퀴즈 앱: “문항 생성”이 아니라 “수정 가능한 구조”가 핵심

요구 기능

문항 1개씩 제시, 선택 즉시 피드백, 설명, 다음 문항, 누적 점수, 최종 점수, 재시작.

교사용 편집성

문항 세트를 코드 상단의 명확한 배열/object로 배치해 교사가 직접 고칠 수 있게 합니다.

실행 조건

외부 라이브러리 없이 단일 HTML 파일로 로컬 브라우저에서 실행.

학습 조건

정답 표시보다 왜 맞고 틀렸는지 짧은 설명을 함께 제공합니다.

근거: UTK_PD_Faculty_Worksheet_v2 Build Mode prompt examples

Prototype Review

AI Studio를 접근성 설명자로 쓰기

보고서 투입

Lighthouse 또는 WAVE 접근성 결과를 업로드하거나 스크린샷으로 제공.

쉬운 언어 변환

각 이슈가 학습자에게 왜 문제가 되는지, HTML/CSS 수준의 쉬운 수정 제안으로 번역.

전후 검증

두 가지 이슈를 실제로 고치고 점수 또는 경고 수 변화로 확인.

교수자 메시지: 접근성은 “완료 후 점검”이 아니라 생성 프롬프트 안에 들어가야 하는 설계 제약입니다.
근거: CAT100 Activity C5 Accessibility Report Translator

After AI Studio

AI Studio에서 만든 작업물을 어디에 쓰나?

산출물바로 쓰는 법다음 단계
Lesson text슬라이드, 활동지, LMS 안내문 초안으로 사용교사가 사실성·난이도·톤을 수정
JSON / table문항 배열, 루브릭, 피드백 규칙, 앱 데이터로 사용Build Mode 또는 Antigravity에서 컴포넌트 데이터로 연결
Image / storyboard도입 장면, 개념도, 상황카드, alt text와 함께 사용저작권·편향·접근성 검토 후 배포
Audio / script내레이션 초안, 발표 코칭, 듣기 자료로 사용교사 목소리/AI 음성 여부를 disclosure
Prototype app워크샵 데모, 학생 연습앱, 교수자 피드백용 시제품GitHub/ZIP/Cloud Run/Antigravity로 이어 개발
근거: Build Mode export/deploy docs + Summer 2026 AI Studio activities

Sidecar Guide · Keep This Next to AI Studio

Google AI Studio 옆에 이 가이드를 켜두고
한 기능씩 테스트합니다.

화면 배치

왼쪽에는 Google AI Studio, 오른쪽에는 이 덱을 둡니다. 슬라이드 1장당 하나의 테스트만 합니다.

Left: aistudio.google.com · Right: this guide

테스트 원칙

“신기한 결과”보다 입력, 프롬프트, 출력, 검수 기록을 남기는 것이 목표입니다.

input → prompt → output → review

금지 입력

학생 이름, 학번, 얼굴, 성적, 상담 기록, 비공개 파일, 실제 API 키는 넣지 않습니다.

완료 기준

각 테스트마다 “수업에 쓸 수 있는가?”가 아니라 “무엇을 고쳐야 하는가?”를 1개 이상 적습니다.

실습 운영 가이드 · Google AI Studio Build Mode / Gemini multimodal docs 기반

Sidecar Guide · 4 Test Cards

멀티모달 테스트는 입력 유형별로
작게 끊어서 진행합니다.

1. Image

수업 이미지, 도표, 실험 장면, 포스터를 업로드하고 핵심 주장·오개념·alt text를 뽑습니다.

5 min

2. Screenshot

웹페이지나 앱 화면을 캡처해 UI 문제, 학습자 행동, 접근성 개선점을 찾습니다.

7 min

3. Table / CSV

작은 데이터 표를 넣고 패턴, 이상치, 학생 질문, 차트 아이디어를 생성합니다.

8 min

4. Audio / Video

가능한 계정에서만 짧은 발표 음성이나 동영상을 넣고 피드백 기준을 테스트합니다.

optional
실패해도 통과: 기능이 계정에서 안 보이면 같은 프롬프트를 텍스트 설명이나 스크린샷으로 대체하고, “대체 경로”를 기록합니다.
실습 운영 가이드 · 이미지/스크린샷/표/오디오 입력 분리

Sidecar Guide · Copy-Ready Prompts

옆에 띄워놓고 그대로 복사해
내 자료만 바꿔 넣습니다.

Image / screenshot 이 자료를 수업 활동으로 쓰려고 합니다. (1) 학생이 먼저 관찰해야 할 것, (2) 오해하기 쉬운 부분, (3) 확인 질문 3개, (4) 접근성용 alt text, (5) 수업 전 검수할 위험을 표로 정리해 주세요.
Chart / table 이 표/차트를 학생에게 보여주기 전에 점검해 주세요. 핵심 패턴, 가능한 잘못된 해석, 학생에게 던질 예측 질문, 반박 질문, 더 나은 시각화 제안을 구분해 주세요.
Audio / presentation 이 발표 음성을 피드백해 주세요. 내용 정확성보다 도입의 명확성, 속도, filler, 핵심 주장, 학생/청중이 놓칠 수 있는 지점을 timestamp 중심으로 정리해 주세요.
Build Mode app idea 위 자료를 바탕으로 학생이 예측하고, 조작하고, 결과를 비교하고, reflection을 남기는 1화면 미니 앱을 설계해 주세요. 화면 구성, 입력, 피드백, 교사용 검수 기준을 분리해 주세요.
실습 운영 가이드 · 바로 복사 가능한 멀티모달 프롬프트

Sidecar Guide · Review Before Use

멀티모달 결과는 “맞아 보임”이 아니라
검수 게이트를 통과해야 합니다.

입력 출처이미지·표·오디오가 내가 사용할 권한이 있는 자료인가?
AI의 과잉해석이미지에 보이지 않는 원인, 의도, 정체성을 AI가 단정하지 않았는가?
수업목표 정렬결과가 예쁘거나 길기만 한 것이 아니라 학생 행동을 실제로 바꾸는가?
접근성alt text, 색 대비, 자막/대체 경로가 준비됐는가?
개인정보얼굴, 이름, 성적, 음성 등 민감정보가 포함되지 않았는가?
교수자 수정그대로 쓰지 않고 최소 1개 이상 교수자가 수정했는가?
실습 운영 가이드 · multimodal output quality gate

AI Studio → Antigravity

AI Studio 안의 agent와 외부 Antigravity를
역할별로 나눠 쓰기

AI Studio Build Mode교수설계 brief → full-stack 앱 초안 → live preview
→
내장 Antigravity Agent다중 파일 맥락, npm, 서버 로직, 실행 검증을 보조
→
GitHub / ZIP저장소 또는 압축파일로 외부 개발환경에 연결
→
외부 AntigravityEditor·Manager Surface에서 테스트, diff, screenshot, 배포 검증
워크샵 메시지: AI Studio는 이제 단순 시제품 생성기가 아니라 agent-assisted 제작실입니다. 외부 Antigravity는 장기 유지보수, 보안 점검, 브라우저 검증, 배포 전 리뷰에 더 적합합니다.
출처: Google AI Studio Build Mode docs; Google Developers Blog Antigravity 소개

Motion Demo · AI Studio to Antigravity

AI Studio 산출물은 “완성품”이 아니라 Antigravity 검증 재료로 넘깁니다.

AI Studio빠른 앱 초안과 live preview
prototype
ExportGitHub push 또는 ZIP
repo
Antigravity파일 구조, 보안, 접근성 점검
agent
Artifactsdiff, screenshot, test report
evidence
Agent plan: 데이터 흐름 먼저 설명 Run: 브라우저에서 핵심 경로 테스트 Artifact: 변경 근거와 screenshot 제출
설명 포인트: 코드보다 artifact를 보게 하면 비개발자 교수자도 품질 판단을 할 수 있습니다.
움직이는 도식: AI Studio prototype → export → Antigravity verification → artifacts

Actual Screen · Antigravity

Antigravity에서는 결과물보다 검증 artifact를 봅니다.

Google Antigravity review artifact screen showing implementation plan and manual review action
Agent가 계획과 변경 근거를 artifact로 남기면, 교수자는 코드 대신 검증 증거를 기준으로 판단할 수 있습니다.

수업도구 검증

AI가 “고쳤다”고 말한 것보다, 어떤 계획·diff·screenshot·test report를 남겼는지가 중요합니다.

학생 과제에도 적용

AI 사용 결과물을 제출할 때도 artifact를 함께 내게 하면 과정 평가가 가능합니다.

이미지 출처: Google Developers Blog · Google Antigravity

Optional Follow-Up Tool

Antigravity는 웨비나 안에서 설치하지 않고
후속 검증 도구로 안내합니다.

Google Antigravity editor view with coding agent side panel
Antigravity는 AI Studio에서 만든 앱을 저장소 단위로 열어 editor, terminal, browser, artifacts를 함께 검토하는 후속 도구입니다.

Download

https://antigravity.google/download

Windows, macOS, Linux용 public preview 다운로드 경로입니다.

웨비나 안에서 할 것

설치는 생략하고, AI Studio 결과물을 GitHub/ZIP으로 넘긴 뒤 무엇을 검증할지 흐름만 보여줍니다.

후속 실습에서 할 것

API 키 노출, 접근성, 모바일 레이아웃, 브라우저 테스트, screenshot/test artifact를 점검합니다.

공식 링크: antigravity.google/download · Google Developers Blog public preview 안내

Agentic Workflow

Antigravity에서 사용할 만한 6단계 워크플로우

1. ExportAI Studio에서 GitHub push 또는 ZIP 다운로드
2. Explainagent에게 코드 구조와 수업목표 설명 요청
3. SecureSecrets, server-side API calls, student data, permissions 점검
4. Improve접근성, 모바일 반응형, 오류 처리, UI polish
5. Verify브라우저 테스트, screenshot, test report 생성
6. PublishPR, GitHub Pages/Cloud Run, LMS 링크 배포

AI Studio 안에서 빠르게 만든 뒤, 외부 Antigravity에서는 “수정했는가”보다 “검증 증거를 남겼는가”를 중심으로 봅니다.

출처: Google Developers Blog · Editor View, Manager Surface, artifacts, browser/terminal/editor access

Copy-Ready Agent Brief

AI Studio 산출물을 Antigravity에 넘길 때 쓰는 지시문

Goal 이 저장소는 Google AI Studio Build Mode에서 만든 교육용 프로토타입입니다. Your task 1. 파일 구조와 데이터 흐름을 먼저 설명하세요. 2. 학생 개인정보나 API 키 노출 위험을 점검하세요. 3. 접근성 문제(키보드, 색 대비, alt text, label)를 고치세요. 4. 모바일 화면에서 깨지는 레이아웃을 수정하세요. 5. 브라우저에서 주요 사용자 흐름을 테스트하고 스크린샷을 남기세요. 6. 변경사항을 diff와 test report로 요약하세요. Do not 실제 학생 데이터, 실제 API 키, 민감한 파일을 생성하거나 커밋하지 마세요.
워크샵용 agent brief · Antigravity artifacts/verification 흐름 반영

Verification Artifacts

Antigravity 결과물은 “코드”만 보면 안 됩니다.

Task list

agent가 무엇을 하려 했는지 확인합니다.

Code diff

어떤 파일과 줄이 바뀌었는지 봅니다.

Screenshot

실제 UI가 의도대로 보이는지 확인합니다.

Test report

빌드, lint, 브라우저 흐름이 통과했는지 봅니다.

교수자 적용: 학생에게도 “AI가 만들었다”가 아니라 “어떤 artifact로 검증했는가”를 제출하게 하면 AI 사용이 평가 가능한 과정이 됩니다.
출처: Google Developers Blog Antigravity artifacts 설명

Classroom Deployment

AI Studio 작업물을 LMS에 넣는 4가지 방식

스크린샷/영상

앱을 직접 쓰게 하기 어렵다면 시연 영상이나 캡처를 LMS 자료로 배포합니다.

공유 링크

AI Studio share 또는 Cloud Run URL을 활동지에 연결합니다.

GitHub Pages

정적 앱이면 GitHub Pages로 공개하고 README에 AI 사용과 수정 내역을 남깁니다.

다운로드 패키지

HTML/ZIP을 LMS 파일로 올려 오프라인/로컬 실행 대안을 제공합니다.

실무 기준: 수업 공개 전 student-view 계정으로 접속, 모바일 화면, 권한 요청, 비용 발생 가능성을 점검합니다.
근거: Build Mode share/deploy/export docs + LMS 운영 경험

Hands-On Scenario Bank

실습은 세 가지 시나리오 중 하나를 골라
내 교과 주제로 바꿔 진행합니다.

시나리오 A · 개념 시뮬레이터

추상 개념을 조작 가능한 앱으로 바꿉니다. 통계, 과학, 방법론, 경제학 수업에 적합합니다.

Build Mode

시나리오 B · 멀티모달 팩트체크

이미지·스크린샷·기사 링크를 읽고 주장, 근거, 검증 행동을 분리합니다. 미디어 리터러시와 연구방법 수업에 적합합니다.

Multimodal

시나리오 C · 역할극 피드백 앱

학습자가 응답을 선택하고 즉시 피드백을 받는 분기형 연습 앱을 만듭니다. 언어, 상담, 윤리, 토론 수업에 적합합니다.

Role-play
선택 기준: 수업에서 학생이 실제로 해야 하는 행동이 “조작”, “검증”, “응답 선택” 중 무엇에 가까운지 보고 고릅니다.
Imagegen2 scenario bank · participant-facing hands-on pathways

Scenario A · Build Mode

개념 시뮬레이터: “학생이 조작하고 설명하게” 만들기

Practice scenario visual for an interactive sampling simulator app
Imagegen2 시나리오 A: 추상 개념을 조작 가능한 앱으로 전환

수업 문제

학생이 표본, 변동성, 분포 같은 개념을 공식으로만 외우고 실제 의미를 설명하지 못합니다.

Build prompt

“학습자가 먼저 예측하고, 슬라이더를 조작하고, 결과 그래프를 비교한 뒤 한 문장으로 설명하는 미니 앱을 만들어줘.”

검수 기준

예측 입력이 있는가, 조작이 결과를 바꾸는가, 피드백이 정답보다 이유를 묻는가.

실습 산출물: INTERACT brief + Build Mode prototype + quality gate checklist

Scenario B · Multimodal

멀티모달 팩트체크: AI 분석 뒤에
학생 검증 행동을 반드시 넣기

Practice scenario visual for multimodal fact-checking and evidence sorting
Imagegen2 시나리오 B: 이미지·스크린샷·출처를 비판적으로 읽는 활동

수업 문제

학생이 온라인 자료의 주장과 증거를 구분하지 않고, AI 요약을 최종 판단처럼 받아들입니다.

AI Studio prompt

“이 이미지와 링크에서 핵심 주장, 필요한 원출처, 검증 질문, 불확실한 부분을 표로 분리해줘.”

검수 기준

AI가 만든 분류를 학생이 원출처로 다시 확인하고, 틀린 판단을 수정했는가.

실습 산출물: multimodal analysis table + human verification note

Scenario C · Branching App

역할극 피드백 앱: 응답 선택 뒤
반성적 피드백을 받게 만들기

Practice scenario visual for a branching role-play feedback app
Imagegen2 시나리오 C: 분기형 대화와 피드백을 수업 활동으로 설계

수업 문제

학생이 원칙은 알고 있지만 실제 대화, 상담, 윤리 판단 상황에서 어떤 응답을 골라야 하는지 연습이 부족합니다.

Build prompt

“3개의 상황 카드와 3개의 응답 선택지를 가진 역할극 앱을 만들어줘. 선택 뒤에는 장점, 위험, 다음 질문을 보여줘.”

검수 기준

피드백이 낙인찍지 않는가, 대안 행동을 제시하는가, 학생 reflection을 남기게 하는가.

실습 산출물: branching scenario map + prototype + reflection prompt

Participant Worksheet

선택한 시나리오를 내 수업으로 바꾸는
5칸 템플릿

1. 교과 주제오늘 30분 안에 다룰 작은 개념·기술·판단 상황
2. 학습자 행동예측, 조작, 분류, 선택, 설명, reflection 중 핵심 행동
3. INTERACT 조건상호작용, 피드백, 통제권, 난이도, 학습자 지원
4. AI Studio 산출물표, 이미지, 음성, JSON, Build Mode 앱 중 하나 이상
5. 공유 전 검수사실성, 접근성, 개인정보, 저작권, 안전성, 수업 적합성
완성 기준: 예쁜 앱이 아니라 “학생 행동이 보이고, 교수가 검수할 수 있고, 수업에 넣을 다음 단계가 명확한 초안”이면 통과입니다.
Scenario bank → INTERACT brief → Build Mode prompt → quality gate

Hands-On Lab A

5분 베이스라인: 같은 질문을 다른 설정으로 실행

Run 1

기본 설정으로 학생 질문에 답하게 합니다.

Run 2

시스템 지시문을 추가합니다: “정답 전, 학생의 예측을 먼저 요청하라.”

Run 3

출력 형식을 표 또는 JSON으로 고정합니다.

기록 질문: 결과는 어떻게 달라졌고, 학생의 자신감·인지부하·검증 행동에 어떤 영향을 줄까요?
근거: UTK worksheet Activity 1 Behavioral Baseline

Hands-On Lab B

반복 설계: v1 프롬프트를 v3 수업 설계로 바꾸기

v1 직관 프롬프트“학생이 통계를 배우는 앱을 만들어줘.”
→
메타인지 멈춤무엇이 빠졌는가? 너무 일반적인가? 상호작용이 있는가?
→
v3 구조화 프롬프트역할, 대상, 상호작용, 제약, 출력 기준 추가

참가자는 자신의 교과 주제로 같은 변환을 수행하고, 어떤 설계 판단을 추가했는지 공유합니다.

근거: UTK worksheet Activity 2 Iterative Cycle

Hands-On Lab C

멀티모달 선택 실습: 하나만 깊게 해보기

Build

플래시카드, 퀴즈, 시뮬레이션 앱 초안

Image

스토리보드 이미지와 alt text

Audio

90초 발표 또는 내레이션 피드백

Data

차트 해석, CSV 요약, 그래프 생성

공유 규칙: “무엇을 만들었는가”보다 “어떤 학습 행동을 유도하려 했는가”를 먼저 말합니다.
근거: UTK worksheet Activity 3 Multimodal Exploration + CAT100/AIL606 활동

Hands-On Lab D

Build Mode 프로토타입: 30분 안에 “검수 가능한 초안” 만들기

1. 화면학습자가 보는 핵심 화면 1-3개
2. 행동클릭, 입력, 선택, 녹음, 드래그 중 하나 이상
3. 반응시스템이 즉시 보여주는 피드백
4. 증거점수, 선택 기록, reflection, 교사용 요약
5. 수정click-to-edit 또는 후속 프롬프트로 한 번 개선
6. 검수사실성, 접근성, 개인정보, 저작권 체크
출처: Build mode docs + 기존 워크샵 prompt examples

Quality Gate

수업에 넣기 전 6가지 검수

사실성출처가 실제이고 최신인가? AI가 만든 URL/인용을 그대로 믿지 않았는가?
목표 정렬활동이 학습목표의 행동동사와 연결되는가?
접근성alt text, 색 대비, 키보드 접근, 자막/대체경로가 있는가?
개인정보학생 식별정보, 얼굴, 음성, 민감자료를 불필요하게 넣지 않았는가?
저작권이미지, 텍스트, 음악, 로고 사용 권한과 공개 범위를 확인했는가?
편향·안전문화적 고정관념, 위험한 조언, 과잉 자동화가 없는가?
근거: 기존 덱 18번 검토 체크리스트 확장

Motion Demo · Quality Gate

공유 전 검수는 체크리스트가 아니라 통과 게이트입니다.

1. 사실성출처와 날짜 확인
source
2. 목표 정렬행동동사와 활동 연결
objective
3. 접근성alt text, 대비, 키보드
access
4. 안전개인정보·저작권·편향
risk
Gate 1: cited source exists Gate 2: activity matches objective Gate 3: privacy and accessibility pass
설명 포인트: “대충 괜찮다”가 아니라 수업 투입 전 통과 기준을 증거로 남깁니다.
움직이는 도식: fact → objective alignment → accessibility → privacy/copyright/safety gate

Feedback Loop

학생 행동 기록은 다음 피드백과 교수 판단의 재료입니다.

상호작용예측, 선택, 자유응답, 재시도
→
해석오개념, 전략 변화, 설명 품질
→
피드백개별 힌트, 보충자료, 재도전
→
교수자 판단다음 수업, 소그룹 지원, 루브릭 조정
주의: 모든 데이터를 모으는 것이 좋은 설계는 아닙니다. 목표와 피드백에 필요한 최소 증거만 남깁니다.
근거: 기존 덱 13, 17번 슬라이드

Participant Worksheet

인하대 워크샵용 교육미디어 설계 캔버스

학습목표학생이 워크샵 후 무엇을 설명·적용·비교·제작할 수 있어야 하는가?
학습자전공, 수준, 선행지식, 도구 접근성, 예상 불안/흥미
핵심 오개념AI가 가장 쉽게 그럴듯하게 만들지만 틀릴 수 있는 지점
상호작용예측, 조작, 비교, 수정 중 반드시 포함할 행동
AI Studio 기능structured output, image, audio, code execution, Build Mode 중 선택
검수 기준사실성, 접근성, 개인정보, 저작권, 안전성, 수업 적합성
근거: UTK participant worksheet + INTERACT matrix

Classroom Integration

Before-During-After로 수업 안팎의 역할 나누기

Before

자료 생성, 교사 검토, 활동지 준비, 예상 오개념 분류.

교수자 중심

During

예측, 조작, 토론, 실시간 피드백, 동료 비교.

학습자 중심

After

증거 해석, 보충자료, 다음 수업 개선, AI 사용 disclosure.

개선 중심
근거: 기존 덱 19번 슬라이드

Troubleshooting

자주 망가지는 지점과 바로잡는 말

문제증상구제 프롬프트
너무 일반적“좋은 설명”만 있고 활동이 없음학습자가 클릭/예측/비교할 행동을 3개 제안하라.
근거 없음그럴듯하지만 출처 불명주장별 근거 유형과 확인 필요 여부를 표로 분리하라.
과도한 장식이미지가 예쁘지만 학습목표와 무관coherence principle 기준으로 제거할 요소를 표시하라.
학생에게 정답 제공사고 과정 없이 답만 줌정답 전 예측 질문과 힌트 2단계를 먼저 제시하라.
앱이 불안정버튼/저장/점수 오류한 기능씩 테스트하고 view diff로 수정 범위를 설명하라.
근거: UTK worksheet iterative cycle + Build Mode 검수 경험

Workshop Artifact

최종 산출물 패키지: 하나의 수업 설계를 여러 실행 자료로 묶기

슬라이드

수업 도입과 설명 자료

학생 활동지

예측, 비교, reflection 기록

인터랙티브 앱

Build Mode 또는 단일 HTML 프로토타입

교사용 노트

운영 절차, 예상 오개념, 수정 힌트

평가 루브릭

목표 정렬과 피드백 기준

AI 사용 로그

prompt, 수용/수정/폐기 결정, 검증 기록

근거: 기존 덱 21번 슬라이드 + AIL606 AI-USE.md 설계

References 1 · Official Product Sources

AI Studio와 Antigravity 설명은 공식 Google 자료 기준입니다.

Google AI for Developers. (2026, April 28). Build apps in Google AI Studio.

Build Mode, full-stack runtimes, server-side logic, secure secrets management, npm support, Firebase, export/deploy limitations.

https://ai.google.dev/gemini-api/docs/aistudio-build-mode
Reshi, A., & Kampf, K. (2025, October 26). Introducing vibe coding in Google AI Studio.

Prompt-to-app workflow, App Gallery, Annotation Mode, and screenshots/GIF used in the deck.

https://blog.google/innovation-and-ai/technology/developers-tools/introducing-vibe-coding-in-google-ai-studio/
Reshi, A., & Kampf, K. (2026, March 18). Introducing the new full-stack vibe coding experience in Google AI Studio.

Antigravity coding agent, Firebase integrations, real apps, secure API key storage, multiplayer and modern web tooling.

https://blog.google/innovation-and-ai/technology/developers-tools/full-stack-vibe-coding-google-ai-studio/
Google Antigravity Team. (2025, November 20). Build with Google Antigravity, our new agentic development platform.

Editor View, Manager Surface, agent planning/execution/verification, and artifacts such as plans, screenshots, walkthroughs, and browser recordings.

https://developers.googleblog.com/en/build-with-google-antigravity-our-new-agentic-development-platform/
공식 Google 문서/블로그 · 확인일 2026-05-02

References 2 · Gemini API Capabilities

기능별 실습 아이디어는 Gemini API 공식 문서로 대조했습니다.

덱에서 쓰인 기능정확한 참고문헌URL
Structured outputGoogle AI for Developers. (2026, April 28). Structured outputs.https://ai.google.dev/gemini-api/docs/structured-output
Function callingGoogle AI for Developers. (2026, April 28). Function calling with the Gemini API.https://ai.google.dev/gemini-api/docs/function-calling
Code executionGoogle AI for Developers. (2026, April 28). Code execution.https://ai.google.dev/gemini-api/docs/code-execution
Grounding / URLGoogle AI for Developers. (2026, April 28). Grounding with Google Search; URL context.https://ai.google.dev/gemini-api/docs/google-search
https://ai.google.dev/gemini-api/docs/url-context
Image / audio / videoGoogle AI for Developers. (2026, April 28). Nano Banana image generation; Text-to-speech generation (TTS); Generate videos with Veo 3.1 in Gemini API.https://ai.google.dev/gemini-api/docs/image-generation
https://ai.google.dev/gemini-api/docs/speech-generation
https://ai.google.dev/gemini-api/docs/video
Live interactionGoogle AI for Developers. (2026, April 28). Gemini Live API overview.https://ai.google.dev/gemini-api/docs/live-api
최신성 확인Google AI for Developers. (2026, April 30). Release notes.https://ai.google.dev/gemini-api/docs/changelog
Gemini API 공식 문서 · 확인일 2026-05-02

References 3 · Recent GenAI Pedagogy

최근 연구 근거는 프롬프트·수업전략·정책 기준을 함께 봅니다.

Lee, D., & Palmer, E. (2025). Prompt engineering in higher education: A systematic review to help inform curricula.

Prompt engineering을 고등교육 커리큘럼과 학습성과 개선을 위한 설계 역량으로 정리합니다.

https://link.springer.com/article/10.1186/s41239-025-00503-7
Qian, Y. (2025). Pedagogical Applications of Generative AI in Higher Education: A Systematic Review of the Field.

생성형 AI의 교수학습 활용을 수업 맥락과 활동 유형으로 분류한 최근 리뷰입니다.

https://doi.org/10.1007/s11528-025-01100-1
Wang, P., Jing, Y., & Shen, S. (2025). A systematic literature review on the application of generative artificial intelligence (GAI) in teaching within higher education: Instructional contexts, process, and strategies.

고등교육 교실 수업 안에서 생성형 AI가 어떤 전공, 도구 유형, 수업전략, SAMR 통합 수준으로 적용되는지 정리합니다.

https://doi.org/10.1016/j.iheduc.2025.100996
An, Y., Yu, J. H., & James, S. (2025). Investigating higher education institutions' guidelines and policies regarding generative AI.

교수·학습·연구·행정에서 AI 사용 가이드라인이 다루는 개인정보, 진실성, 책임성 쟁점을 정리합니다.

https://link.springer.com/article/10.1186/s41239-025-00507-3
Baggia, A., Tratnik, A., & Brezavšček, A. (2026). University teachers' perceptions, attitudes, and practices with generative AI: A systematic literature review with a meta-analytic component.

대학 교원의 생성형 AI 인식, 태도, 실천을 종합해 교수자 지원과 정책 설계의 필요성을 보여줍니다.

https://link.springer.com/article/10.1007/s11135-026-02717-x
최근 자료조사 · 확인일 2026-05-08

References 3 · Learning Design Sources

교육미디어 설계 프레임은 INTERACT와 멀티미디어 학습 이론에 둡니다.

Domagk, S., Schwartz, R. N., & Plass, J. L. (2010). Interactivity in multimedia learning: An integrated model.

Computers in Human Behavior, 26(5), 1024-1033. 이 덱의 INTERACT 기반 prompt/design schema의 핵심 이론 근거입니다.

https://doi.org/10.1016/j.chb.2010.03.003
Mayer, R. E. (2021). Multimedia learning (3rd ed.). Cambridge University Press.

스토리보드, 이미지·내레이션·대체텍스트 검토, 불필요한 인지부하 감소 설명의 배경 문헌입니다.

https://doi.org/10.1017/9781316941355
Moon, J. (2026). Google AI Studio educational-media workshop materials.

UTK_PD_Faculty_Worksheet_v2, CAT100/AIL606/CAT531 Summer 2026 AI Studio activity plans, and the April 28 Google AI Studio educational-media deck. Unpublished instructional materials.

Local instructional source packet, checked 2026-05-02
주의: 참고문헌은 “기능 최신성”과 “교육 설계 근거”를 분리해서 읽습니다.

Google 문서는 도구 기능과 제약을, 교육학 문헌은 상호작용·멀티미디어 설계 원리를 뒷받침합니다.

Slides updated with source audit on 2026-05-02
학술 문헌 + 내부 수업 설계 자료 · 확인일 2026-05-02

Closing

프롬프트는
교육미디어의 설계 언어입니다.

AI Studio를 잘 쓰는 능력은 더 그럴듯한 문장을 만드는 능력이 아니라, 학습자의 행동, 인지, 피드백, 평가를 구조화하는 능력입니다.

Design first Generate second Verify always Iterate with evidence
Inha University Workshop · Google AI Studio for Educational Media