🎯 Pick Me - 무작위 학생 선발 도구

선생님들을 위한 재미있고 공정한 학생 선발 웹 애플리케이션입니다.

소개

Pick Me는 학급에서 학생을 무작위로 선발할 때 사용하는 도구입니다. 행사 도우미, 청소 당번, 발표자 등을 선정할 때 공정하고 재미있게 뽑을 수 있습니다.

주요 특징

• 3가지 재미있는 테마 - 룰렛, 로또, 낚시 테마로 선발 과정이 즐겁습니다
• 완전 무작위 선발 - 공정한 랜덤 알고리즘으로 선발합니다
• 직접 입력 기능 - CSV 파일 없이도 모바일에서 바로 학생 이름을 입력할 수 있습니다
• 비밀 선발 기능 - CSV 파일에서 미리 지정한 학생을 우선 선발할 수 있습니다
• 성별 조건 설정 - 필요시 성별별 인원을 지정할 수 있습니다
• 결과 저장 - 선발 결과를 텍스트 파일로 저장할 수 있습니다
• 접근성 지원 - 스크린 리더와 키보드 네비게이션을 지원합니다

사용 방법

1단계: 학생 명단 불러오기

방법 1: CSV 파일 업로드 (비밀 선발 기능 사용 가능)

앱 내 "샘플 CSV 다운로드" 버튼을 클릭하여 예시 파일을 받으실 수 있습니다. 다운로드한 파일을 열어 학생 정보를 수정하고 저장하세요.

CSV 파일 형식: 학년, 반, 번호, 이름, 성별, 비밀선발 순으로 작성합니다. 비밀선발은 우선 선발할 학생에게 1, 그 외는 0을 입력합니다.

업로드 방법:

1. (선택) "샘플 CSV 다운로드" 버튼으로 예시 파일 다운로드
2. 엑셀 또는 스프레드시트에서 학생 명단 작성
3. "CSV UTF-8 (쉼표로 분리)" 형식으로 저장
4. "CSV 파일 업로드" 탭에서 파일 선택
5. 미리보기에서 확인 및 수정
6. "다음 단계" 버튼 클릭

방법 2: 직접 입력 (모바일 환경에 최적화)

CSV 파일 없이 바로 입력할 수 있습니다.

1. "직접 입력" 탭 클릭
2. 공통 정보 입력 (선택사항)
   • 학년과 반을 입력하면 모든 학생에게 동일하게 적용됩니다
3. 학생 이름 입력
   • 한 줄에 한 명씩 입력하거나
   • 콤마나 공백으로 구분하여 입력하거나
   • 엑셀/스프레드시트에서 이름 열을 복사하여 붙여넣기
4. 번호 및 성별 설정
   • "번호 자동 생성" 체크 시 1번부터 자동으로 부여
   • 성별: 여/남/표기 안 함 중 선택
5. 미리보기에서 확인 및 수정
   • 각 학생의 번호와 성별을 개별 수정 가능
   • "삭제" 버튼으로 불필요한 항목 제거
6. "다음 단계" 버튼 클릭

참고: 비밀 선발 기능은 CSV 파일 업로드 방식에서만 사용할 수 있습니다.

2단계: 선발 조건 설정

1. 총 선발 인원 (필수)

   • 뽑을 학생 수를 입력합니다

2. 성별 조건 (선택)

   • 성별 조건 체크박스를 선택하면 여학생/남학생 각각 몇 명씩 뽑을지 지정할 수 있습니다

3. 선발 역할 (선택)

   • 선발 역할을 입력하면 제일 마지막 결과 화면에 축하 메시지가 표시됩니다
   • 예: "우리 반 앰배서더", "오늘의 청소 당번"

4. "다음 단계" 버튼 클릭

3단계: 테마 선택 및 선발

1. 테마 선택

   • 🎰 룰렛: 회전하는 룰렛으로 선발
   • 🎱 로또: 공이 튀어나오는 연출
   • 🎣 낚시: 낚시로 학생 선발

2. 선발 시작

   • "🎯 선발 시작!" 버튼 클릭
   • 팁: 비밀 선발 기능을 제외하고 완전 랜덤으로 선발하려면 (일회성)
     • PC: Ctrl+Shift를 누른 채로 클릭 또는 마우스 더블 클릭
     • 모바일/태블릿: 버튼을 빠르게 두 번 탭
   • 선택한 테마의 3D 애니메이션과 배경 음악이 재생됩니다
   • 선발되는 학생이 실시간으로 화면에 표시됩니다

3. 일시 정지/재개 (선택)

   • "⏸ 일시 정지" 버튼 또는 ESC 키로 멈출 수 있습니다
   • 계속하기: 선발을 이어서 진행
   • 처음으로: 선발을 취소하고 다시 시작

4. 결과 확인

   • 선발이 완료되면 결과 화면이 표시됩니다
   • 선발 역할을 입력했다면 축하 메시지와 GIF 애니메이션이 표시됩니다

