정보 설계
페이지는 히어로 비주얼로 주제를 즉시 인지시킨 뒤, 2단 비대칭 소개, 현장 사진 콜라주, 4열 아이콘 요약, 번호형 단계 섹션, 선택 그리드, 주문 안내 리스트로 점진적으로 전개됩니다. 각 구간은 중앙 정렬, 좌우 분할, 카드형 반복, 번호 인덱스 등 서로 다른 정보 구조를 사용해 긴 상세 내용을 성격별로 명확히 분리합니다.
PROJECT — 19 / 63
DETAIL PAGE DESIGN
붓글씨 감성과 편집형 위계가 결합된 상세 디자인붓글씨 감성과 편집형 위계가 결합된 상세 디자인
Brush-Script Editorial Detail LayoutSCROLL TO EXPLORE ↓
DESIGN POINTS
시각 표현
붉은 붓터치 배너와 손글씨 강조, 딥블루·블랙 질감 배경, 크림·화이트 여백 구간이 교차하며 아날로그 감성과 프리미엄 톤을 동시에 형성합니다. 사진은 대각선 배치, 풀블리드 클로즈업, 팬의 원형 실루엣, 선화 일러스트 오버레이 등으로 반복적인 스크롤 안에서도 장면의 밀도와 리듬을 유지합니다.
사용자 가독성
사진 위 텍스트는 반투명 박스, 높은 명도 대비, 이미지의 빈 공간 활용으로 읽기 부담을 줄이고, 긴 설명은 화이트 배경 블록과 넉넉한 여백 안에서 안정적으로 정리됩니다. 체크 아이콘, 원형 번호, 붉은 라벨, 캡슐형 버튼 같은 반복 표식은 사용자가 섹션의 역할과 읽는 순서를 빠르게 파악하도록 돕습니다.
POINT COLORS
Point 1#b30000
Point 2#173d6d
Point 3#111111
Point 4#f4ede2
Point 5#ffffff
NEXT PROJECT — 20
DETAIL PAGE DESIGN