프로젝트 배경
1) 문제점
- 오프라인 매장 방문 시 발생하는 불필요한 대기 시간과 혼잡으로 인한 고객 경험 저하
- 다수 지점(가맹점)의 재고 및 주문 내역이 통합되지 않아 실시간 현황 파악이 어려움
- 전화나 수기 예약 관리로 인한 주문 누락 및 운영 비효율 발생
2) 프로젝트 목표
- O2O(Online to Offline) 시스템 구축: 앱을 통한 사전 예약/결제 및 매장 QR 픽업 프로세스 도입
- 통합 관리 환경 제공: 본사가 전체 지점의 상품, 주문, 매출 데이터를 한눈에 파악하고 제어하는 Admin 구축
- 운영 효율화: 지점별 자동화된 주문 접수 및 처리 시스템으로 매장 운영 리소스 절감
3) 주안점
- 사용자(User)의 '예약-방문-수령' 동선을 최소화하는 직관적인 UX 설계
- 프랜차이즈 확장을 고려한 지점별 데이터 독립성 및 통합 관리 구조 설계
- 현장(매장)에서의 빠른 처리를 위한 QR 인증 시스템의 속도와 안정성 확보
***** 시연영상 https://youtu.be/E1mWGVOdHDY ******
- 오프라인 매장 방문 시 발생하는 불필요한 대기 시간과 혼잡으로 인한 고객 경험 저하
- 다수 지점(가맹점)의 재고 및 주문 내역이 통합되지 않아 실시간 현황 파악이 어려움
- 전화나 수기 예약 관리로 인한 주문 누락 및 운영 비효율 발생
2) 프로젝트 목표
- O2O(Online to Offline) 시스템 구축: 앱을 통한 사전 예약/결제 및 매장 QR 픽업 프로세스 도입
- 통합 관리 환경 제공: 본사가 전체 지점의 상품, 주문, 매출 데이터를 한눈에 파악하고 제어하는 Admin 구축
- 운영 효율화: 지점별 자동화된 주문 접수 및 처리 시스템으로 매장 운영 리소스 절감
3) 주안점
- 사용자(User)의 '예약-방문-수령' 동선을 최소화하는 직관적인 UX 설계
- 프랜차이즈 확장을 고려한 지점별 데이터 독립성 및 통합 관리 구조 설계
- 현장(매장)에서의 빠른 처리를 위한 QR 인증 시스템의 속도와 안정성 확보
***** 시연영상 https://youtu.be/E1mWGVOdHDY ******
프로젝트 성과
O2O 예약 시스템 도입으로 매장 대기 시간 단축
기존 오프라인 주문 방식 대비 주문 처리 시간을 40% 이상 단축시켰으며, QR 픽업 시스템을 통해 매장 내 혼잡도를 크게 개선했습니다.
핵심 기능

GPS 기반 지점 매칭 및 스토어 진입
사용자의 현재 위치를 기반으로 가장 가까운 가맹점을 추천하거나, 원하는 지역(강남, 성수 등)을 선택하여 해당 지점의 전용 스토어로 진입하는 프랜차이즈 특화 기능을 구현했습니다.

O2O QR 픽업 및 실시간 상태 동기화
예약 완료 시 고유 QR 코드가 발급되며, 매장에서 이를 스캔하면 별도의 확인 절차 없이 서버상의 주문 상태가 '수령 완료'로 즉시 변경되는 자동화 로직을 구축했습니다.



