PROJECT — 41 / 63

DETAIL PAGE DESIGN

다크 무드와 화이트 여백의 에디토리얼 상세 구성다크 무드와 화이트 여백의 에디토리얼 상세 구성

Editorial Detail Layout with Dark ContrastSCROLL TO EXPLORE ↓
FULL DETAIL VIEW · Editorial Detail Layout with Dark Contrast100%
다크 무드와 화이트 여백의 에디토리얼 상세 구성 포트폴리오 디자인

DESIGN POINTS

01

정보 설계

상단의 히어로 인트로 이후 ‘텍스트 + 이미지’, 중앙 타이틀 패널, 좌우 교차 분할, 전면 제품컷과 클로즈업 스트립, 마지막 스펙 표로 이어지는 순차 구조를 만든다. 같은 형식을 반복하기보다 안내형 공지 블록, 분위기형 랜딩, 사용 장면 그리드, 제품군 비교, 정보표를 단계적으로 배치해 긴 페이지에서도 각 구간의 역할이 명확하다.

02

시각 표현

전체 비주얼은 화이트 배경과 짙은 네이비·블랙 계열 이미지를 크게 대비시키며, 필기체 ‘Vintage’, ‘Coffee’, ‘England’, ‘Product info’ 같은 스크립트 헤드라인으로 감성 축을 세운다. 여기에 풀폭 히어로, 라운드 코너 프레임, 원형 또는 크롭된 클로즈업, 균일한 2열 및 멀티 이미지 그리드를 섞어 포스터적 장면성과 카탈로그적 정돈감을 동시에 만든다.

03

사용자 가독성

큰 제목과 작은 보조 라벨의 위계를 분명히 나누고, 중앙 정렬과 좌측 정렬을 구간 성격에 따라 구분해 읽는 방식이 혼란스럽지 않다. 넓은 여백, 높은 명도 대비, 일정한 이미지 폭, 반복되는 스크롤 유도 장치와 챕터형 전환 덕분에 사용자는 디테일 확인, 분위기 인지, 마지막 정보 확인까지 자연스럽게 따라갈 수 있다.

POINT COLORS

Point 1#FFFFFF
Point 2#1F2437
Point 3#111111
Point 4#D9D9D9
Point 5#8B6A3D

NEXT PROJECT — 42

DETAIL PAGE DESIGN

반려동물 캠페인을 위한 경쾌한 인포그래픽 시리즈

VIEW NEXT ↗