PPP 이야기 서재
평생과정설계(PPP) 이용자의 초기접수 · 꿈과 계획 · 프로그램 이용 · 상담·회의 · 평가 기록을 이용자별 “한 권의 책”으로 모아 보고 분석하는 실무자용 웹앱입니다.
저장 방식은 두 가지입니다. js/config.js에 Supabase 주소·공개 키가 있으면 로그인 후 Supabase 서버에 저장하고(직원 명단·RLS로 보호), 비어 있으면 브라우저 저장 시제품 모드로 동작합니다. 아래 “데이터 저장 주의사항”은 시제품 모드 기준입니다. 서버 설정은 supabase/README.md.
대상 사용자
복지관 실무자(담당 사회복지사). 당사자·보호자가 직접 사용하는 화면은 범위 밖입니다.
주요 기능
| 화면 | 내용 |
|---|
| 마을(첫 화면, 3D) | 입구부터 준비·계획·실천·평가 마을. 집 1채 = 이용자 1명. 굴뚝 연기(최근 14일 활동), 노란 깃발·‘확인 필요’ 표지(모니터링 확인 필요), 마당 꽃(달성 목표). 집에 들어가면 현관(초기접수)·거실(한눈에 보기)·꿈의 방(목표)·활동실(프로그램)·상담실(상담·회의)·추억의 방(평가·타임라인)을 고르고, 오른쪽 창에서 기록을 보고 추가 |
| 서재 | 준비·계획·실천·평가 단계별 서가에 이용자 책이 꽂혀 있음. 검색·단계·담당자 필터, 정렬, 서가/목록 보기 전환, 현황 지표(단계 분포, 이번 달 참여·상담, 모니터링 확인 필요) |
| 펼친 책(개인) | 왼쪽: 나를 소개합니다(꿈·강점·좋아하는 것·편안하게 하는 방법·우선 영역·단계 진행). 오른쪽 목차: 한눈에 보기 / 1장 초기접수 / 2장 꿈과 계획 / 3장 프로그램 이용 / 4장 상담·회의 / 5장 평가 / 부록 타임라인 |
| 분석 | 기간(3·6·12개월)별 영역 참여, 월별 추이, 우선순위 영역, 목표 달성 현황, 담당자별 현황 |
| 데이터 관리 | JSON 백업·복원(구조 검증 후 복원), 가상 샘플 불러오기, 전체 삭제 |
| 공통 | 글자 크기 4단계, PDF 저장(인쇄), 키보드 조작, 모바일 대응 |
실행
빌드가 필요 없습니다.
# 저장소 루트에서
python3 -m http.server 8000
# 브라우저에서 http://localhost:8000 접속
index.html을 파일로 직접 열어도 동작하지만, 로컬 서버 실행을 권장합니다.
배포 (Vercel)
- Vercel에서 이 저장소를 Import
- Framework Preset: Other, Build Command: 비움, Output Directory:
.(루트)
- 배포 후 접근 제한(Vercel 비밀번호 보호 또는 기관 SSO)을 반드시 설정 — SECURITY.md §3
사용법
- 처음 열면 가상 샘플 데이터(12명)가 자동으로 들어갑니다.
- 마을에서 집을 누르거나 왼쪽 ‘집 목록’에서 이름을 고르면 집 안으로 들어갑니다. 방을 누르면 그 장의 기록이 열립니다. 드래그로 이동, 휠로 확대, Shift+드래그(또는 ⟲⟳ 버튼)로 회전, Esc로 나가기.
- 서재에서 책을 누르면 그 사람의 책이 펼쳐집니다. 목차(탭)에서 장을 고르고
＋ 버튼으로 기록을 추가합니다. (탭은 ←/→ 키로 이동)
- 새 이용자는
＋ 새 이용자 등록 → 저장하면 바로 1장(초기접수)이 열립니다.
- 책의
PDF·인쇄를 누르면 모든 장이 순서대로 인쇄됩니다. 인쇄 대화상자에서 “PDF로 저장”을 고르세요.
- 실제 사용 전 데이터 관리 → 모든 데이터 지우기로 샘플을 비우세요.
데이터 저장 및 백업 주의사항
- 데이터는 이 브라우저의
localStorage에만 저장됩니다. 다른 PC·다른 브라우저와 자동 동기화되지 않습니다.
- 암호화·로그인·사용자별 권한이 없습니다. 같은 PC를 쓰는 사람은 누구나 볼 수 있습니다.
- 브라우저 방문 기록/사이트 데이터 삭제, 사생활 보호 모드 종료 시 데이터가 사라집니다.
- 정기적으로 데이터 관리 → 백업 파일 내려받기를 하고, 백업 파일은 기관이 정한 보안 저장소에만 보관하세요(USB·개인 메일 금지).
- 복원은 현재 데이터를 전부 덮어씁니다.
문서
