강한 시작과 반복 구조로 만든 정보 설계
초반은 대형 헤드라인, 제품 실사, 원형 포인트 모듈로 첫 인상을 빠르게 고정하고, 이후에는 질문형 섹션·비교 블록·후기 카드·FAQ·스펙 표를 순차적으로 배치해 긴 콘텐츠를 단계별로 읽히게 했습니다. 특히 플러스 아이콘, 캡슐형 라벨, 날짜형 소제목, Q 번호처럼 반복되는 구분 장치를 사용해 스크롤 중에도 현재 정보의 성격을 즉시 파악할 수 있도록 구성했습니다.
PROJECT — 22 / 63
DETAIL PAGE DESIGN
노란 포인트로 정리한 레이어드 상세 페이지노란 포인트로 정리한 레이어드 상세 페이지
Layered Yellow Editorial DetailSCROLL TO EXPLORE ↓
DESIGN POINTS
옐로우 중심의 시각 언어와 다양한 표현 레이어
전체 화면은 노란 배경 히어로, 반투명 오버레이 박스, 캡슐형 강조 띠, 말풍선 윤곽선, 금지 아이콘, 하이라이트 박스 등 여러 방식의 노란 요소를 반복해 통일감을 만듭니다. 여기에 실사 제품 컷, 재료 스테이징, 반려견 사진, 메신저 UI 캡처, 워터마크 타이포, 곡선 화살표와 원형 도식이 겹치며 단조롭지 않은 편집 리듬을 형성합니다.
중앙 정렬·여백·위계 대비로 확보한 가독성
굵은 한글 서체와 짧은 문장 중심의 헤드라인, 중앙 정렬 섹션 제목, 좌우 분할 카드, 2열 비교 레이아웃, 표 형식 정보가 구간 성격에 따라 명확히 나뉘어 있어 읽는 방식이 혼동되지 않습니다. 밝은 배경 위에 검정과 노랑의 대비를 유지하고, 옅은 워터마크와 넓은 여백으로 배경층을 만들되 본문을 방해하지 않도록 조절해 모바일 환경에서도 스캔 읽기가 용이합니다.
POINT COLORS
Point 1#F6B400
Point 2#F3C13A
Point 3#F2F2F2
Point 4#D9E7F5
Point 5#222222
NEXT PROJECT — 23
DETAIL PAGE DESIGN