Floor Planner 프로젝트 진행 상황 기술 스택 Nuxt 3 + Vue 3 + TypeScript vue-konva (2D 캔버스) TailwindCSS + Pinia 완료된 기능 기본 기능 방 생성 (크기 입력) 그리드 배경, 줌/팬 치수 표시 가구 시스템 가구 라이브러리 (10종) 드래그 앤 드롭 배치 다양한 모양: 사각형, 원형, 타원형, L자형 L자형 가구 방향/비율 독립 조절 (가로/세로) 드래그 리사이즈 (Transformer) 오브젝트 편집 더블클릭 또는 Enter로 편집 폼 열기 이름, 크기, 색상, 회전, 모양 수정 유효성 검사 문 시스템 문 추가/편집 벽 스냅 기능 열림 방향, 경첩 위치 설정 호(arc) 렌더링 측정 도구 두 점 사이 거리 측정 측정 모드 토글 (버튼 또는 M키) 측정 결과 화면에 표시 (cm 단위) 여러 측정 지원 측정 초기화 기능 평면도 이미지 업로드 이미지 파일 업로드 (PNG, JPEG, GIF, WebP) 투명도 조절 슬라이더 크기 조절 슬라이더 이미지 위치 드래그 이동 잠금 기능 (이동 방지) 이미지 삭제 기타 Undo/Redo 저장/불러오기 (LocalStorage) 이미지 내보내기 (PNG) 키보드 단축키 키 기능 R 회전 (90도) Delete 삭제 Enter 편집 Escape 닫기/측정 모드 종료 화살표 이동 D 문 열림 방향 H 경첩 위치 M 측정 모드 토글 Ctrl+Z 실행 취소 Ctrl+Y 다시 실행 테스트 Vitest 단위 테스트: 170개 Playwright E2E 테스트: 39개
Floor Planner
웹 기반 평면도 설계 도구 개발기