프랜차이즈 통합 관리자(Super Admin)
본사가 전체 가맹점 현황을 한눈에 파악하고, 신규 지점 등록 및 각 지점의 운영 정보(주소, 연락처, 마감 시간 등)를 중앙에서 통제할 수 있는 강력한 대시보드입니다.
진행 단계
기획 > UI/UX 디자인 > 프론트엔드/백엔드 개발 > QA 및 배포
2025.12.
요구사항 정의부터 관리자/사용자 기능 명세, 화면 설계, 반응형 웹앱 개발 및 서버 구축, 최종 필드 테스트까지 전 과정을 주도적으로 수행했습니다.
프로젝트 상세
***** 시연영상 https://youtu.be/E1mWGVOdHDY ******
1) 포트폴리오 소개 :
다지점(프랜차이즈) 운영 환경을 위한 O2O 기반 상품 예약 및 매장 픽업 서비스 플랫폼입니다.
일반 사용자용 예약 앱(Web/App)과 본사 및 가맹점주를 위한 통합 관리자(Admin) 시스템을 모두 포함하여 구축하였습니다. 단순 커머스를 넘어, 오프라인 매장과의 연동(QR 인증) 프로세스까지 구현된 통합 솔루션입니다.
2) 작업 범위 :
- 기획 및 화면 설계: 사용자(User) 예약 프로세스 및 관리자(Admin) 운영 프로세스 설계
- UI/UX 구현: 사용자 친화적인 모바일 반응형 웹앱 및 직관적인 관리자 대시보드 UI 구현
- 프론트엔드 개발: React/Next.js 기반의 SPA(Single Page Application) 구조 개발
- 백엔드/서버 구축: 지점별 데이터 분리, 예약/주문 처리 RESTful API 개발 및 DB 설계
3) 주요 업무 :
[사용자(User) 서비스]
- 위치 기반 지점 찾기: GPS 연동 내 주변 지점 리스트업 및 특정 지점(강남, 성수 등) 스토어 진입 기능
- 스마트 예약 시스템: 카테고리별 상품 조회, 옵션 선택, 방문 예정일 설정 및 결제/예약
- QR 픽업 인증: 예약 확정 시 고유 QR코드 발급, 매장 방문 시 스캔을 통한 즉시 수령(상태값 자동 변경)
- 마이페이지: 진행 중인 주문(Active)과 지난 내역(History) 탭 분리, 실시간 예약 상태(예약됨/수령완료/취소) 확인
[관리자(Admin) 시스템]
- 지점(가맹점) 관리: 신규 지점 등록, 지점별 정보(주소, 연락처, 운영시간) 수정 및 관리
- 상품 통합 관리: 상품명, 가격, 재고, 썸네일, 마감일 설정 등 CRUD 기능 구현
- 예약 현황 모니터링: 지점별 실시간 들어온 예약 건수 확인 및 클레임(취소) 처리 관리
4) 주안점 :
- 프랜차이즈 비즈니스 로직 반영: 지점별로 재고와 주문 데이터가 독립적으로 관리되도록 DB 및 API를 설계하여 확장성을 확보했습니다.
- O2O 경험 최적화: 사용자가 앱에서 예약 후 오프라인 매장에서 대기 없이 물건을 수령(QR 스캔)하는 경험을 끊김 없이(Seamless) 제공하는 데 집중했습니다.
- 관리 효율성: 다수의 지점과 상품을 관리자가 한눈에 파악하고 제어할 수 있도록 직관적인 대시보드 UI를 구축했습니다.
***** 시연영상 https://youtu.be/E1mWGVOdHDY ******
1) 포트폴리오 소개 :
다지점(프랜차이즈) 운영 환경을 위한 O2O 기반 상품 예약 및 매장 픽업 서비스 플랫폼입니다.
일반 사용자용 예약 앱(Web/App)과 본사 및 가맹점주를 위한 통합 관리자(Admin) 시스템을 모두 포함하여 구축하였습니다. 단순 커머스를 넘어, 오프라인 매장과의 연동(QR 인증) 프로세스까지 구현된 통합 솔루션입니다.
2) 작업 범위 :
- 기획 및 화면 설계: 사용자(User) 예약 프로세스 및 관리자(Admin) 운영 프로세스 설계
- UI/UX 구현: 사용자 친화적인 모바일 반응형 웹앱 및 직관적인 관리자 대시보드 UI 구현
- 프론트엔드 개발: React/Next.js 기반의 SPA(Single Page Application) 구조 개발
- 백엔드/서버 구축: 지점별 데이터 분리, 예약/주문 처리 RESTful API 개발 및 DB 설계
3) 주요 업무 :
[사용자(User) 서비스]
- 위치 기반 지점 찾기: GPS 연동 내 주변 지점 리스트업 및 특정 지점(강남, 성수 등) 스토어 진입 기능
- 스마트 예약 시스템: 카테고리별 상품 조회, 옵션 선택, 방문 예정일 설정 및 결제/예약
- QR 픽업 인증: 예약 확정 시 고유 QR코드 발급, 매장 방문 시 스캔을 통한 즉시 수령(상태값 자동 변경)
- 마이페이지: 진행 중인 주문(Active)과 지난 내역(History) 탭 분리, 실시간 예약 상태(예약됨/수령완료/취소) 확인
[관리자(Admin) 시스템]
- 지점(가맹점) 관리: 신규 지점 등록, 지점별 정보(주소, 연락처, 운영시간) 수정 및 관리
- 상품 통합 관리: 상품명, 가격, 재고, 썸네일, 마감일 설정 등 CRUD 기능 구현
- 예약 현황 모니터링: 지점별 실시간 들어온 예약 건수 확인 및 클레임(취소) 처리 관리
4) 주안점 :
- 프랜차이즈 비즈니스 로직 반영: 지점별로 재고와 주문 데이터가 독립적으로 관리되도록 DB 및 API를 설계하여 확장성을 확보했습니다.
- O2O 경험 최적화: 사용자가 앱에서 예약 후 오프라인 매장에서 대기 없이 물건을 수령(QR 스캔)하는 경험을 끊김 없이(Seamless) 제공하는 데 집중했습니다.
- 관리 효율성: 다수의 지점과 상품을 관리자가 한눈에 파악하고 제어할 수 있도록 직관적인 대시보드 UI를 구축했습니다.
***** 시연영상 https://youtu.be/E1mWGVOdHDY ******

GPS 기반 내 주변 지점 찾기 및 지점별 스토어 진입 화면입니다. 프랜차이즈 구조에 필수적인 '위치 기반 지점 선택 로직'을 구현하여 사용 편의성을 높였습니다.

지점별 판매 상품 리스트 및 상세 화면입니다. 카테고리 분류와 직관적인 UI를 통해 사용자가 재고를 확인하고 손쉽게 예약/결제를 진행할 수 있도록 설계했습니다.

O2O 픽업을 위한 QR 인증 화면입니다. 예약 완료 시 고유 코드가 생성되며, 매장 방문 후 스캔 시 즉시 '수령 완료' 상태로 서버에 동기화됩니다.

본사(Super Admin) 통합 관리 대시보드입니다. 전체 가맹점 리스트를 조회하고, 신규 지점 등록 및 운영 정보(주소, 연락처 등)를 중앙에서 제어합니다.

상품 등록 및 수정(CRUD) 화면입니다. 지점별 재고, 가격, 썸네일, 마감일 등을 관리자가 상세하게 설정하여 실시간으로 사용자 앱에 반영합니다.

사용자 예약 내역 화면입니다. 진행 중인 주문과 지난 내역을 탭으로 구분하고, 실시간 상태 값(예약됨/수령완료/취소)을 시각적으로 명확히 구현했습니다.