5. 결과 저장 (선택)

   • "💾 결과 저장" 버튼을 클릭하면 텍스트 파일로 저장됩니다
   • 파일명: yymmdd_hhmmss_선발결과.txt
   • 예: 250123_143025_선발결과.txt

주요 기능 상세

비밀 선발 기능

CSV 파일에서 "비밀선발" 열에 1을 입력한 학생은 우선적으로 선발됩니다.

사용 예시:

• 특정 학생에게 기회를 주고 싶을 때
• 순번 또는 역할 순서를 은밀하게 지정하고 싶을 때

학년,반,번호,이름,성별,비밀선발
1,1,3,박지민,여,1

중요: 이 기능은 CSV 파일 업로드 방식에서만 사용 가능합니다.

비밀 선발 제외 기능:

CSV 파일에 비밀 선발 학생이 지정되어 있더라도, 특정 상황에서 이를 무시하고 완전 랜덤으로 선발하고 싶을 때 사용합니다.

• PC 환경:
  • Ctrl+Shift를 누른 채로 "선발 시작!" 버튼 클릭
  • 또는 "선발 시작!" 버튼을 마우스로 빠르게 두 번 클릭
• 모바일/태블릿 환경:
  • "선발 시작!" 버튼을 빠르게 두 번 탭

이 기능은 일회성으로 적용되며, 해당 선발이 완료되면 다음 선발부터는 다시 정상적으로 비밀 선발 기능이 작동합니다.

동명이인 처리

같은 이름의 학생이 여러 명 있을 경우 자동으로 구분하여 표시합니다:

• 같은 반: "김철수 (3번)"
• 같은 학년 다른 반: "김철수 (2반 5번)"
• 다른 학년: "김철수 (2학년 1반 7번)"

성별 조건 선발

성별 조건을 사용하면 비밀 선발 학생 중 성별 조건에 맞는 학생을 먼저 선발하고, 부족한 인원은 무작위로 선발합니다.

예시: 총 5명 선발 (여학생 3명, 남학생 2명), 비밀 선발 학생 (여학생 1명, 남학생 1명) → 결과: 비밀 선발 2명 + 무작위 여학생 2명 + 무작위 남학생 1명

테마별 특징

🎰 룰렛 테마

• 화려하게 회전하는 3D 룰렛
• 빨간색 포인터가 학생을 가리킵니다
• 회전 속도가 점차 감소하여 긴장감을 줍니다
• 한 학생당 약 6초 소요

🎱 로또 테마

• 투명 돔 안에서 알록달록한 공들이 섞입니다
• 공이 튜브를 통해 튀어나오는 연출
• 여러 개의 공이 동시에 보입니다
• 한 학생당 약 6초 소요

🎣 낚시 테마

• 물속에서 헤엄치는 물고기들
• 낚시대를 던져 물고기를 낚습니다
• 물결 효과와 빛 효과가 아름답습니다
• 한 학생당 약 6초 소요

기술 스펙

• HTML5: 웹 표준 마크업
• CSS3: 현대적인 디자인과 애니메이션
• JavaScript (ES6+): 로직 처리
• Three.js: 3D 그래픽 렌더링
• Web Audio API: 효과음 및 배경 음악 생성

브라우저 지원

• Chrome (권장)
• Edge
• Firefox
• Safari
• Internet Explorer (미지원)

접근성

• ARIA 레이블로 스크린 리더 지원
• 키보드 네비게이션 지원
• ESC 키로 일시 정지 가능
• 높은 대비의 색상 사용
• 명확한 시각적 피드백

문제 해결

CSV 파일에서 한글이 깨져 보여요

• 앱 내 "샘플 CSV 다운로드" 사용을 권장해요
• 만약 한글이 깨져 보인다면 파일이 UTF-8 인코딩인지 확인하세요 (엑셀에서 "CSV UTF-8 (쉼표로 분리)"로 저장)
• 첫 번째 줄이 헤더(학년,반,번호,이름,성별,비밀선발)인지 확인하세요
• CSV 파일 작성이 어렵다면 "직접 입력" 탭을 사용하세요

소리가 안 나요

• 브라우저가 음소거 상태가 아닌지 확인하세요
• 페이지에서 한 번 클릭해야 소리가 재생됩니다 (브라우저 정책)

애니메이션이 느려요

• 다른 프로그램을 종료하고 다시 시도해보세요
• 브라우저를 최신 버전으로 업데이트하세요

결과가 저장되지 않아요

• 브라우저의 다운로드 설정과 팝업 차단 설정을 확인하세요

피드백

개선 의견이 있으시다면 GitHub Issues에 남겨주세요!

라이선스

이 프로젝트는 교육 목적으로 자유롭게 사용할 수 있습니다.

감사의 말

이 프로젝트는 선생님들의 수업을 조금이라도 더 즐겁고 편리하게 만들고자 하는 마음으로 제작되었습니다.

---

즐거운 수업 되세요! 🎉