2026년 9월 8일 화요일

[도덕·국어·미술] 키워드 조합형 상호 칭찬 롤링페이퍼 - 형용사 선택이 어려운 친구를 위한 글쓰기 도우미

버튼만 누르면 글쓰기가 되는 마법! — 키워드 버튼 조합형 학생 상호 칭찬 롤링페이퍼 & 바른 언어 글쓰기 도우미

✏️ 초등 4~6학년 도덕 '칭찬과 격려의 말' 및 국어 '글쓰기 도우미' 융합 — 친구들에게 글을 쓰다 보면 "별로 아무렇지 않은 것 같은데"라며 어떻게 표현해야 할지 난감할 때가 있습니다. 미리 정해진 성향 키워드 버튼 9개(성실, 배려, 유머, 긍정, 꾸준함, 협동, 창의, 책임, 공감)를 클릭만으로 조합하면 어색하지 않고 따뜻한 문장이 저절로 완성되는 상호 반응형 롤링페이퍼입니다.

📖 한 줄 정의

심기 모드(데이터 임베딩): API 데이터를 미리 받아 HTML 파일 안 상수로 박아두는 방식(앱 실행 중 외부 통신 0).

학내망 원칙: 학생 개인정보(실명·의견·성적·상담 기록)의 외부 수집·저장·전송 금지(쿼리에 학생 데이터가 담기는 외부 API 호출 포함) — 일반 공개 쿼리의 외부 호출은 허용하며, 학생 배포본은 심기 폴백(EMBED 상수)을 항상 내장한다.

1. 3대 핵심 분석 비교표

무엇이 바뀌었나요? / 영역 초보자를 위한 쉬운 설명 이렇게 한번 써보세요!
어색한 지필 메모 vs 선택형 문장 조립 빈 종이 앞에서 막막한 학생을 위해 3~4개의 긍정적 키워드를 선택하면 문법적으로 완전한 칭찬 문장이 자동 조립됩니다. [성실]+[수학]+[조원] 체크 → "매일 수학 시간마다 성실하게 알림장을 지우고 친구들을 도와주는 모습이 멋있어!" 자동 완성.
부정적 언어 차단 방식 빈칸 자유 입력 방식에서 발생할 수 있는 '곤란한 말'의 실수를 원천 차단하고 긍정적 사고의 기둥만 제공합니다. 부정 어휘 선택란이 아예 없으므로 친구들 사이에 상처를 주는 순간을 최소화합니다.
교실 벽에 띄우는 라이브 롤링페이퍼 모든 글이 모아지면 학급 전자칠판에서 종이롤처럼 자동으로 위로 넘어가며 명예의 전당처럼 보여줍니다. 학급 회의 종료 후 하루 품사 결과를 스티커 투표로 마무리.

2. 핵심 아키텍처 해설

① 문장 조립 구성 요소: KEYWORD_MAP 상수

const KEYWORD_MAP = {
  "성실": { adj: "성실하게", noun: "성실함" },
  "배려": { adj: "친구들을 배려하며", noun: "친구를 배려하는 마음" },
  "긍정": { adj: "밝게 웃으며", noun: "항상 밝은 긍정적인 태도" },
  "협동": { adj: "적극적으로 협동하며", noun: "협동심" },
  "책임": { adj: "책임감 있게", noun: "책임감" }
};

문장의 어디에 들어가느냐에 따라 형태소를 변형하는 표준 한국어 조합 사전을 상수로 내장하는 심기 모드(데이터 임베딩) 구조입니다.

② 칭찬 문장 자동 조립 엔진

function buildSentence(selectedTags, subject) {
  // 태그별 문장 시작부 필터링 및 조합
  const selKeys = selectedTags.map(t => KEYWORD_MAP[t]);
  const adjectivePart = selKeys.map(k => k.adj).join("하고 ");
  const nounPart = selKeys.map(k => k.noun).join("과 ");
  return `${subject}의 모습은 정말 ${adjectivePart} 보기 좋습니다. ${nounPart}은(는) 우리 반의 보물입니다!`;
}

표현을 접해보지 못한 초보 작가들이 토씨 하나 틀리지 않고 깔끔한 칭찬 문장을 완성할 수 있도록 문장 뼈대를 조립해 주는 혁신적 국어 학습 도구입니다.

③ 세션 기반 롤링 페이퍼 리스트

작성된 문장은 즉시 HTML 카드 리스트의 상단에 추가되어 화면 상단으로 떠오르는 부드러운 트랜지션(transition) 효과로 교실 화면에 상시 노출됩니다.

3. 초보자를 위한 바이브 코딩 실전 사용 예시

  1. 프롬프트 복사 — 아래 '제미나이 전용 에러 제로 프롬프트'를 복사합니다.
  2. 역질문 답변 — 제미나이가 묻는 키워드 버튼 주제(교실 청소, 수업 협동 등)에 답합니다.
  3. HTML 파일 실행 — 메모장에 붙여넣고 칭찬롤링페이퍼.html로 저장 후 더블클릭합니다.

제미나이 전용 에러 제로 프롬프트

[🚨 에러 방지 기본 안전장치]
1. 단일 HTML 파일 완결성: 외부 라이브러리(CDN), 외부 폰트 없이 순수 바닐라 HTML/CSS/JS로 완성한다.
2. 키워드 조합 레시피: 성향 키워드 버튼 6~9개(성실, 배려, 유머 등)를 클릭하여 자연스러운 칭찬 문장을 자동 조립하는 로직을 구현한다.
3. 학생 개인정보 0: 실명 대신 모둠 닉네임 표기만 사용하며, 익명성 보장을 위해 로그인 절차를 완전히 생략한다.
4. 심기 모드(데이터 임베딩): KEYWORD_MAP 상수에 긍정적 키워드 랜덤 문장 조립 파라미터를 기본 내장한다.
5. 롤링 효과음 및 트랜지션: 학생이 문장을 제출하면 종이가 접히는 듯한 애니메이션과 함께 새 카드가 맨 위로 올라오도록 연출한다.
6. // TODO, /* 생략 */ 등의 미완성 코드는 절대 넣지 말고 끝까지 완성한다.

[❓ 역질문 유도]
코드를 즉시 작성하지 말고, 기획을 구체화하기 위한 다음 3가지 질문을 먼저 나에게 던져줘:
1. 반 아이들이 제일 좋아하는 키워드 버튼 6개는 무엇으로 고를까요?
2. 완성된 문장은 그냥 보여줄까요, 아니면 밝은 노트용지 효과로 꾸며줄까요?
3. 문장 생성 시 양식이 똑같지 않게 하기 위해 최소 3개 이상의 랜덤 템플릿을 섞어볼까요?

🎯 에디터 한줄평

"친구를 칭찬하고 싶은데 글쓰기 실력이 부족한 아이들의 막힌 자연스러운 문장을 풀어주는 훌륭한 학습 도우미입니다. 도덕적 감수성을 기르면서 동시에 학생들이 어려워하는 한국어 형용사와 연접 조합의 문장 확장 규칙을 자연스럽게 학습하는 완벽한 실용적 도구입니다."

📚 기술·교육 참고 링크

  • 바른 말(어순 및 띄어쓰기) 표현 가이드: 긍정적 상호 피드백 언어 조립 훈련
  • 교육과정 연계: 초등 4~6학년 도덕(바라보는 눈과 칭찬), 국어(문장 완성하기와 태도)
By 시간: