# 프리미엄 다이닝 레스토랑 예약 서비스

> year: 2021
at: tablemanager
role: design lead, product design
team mate: 1 PO, 1 FE, 1 PD

![Image](https://upload.cafenono.com/image/slashpagePost/20240825/211522_mx12jZLTO8pzh6N4SW?q=80&s=1280x180&t=outside&f=webp)

# 프로젝트 개요

삼성카드 프리미엄 다이닝 예약은 삼성카드 프리미엄 회원들을 대상으로 한 서비스로 앱 내 스마트오더를 
통해 다이닝 레스토랑을 예약할 수 있는 서비스입니다. 화면 설계서 단계에 투입되었고 그 후 디자인 전반에 참여하였습니다.

![Image](https://upload.cafenono.com/image/slashpagePost/20240825/165952_c2lnMbOSQi8bqyphqx?q=80&s=1280x180&t=outside&f=webp)

# 디자인 방향성

프리미엄 레스토랑인 만큼 상품의 품질이 좋아보이도록 하는 콘텐츠 디자인을 구성했고 예약 서비스인 만큼 날짜 검색을 유연하게 할 수 있도록 설계했으며, 예약금을 결제할 때에도 안전하게 할 수 있도록 하였습니다. 

![Image](https://upload.cafenono.com/image/slashpagePost/20240825/170505_phhXUHhvreGTDyeKnQ?q=80&s=1280x180&t=outside&f=webp)

# 제작 과정

아래 이미지는 예약 플로우 입니다

![Image](https://upload.cafenono.com/image/slashpagePost/20240825/170714_Aqx16aeIE0ghbP72th?q=80&s=1280x180&t=outside&f=webp)

### 상품의 가치를 높여주는 콘텐츠 디자인

세련된 썸네일과 가시성 있는 정보 디자인으로 할인 혜택 및 상품 정보를 설득력 있게 제공하여 보다 쉽고 빠르게 상품을 탐색하고 구매할 수 있도록 설계하였습니다.

![Image](https://upload.cafenono.com/image/slashpagePost/20240825/171834_PuBiePt6Js98jkYyPq?q=80&s=1280x180&t=outside&f=webp)

### 적합한 시간대를 알아서 추출

원하는 날짜를 선택하면 그 날짜에 가능한 시간대만을 노출시켜 일정을 선택하기 쉽게 하였습니다. 그다음 단계에서도 언제든지 일정을 다시 바꿀 수 있도록 설계하였습니다.

![Image](https://upload.cafenono.com/image/slashpagePost/20240825/172152_6IypTnfgYuZfclmL2s?q=80&s=1280x180&t=outside&f=webp)

### 함부로 결제하지 못하게 하기 위한 구성

레스토랑 예약은 예약금이 있는 것과 아닌 것으로 구분합니다.

예약금이 있을 때 사용자가 확실하게 인지하고 넘어갈 수 있도록 화면 곳곳에 취소 수수료, 예약금에 관한 알림 요소를 놓고, 하단 버튼도 일반 예약과 다르게 ‘결제하기’라는 문구로 설정하여 헷갈리지 않도록 합니다.

또한 상단에 타임머신을 두어 다른 사람과의 예약 중복을 막았습니다.

![Image](https://upload.cafenono.com/image/slashpagePost/20240825/172654_ohXaDIgj1O9MXbSzYI?q=80&s=1280x180&t=outside&f=webp)

![Image](https://upload.cafenono.com/image/slashpagePost/20240825/172714_uCJV6MFL2Adw3uvGRl?q=80&s=1280x180&t=outside&f=webp)

# 회고

상품의 분류, 리스트 순서를 임의로 짜다 보니 감정 없는 디자인처럼 보인다는 점이 아쉬움이 남습니다.

지금보다 예약 과정을 더 간단하게 하고, 위치 정보 및 사용자 취향에 맞는 레스토랑, 다양한 콘텐츠를 보여주면 더 나은 결과물이 될 것 같습니다

For the site tree, see the [root Markdown](https://slashpage.com/yiseo.md).