PENNY PAGE
CASE 38생선가게

신선함은 첫 화면에, 주문은 전화 한 통
새벽 직송 수산물

컨셉 작업 — 수산물 판매점을 설정해 만든 원페이지입니다.

업종
수산·식품 (수산물 판매점)
형태
컨셉 시안 · 원페이지
구성
가게 소개 · 제철 수산물 · 인기 상품 · 수치
고객 후기 · 예약 주문 · 오시는 길
기술 스택
반응형 HTML/CSS · Vanilla JS · IntersectionObserver · Google Fonts
생선가게 데스크탑·모바일 화면
PENNYPAGE WORKS · CASE 38

01과제

무엇을 받았고, 무엇을 했나

수산물 가게는 신선함이 첫 화면에서 보여야 하고 주문은 전화 한 통으로 끝나야 합니다. 그래서 딥블루 톤 위에 회 한 접시 히어로를 두고, 제철 수산물·인기 상품 아래에 전화 예약·행사/단체 주문·선물 세트 3가지 예약 주문 안내를 배치했습니다.

가게 소개·제철 수산물·인기 상품·수치 카운트업·고객 후기·예약 주문·오시는 길로 이어지는 원페이지로 구성했습니다.

핵심 — 전화 한 통 주문전화 예약·단체 주문·선물 세트 세 갈래로 주문 경로를 정리하고, 모든 섹션이 그 전화로 이어지게 했습니다.

02화면

히어로가 아니라 실제로 일하는 구간

제철 수산물 — 활어·선어·조개
01제철 수산물 — 활어·선어·조개
고객 후기 · 예약 주문 3종
02고객 후기 · 예약 주문 3종
마무리 CTA — 전화 주문
03마무리 CTA — 전화 주문
오시는 길 · 영업시간
04오시는 길 · 영업시간

03구성

이 사이트에 들어간 것

  • 01
    스플릿 히어로카피 · 회 한 접시 사진
  • 02
    제철 수산물 카테고리 3종활어·횟감 / 선어·구이용 / 조개·해산물
  • 03
    인기 상품 카드가격·배지 표기
  • 04
    수치 카운트업IntersectionObserver
  • 05
    고객 후기별점 카드
  • 06
    예약 주문 안내 3종전화 예약·행사/단체 주문·선물 세트
  • 07
    오시는 길 · 영업시간지도 영역 포함
  • 08
    모바일 햄버거 메뉴반응형 내비
생선가게 모바일 전체 화면

모바일 · 스크롤해서 보기

컨셉 작업입니다.

특정 고객 없이 업종 문법을 연구하려고 만든 시안입니다.