Work · 분양 · 2026.06 - 2026.08
한강 푸르지오 리버프론트 본사이트 구축
fullPage.js 기반 섹션 전환과 스크롤 연동 모션으로 분양 사이트 전체를 퍼블리싱했습니다.

Overview
한눈에 보기
- Period
- 2026.06 - 2026.08
- Role
- 메인·서브 페이지 퍼블리싱
- Stack
- fullPage.js
- AI 도구
- 반응형
- 애니메이션
Description
작업 설명
- AI 도구를 활용한 메인 페이지 및 서브 페이지 퍼블리싱
- fullPage.js 기반 스크롤 인터랙션 및 섹션 전환 기능 커스텀 구현
- 섹션별 진입 애니메이션 및 스크롤 연동 모션 구현
- 메인 비주얼, 브랜드 콘텐츠, 단지 및 분양 정보 등 전체 페이지 UI 퍼블리싱
- PC·모바일 환경에 대응하는 반응형 레이아웃 및 인터랙션 구현
- 각종 서브 페이지 UI 및 콘텐츠 퍼블리싱 전반 담당
- 티저 사이트부터 본 사이트까지 연속으로 담당 (티저 2026.06 ~ 07, 본 사이트 2026.07 ~ 08)
- 메인 GNB 기능과 섹션별 화이트·블랙 모드 전환, 메인 팝업 페이드업 노출 구현
- 인트로를 건너뛰어도 팝업과 애니메이션이 재생되도록 처리
- 오픈 콘서트 신청 폼, 안내·당첨자 발표 페이지 제작
- 오픈 이후 유지보수 담당 (2026.07 ~ 2026.09, 작업일수 20일)
섹션별 화면
PC와 모바일 모두 fullPage.js로 한 화면씩 넘어가는 구성입니다. 각 섹션의 PC 화면(왼쪽)과 모바일 화면(오른쪽)입니다.
메인 비주얼
인트로 영상이 끝나면 한강 조망 비주얼과 카피가 나타나는 첫 화면입니다. 인트로를 건너뛰어도 팝업과 애니메이션이 그대로 재생되도록 처리했고, 메인 팝업은 페이드업으로 뜨게 했습니다.
입지 가치
"FAST TO SEOUL, FIRST TO THE HANGANG RIVER" 카피 주변에 이미지 조각이 흩어져 놓이고, 한 번 더 스크롤하면 조각들이 하나로 합쳐지면서 영상이 재생되는 섹션입니다. 모바일에서는 조각 배치를 세로 화면에 맞게 다시 잡았습니다.
조경설계
흐린 배경 위에 조경 이미지를 겹쳐 보여 주는 섹션입니다. 밝은 섹션과 어두운 섹션이 번갈아 나오기 때문에 헤더와 GNB가 섹션마다 화이트·블랙 모드로 바뀌도록 설정했습니다.
커뮤니티
그리너리 라운지를 소개하는 섹션입니다. 상세 슬라이드는 첫 번째 슬라이드가 활성화된 상태로 시작하도록 했고, 오픈 직후 발견된 단계 전환 오류를 수정했습니다.
브랜드
"THE NATURAL NOBILITY" 브랜드 스토리를 이미지 콜라주로 풀어낸 섹션입니다. 검수 과정에서 브랜드 섹션 애니메이션 속도를 더 빠르게 조정했습니다.
오시는 길
지도와 주소, 대표 전화를 한 화면에 담은 섹션입니다. 지도 교체와 전화번호 스타일 수정 등 오픈 전후 변경 사항을 반영했습니다.
More