시크릿키친 — QR 오더부터 웹푸시 알림까지, 와인바를 위한 풀스택 디지털 주문 솔루션 시크릿키친 — QR 오더부터 웹푸시 알림까지, 와인바를 위한 풀스택 디지털 주문 솔루션
- (업체) (업체)시크릿키친 (Secret Kitchen) 시크릿키친 (Secret Kitchen)
- (업종) (업종)F&B / Wine Bar / Digital Ordering System F&B / Wine Bar / Digital Ordering System
- (제공 서비스) (제공 서비스)F&B Full-stack Order Management System F&B Full-stack Order Management System
- (서비스 영역) (서비스 영역)DEVELOPMENT DEVELOPMENT
- (역할) (역할)Planning, UX/UI Design, Frontend Development, Backend Development, DB Design Planning, UX/UI Design, Frontend Development, Backend Development, DB Design
- (기술 영역) (기술 영역)Brand Website Design, QR Table Order System, Menu UX Architecture, Web Push Notification, Order DB Design & Integration, Back-office Order Management, Mobile-first Responsive Design Brand Website Design, QR Table Order System, Menu UX Architecture, Web Push Notification, Order DB Design & Integration, Back-office Order Management, Mobile-first Responsive Design
- (기술 스택) (기술 스택)SvelteKit, TypeScript, Tailwind CSS, Web Push API, Database SvelteKit, TypeScript, Tailwind CSS, Web Push API, Database
- (특징) (특징)QR code per-table session, App-free order flow via mobile browser, Real-time Web Push notification to operator, Order history DB storage & retrieval, Wine / Food / Whiskey menu UX, Dark premium brand visual system QR code per-table session, App-free order flow via mobile browser, Real-time Web Push notification to operator, Order history DB storage & retrieval, Wine / Food / Whiskey menu UX, Dark premium brand visual system
시크릿키친(Secret Kitchen)은 서울 건대입구에 위치한 캐주얼 와인바로, 전국 최저가 와인 보장과 특급 호텔 셰프의 타파스 페어링이라는 차별점을 내세우는 F&B 브랜드입니다. 이번 프로젝트는 단순한 브랜드 웹사이트 제작을 넘어, 테이블 QR 코드 스캔 → 메뉴 탐색 → 주문 → 실시간 알림 → 주문 내역 관리까지 매장 운영 전반을 커버하는 풀스택 디지털 주문 시스템 구축이 핵심이었습니다. 별도의 POS 단말기나 키오스크 없이 고객의 스마트폰과 웹 브라우저만으로 완결되는 주문 플로우를 설계해, 와인바의 감성과 운영 효율을 동시에 끌어올리는 것이 이번 작업의 목표였습니다.
시스템의 핵심은 각 테이블에 배치된 QR 코드를 스캔하면 고객이 별도 로그인이나 앱 설치 없이 즉시 해당 테이블의 주문 세션으로 진입하는 구조입니다. 메뉴 페이지에서는 와인·타파스·칵테일 카테고리를 직관적으로 탐색하고 장바구니에 담아 주문을 완료할 수 있으며, 주문이 접수되면 웹푸시(Web Push) 알림으로 매장 운영자에게 실시간 주문 알림이 전송됩니다. 모든 주문 데이터는 DB에 저장되어 주문 내역 조회·관리가 가능한 백오피스 구조로 설계되었습니다. 브랜드 디자인 측면에서는 와인바 특유의 어둡고 세련된 무드를 기조로 삼아, 고객이 QR을 스캔하는 순간부터 공간의 감도가 화면으로 이어지는 경험을 만들었습니다.
SvelteKit 기반으로 SSR과 클라이언트 라우팅을 결합해 QR 스캔 후 첫 화면 로딩 속도를 최소화했고, URL 파라미터 기반의 테이블 세션 관리로 별도 인증 없이 주문 맥락을 유지하는 경량 구조를 구현했습니다. 웹푸시는 브라우저 네이티브 Push API를 활용해 앱 설치 없이 매장 운영자의 디바이스에 주문 알림이 즉시 도달하도록 설계했으며, 주문 데이터는 DB에 실시간으로 적재되어 날짜·테이블·메뉴별 주문 현황을 언제든 조회할 수 있습니다. 결과적으로 이 솔루션은 단순한 메뉴판의 디지털화를 넘어, 브랜드 경험·주문·알림·데이터 관리를 하나의 웹 URL로 통합한 F&B 풀스택 운영 인프라로 완성되었습니다.
시스템의 핵심은 각 테이블에 배치된 QR 코드를 스캔하면 고객이 별도 로그인이나 앱 설치 없이 즉시 해당 테이블의 주문 세션으로 진입하는 구조입니다. 메뉴 페이지에서는 와인·타파스·칵테일 카테고리를 직관적으로 탐색하고 장바구니에 담아 주문을 완료할 수 있으며, 주문이 접수되면 웹푸시(Web Push) 알림으로 매장 운영자에게 실시간 주문 알림이 전송됩니다. 모든 주문 데이터는 DB에 저장되어 주문 내역 조회·관리가 가능한 백오피스 구조로 설계되었습니다. 브랜드 디자인 측면에서는 와인바 특유의 어둡고 세련된 무드를 기조로 삼아, 고객이 QR을 스캔하는 순간부터 공간의 감도가 화면으로 이어지는 경험을 만들었습니다.
SvelteKit 기반으로 SSR과 클라이언트 라우팅을 결합해 QR 스캔 후 첫 화면 로딩 속도를 최소화했고, URL 파라미터 기반의 테이블 세션 관리로 별도 인증 없이 주문 맥락을 유지하는 경량 구조를 구현했습니다. 웹푸시는 브라우저 네이티브 Push API를 활용해 앱 설치 없이 매장 운영자의 디바이스에 주문 알림이 즉시 도달하도록 설계했으며, 주문 데이터는 DB에 실시간으로 적재되어 날짜·테이블·메뉴별 주문 현황을 언제든 조회할 수 있습니다. 결과적으로 이 솔루션은 단순한 메뉴판의 디지털화를 넘어, 브랜드 경험·주문·알림·데이터 관리를 하나의 웹 URL로 통합한 F&B 풀스택 운영 인프라로 완성되었습니다.
