전자칠판/OPS 윈도우용 투명 오버레이 판서 앱. 실행하면 바로 화면 위에 필기.
제작: pi-dimension.com
npm start설치파일 빌드 (dist/에 생성):
npm run distPiPen-Setup-*.exe— 설치형(NSIS, 권장). 설치 경로 선택 가능, 사용자 계정 단위라 관리자 권한 불필요, 바탕화면·시작메뉴 바로가기 생성. 실행이 가장 빠름 (약 0.6초)PiPen-*-win-x64.zip— 무설치(권장). 압축을 푼 폴더에서PiPen.exe실행. USB에 넣어 쓰기 좋고 실행 속도는 설치형과 동일PiPen-Portable-*.exe— 단일 실행 파일. 편하지만 실행할 때마다 임시 폴더에 앱 전체를 풀기 때문에 매번 5~6초 걸립니다. 자주 켠다면 위의 zip 또는 설치형을 쓰세요
| 배포 형태 | 첫 실행 | 재실행 |
|---|---|---|
| 설치형 / zip 압축해제본 | 2.8초 | 0.6초 |
| 포터블 단일 exe | 6.1초 | 5.5초 |
코드 서명은 하지 않았기 때문에 처음 실행 시 SmartScreen 경고가 뜹니다. "추가 정보 → 실행"으로 넘어가면 됩니다.
- 왼쪽 동그란 펜 버튼: 탭하면 반투명 반원 패널이 열리고, 드래그하면 위치 이동 (화면 오른쪽으로 옮기면 반원이 반대 방향으로 뒤집힘)
- 안쪽 호: 펜 / 형광펜 / 지우개 / 마우스 / 실행취소 / 다시실행 / 설정
- 바깥 호: 선택한 도구의 하위 메뉴
- 펜·형광펜 → 자주 쓰는 색 6종 + 자동 대비 + 맨 끝 기타 색(RGB 선택)
- 지우개 → 획 지우기 / 영역 지우기 / 전체 지우기
- 설정 → 화면 고정·통과 / 터치 필기 / 팜 지우기 / 정보·업데이트 / 종료
- 두께 패널: 반원과 같은 너비로 반원에 붙어 열림. 펜·형광펜 두께, 영역 지우개 크기, 팜 인식 크기
- RGB 패널: 기타 색을 누르면 두께 패널에 이어서 열림. 채도·명도 사각형 드래그, 색상 슬라이더, R/G/B 직접 입력
- 가장자리 부착: 핸들을 화면 위/아래로 끌면 반원이 회전해 그 가장자리에 붙고, 이때 두께·RGB 패널은 반원 오른쪽(공간이 없으면 왼쪽)에 나란히 배치됨. 좌우에 붙이면 반원 아래에 세로로 배치
밝은 배경에서는 어둡게, 어두운 배경에서는 밝게 — 아래 화면의 색을 읽어 반전색으로 그립니다. 흰 슬라이드와 검은 영상이 섞여 있어도 색을 바꿔가며 쓸 필요가 없습니다.
- 투명 창은 아래 화면과 직접 블렌딩할 수 없어,
desktopCapturer로 화면을 320px 로 축소해 찍어두고 획이 지나는 지점의 색을 샘플링합니다 (3×3 평균) - 반전색이 배경과 밝기 차가 작은 회색 계열이면 검정/흰색으로 밀어내 대비를 보장합니다
- 획 중간에 배경이 바뀌면 그 지점부터 색이 따라 바뀝니다
- 자동 대비를 쓰는 동안 1.5초마다 화면을 다시 찍어 슬라이드가 넘어가도 따라갑니다
- 멀티 포인터:
pointerId별로 획을 따로 관리 → 펜 2자루 동시 필기 가능 - 팜 지우기: 접촉 면적(
event.width/height)이 임계값(기본 90px) 이상인 터치는 자동으로 영역 지우개. 접촉 크기에 비례해 지우는 반경이 커짐 - 팜 인식 크기 보정: 설정 메뉴를 열면 슬라이더가 "팜 인식 크기"로 바뀌고, 라벨에 방금 닿은 접촉의 실측값이 표시됨. 손가락으로 한 번, 손바닥으로 한 번 찍어보고 두 값 사이로 맞추면 됨 (30~220px)
- 도구·색·두께·팜 설정·툴바 위치는 자동 저장되어 다음 실행에 복원됨
- 터치 필기: 손가락 입력 허용/차단 토글 (끄면 펜과 팜만 인식)
- 필압: 펜의
pressure값으로 선 굵기 가변 - 안티앨리어싱: DPR 스케일 캔버스 + 중점 quadratic 보간
- 화면 고정: 오버레이가 입력을 잡아 필기
- 화면 통과:
setIgnoreMouseEvents로 입력을 아래 앱에 넘김 → 스크롤·클릭 가능, 기존 필기는 그대로 남아 있음. 툴바 위에 커서가 오면 자동으로 통과가 잠시 해제됨 - 마우스 도구도 동일하게 통과 모드로 동작
Windows는 입력 종류(펜/터치)별 선택적 통과를 지원하지 않아, "필기하면서 동시에 아래 화면 스크롤"은 불가능합니다. 대신 버튼 한 번으로 즉시 전환됩니다.
| 키 | 동작 |
|---|---|
| Alt+P | 펜 ↔ 마우스 전환 |
| Alt+Z / Ctrl+Z | 실행취소 |
| Alt+Y / Ctrl+Y | 다시실행 |
| Alt+X | 전체 지우기 |
| Esc | 부채꼴 메뉴 닫기 / 모달 닫기 |
- 설정 부채꼴의 정보(ⓘ) 버튼에서 현재 버전, 제작자 홈페이지(pi-dimension.com), 릴리즈 링크(github.com/cherub8128/white-board/releases), 라이선스를 확인할 수 있습니다.
- 실행 5초 후 GitHub Releases의 최신 태그를 조회해, 현재 버전보다 높으면 업데이트 모달이 뜹니다 (릴리즈 노트 표시 + 다운로드 버튼). 정보 창의 "업데이트 확인"으로 수동 확인도 가능합니다.
- 외부 링크는 앱이 지정한 화이트리스트(홈페이지·릴리즈·저장소)만 기본 브라우저로 열립니다.
MIT — LICENSE 참고.
의존성 라이선스 검증 결과는 THIRD-PARTY-NOTICES.md에 정리되어 있습니다. GPL/AGPL/LGPL/SSPL 등 카피레프트 라이선스는 없으며 전부 허용적 라이선스입니다.
npm run license-check