D20 · APPS · UX

제품·시연 사례제공된 제품 화면 · 예시 데이터

음식 주문·배달 앱

음식점 탐색부터 메뉴 선택, 장바구니, 주문 상태 확인까지 이어지는 배달 앱 화면을 제작했습니다. 선택한 메뉴와 수량이 다음 단계에서도 읽히도록 흐름을 구성했습니다.

사례
메뉴 선택과 주문을 잇는 배달 앱
수행 유형
제품·시연 사례
작업 범위
음식점 탐색·검색 · 메뉴 상세 · 수량과 요청사항 입력 · 장바구니 · 주문 상태 UI
자료
제공된 제품 화면 · 예시 데이터

음식점 탐색에서 메뉴 선택으로

카테고리와 검색으로 음식점을 좁히고, 상세 화면에서 평점·예상 시간·배달비와 메뉴를 함께 확인하도록 구성했습니다. 사진과 가격을 읽는 목록에서 메뉴 상세 패널로 이어지며, 화면 하단에는 장바구니 진입점을 유지했습니다.

수량과 비용을 확인하는 장바구니

메뉴 상세에는 수량 조절과 요청사항 입력을 배치했습니다. 장바구니에서는 항목 수량과 삭제, 프로모션 코드, 배달비·세금·팁이 포함된 비용 요약을 확인하도록 했습니다. Zustand 기반 공통 상태로 장바구니 항목과 수량 표시를 연결했습니다.

주문 상태와 빈 화면까지

진행 중 주문과 지난 주문을 구분하는 내역 화면을 구성했습니다. 장바구니가 비었을 때는 음식점 탐색으로 돌아가는 행동을 안내합니다. 목업 데이터를 사용하는 배달 앱 프론트엔드로, 탐색·선택·확인 단계와 그 사이의 상태를 함께 제작했습니다.

PROJECT INFO

  • 제작: 쿤웍스
  • 제품: 배달 앱 프론트엔드 템플릿
  • 기술: React Native · Expo · Expo Router · TypeScript · Zustand

비슷한 일을 준비 중이라면.이 사례 정보가 문의서에 함께 담깁니다.

MORE · APPS · UX

같은 분야의 다른 사례

전체 사례 보기

우리 업무에 적용한다면.

이 사례 정보가 문의서에 함께 담깁니다.

프로젝트 문의하기