손일 SONIL CLASS 원데이 클래스 예약 쇼핑몰 디자인

분야: 디자인 · 퍼블리싱 / 웹 / 쇼핑몰, 카페24, 반응형 참여 기간: 2026.10 관련 기술: 카페24 스마트디자인, HTML5, CSS3, JavaScript, 반응형 웹 [프로젝트 개요] 도자기, 가죽, 향, 베이킹처럼 손으로 하는 원데이 클래스를 티켓처럼 파는 몰입니다. 공방 게시판에 꽂힌 입장권을 떠올리도록 사진과 본문 사이에 절취선과 홈을 낸 티켓 카드를 만들고, 카드마다 다가오는 회차와 남은 자리를 칩으로 붙였습니다. 첫 화면에 7일 날짜 띠와 큰 가로 티켓을 두고, 아래로 이번 주 클래스, 함께 예약 계산, 주말 오전 클래스, 클래스 이용권, 공방 소개가 이어집니다. [주요 기능] 1. 티켓 카드 - 사진과 본문 사이에 점선 절취선과 좌우 반원 홈을 내고 다가오는 회차 두 개를 칩으로 붙였습니다. 남은 자리가 적으면 빨강, 마감은 회색입니다. 2. 7일 날짜 띠와 가로 티켓 - 첫 화면에 요일별 남은 자리를 띠로 보여 주고, 옆 큰 티켓에 날짜와 시간, 잔여석, 가격, 자리 잡기 버튼을 놓았습니다. 3. 함께 예약 계산 - 인원별 1인 할인표와 클래스, 인원을 고르면 1인 가격과 할인, 총 결제 금액이 바로 나옵니다. 4. 클래스 이용권 - 금액별 이용권 세 가지를 실물 티켓 모양으로 만들고 그루터기 쪽에 일련번호를 세로로 넣었습니다. 5. 클래스가 열리는 공방 - 공방 네 곳의 정원과 클래스 수를 소개합니다. [디자인] - 흰 바탕과 연한 회녹 면에 올리브를 주 버튼과 활성 표시에, 빨강을 할인과 잔여석에 썼습니다. - IBM Plex Sans KR 한 서체로 차분하게 맞췄습니다. - 카드는 4:3 비율에 모서리를 살짝 둥글렸습니다. [범위] - 메인 페이지 PC·모바일 반응형 디자인과 퍼블리싱 - 상품 카드는 반복 구조로 짜서 카페24 메인 진열 모듈로 옮길 수 있는 구조