플러스프로젝트 배경
지역 매장을 탐색할 때 목록에서 확인한 공간의 위치를 지도에서 다시 찾거나, 상세 화면을 확인한 뒤 지역 필터를 다시 설정해야 하면 탐색 흐름이 끊깁니다. 온쉼은 이러한 불편을 줄이는 사용자 경험을 검증하기 위해 제작한 반응형 웹 데모입니다. 고양·파주의 웰니스 공간을 시·동 단위로 탐색하고, 지도와 목록을 오가며 상세 정보를 확인하도록 설계했습니다. 매장 정보를 편집하는 관리자 체험까지 구현해 사용자와 관
프로젝트 성과
외부에서 체험 가능한 공개 데모 완성
지역 필터, 지도·목록 연동, 상세 확인, 관리자 편집을 구현하고 로그인 없이 접속할 수 있도록 공개 배포했습니다.
PC·모바일 탐색 화면 구현
PC에서는 사진 카드와 지도를 함께 배치하고, 모바일에서는 지도·목록 전환을 제공합니다. 다양한 화면 폭에서 레이아웃을 확인하고 주요 버튼은 최소 44px 높이로 설계했습니다.
핵심 기능
지역 필터와 지도 연동
시·동 선택에 따라 매장 목록, 지도 마커, 결과 수가 함께 변경됩니다. 지도와 카드의 양방향 선택을 지원합니다.
진행 단계
요구사항·화면 흐름 설계
2026.09.
지역 탐색, 상세 확인, 상태 복원과 관리자 작업 범위 정의
프로젝트 상세
1) 포트폴리오 소개 온쉼은 고양·파주 지역의 웰니스 공간을 지도와 사진 목록으로 탐색하는 반응형 웹 데모입니다. 가까운 지역의 공간을 둘러보는 사용자를 대상으로, 지역 선택부터 상세 정보 확인까지 이어지는 흐름을 구현했습니다. 가상 매장 정보와 생성 이미지를 사용한 자체 제작 프로토타입입니다. 2) 작업 범위 요구사항 분석, 화면 흐름 설계, UI/UX 디자인, PC·모바일 반응형 구현, 지도 연동
