정보 설계의 단계적 분절
전체 흐름은 대형 히어로로 시선을 고정한 뒤, 3열 가치 카드, 번호형 카드, 체크포인트, 비교형 2열 블록, 생산지·설명 섹션처럼 성격이 다른 정보 묶음을 순차적으로 배치합니다. 각 구간은 캡슐 라벨, 소제목, 대형 헤드라인, 보조 문장으로 반복 규칙을 유지해 스크롤이 길어도 구조를 빠르게 파악할 수 있게 합니다.
PROJECT — 58 / 63
WEB DESIGN
골드 포인트로 정리한 에디토리얼 웹 구성골드 포인트로 정리한 에디토리얼 웹 구성
Editorial Web Flow with Gold ContrastSCROLL TO EXPLORE ↓
DESIGN POINTS
실사와 그래픽을 겹친 시각 표현
옥수수 실사 이미지를 크게 크롭하거나 원형·카드형 프레임에 넣고, 위에 라인 일러스트, 측정선, 반원형 그래프, 점선 박스, 얇은 아이콘을 겹쳐 에디토리얼한 인상을 만듭니다. 특히 검정 배경과 화이트 타이포, 골드 오버레이, 오렌지 색면의 반복은 화면마다 다른 장면을 만들면서도 하나의 브랜드 톤으로 묶는 역할을 합니다.
중앙 정렬과 대비 중심의 가독성
대부분의 섹션이 중앙 정렬을 기반으로 구성되어 모바일 환경에서도 시선 경로가 단순하고 안정적입니다. 굵기 차가 큰 헤드라인, 절제된 본문, 넉넉한 여백, 어두운 오버레이 위 흰색 텍스트, 라운드 카드와 캡슐 배지의 반복으로 핵심 문장과 보조 정보를 명확히 분리해 읽기 부담을 줄였습니다.
POINT COLORS
Point 1#111111
Point 2#FFFFFF
Point 3#F0A81E
Point 4#F2B11A
Point 5#D9D9D9
NEXT PROJECT — 59
WEB & LANDING