--Culcom 스타일 교육원 웹사이트 클론 프로젝트
전국적으로 유명한 영어 교육기관 'culcom'의 평생교육원 사이트를 모티브로 한 이번 프로젝트는,
실제 운영되는 웹사이트의 핵심 기능들을 재구현하는 동시에 아임웹에서는 구현하기 힘든 디자인을
창의적인 요소로 더해본 작업이었습니다.
--프로젝트 하이라이트
이번 작업에서 가장 신경 썼던 부분은 사용자 경험을 향상시키는 다양한 애니메이션 효과입니다.
특히 메인 페이지에서 눈에 띄는 "떨렸던 영어가 설레어지는 곳"이라는 문구에서,
'영어가'가 '중국어가', '일본어가'로 자연스럽게 전환되는 애니메이션을 구현했습니다.
이는 단순한 텍스트 변환을 넘어, 교육원의 다양한 언어 교육 과정을 시각적으로 표현하고자 한 시도였죠.
또한, 누적 회원수를 보여주는 섹션에서는 0에서 990,000까지 숫자가 실시간으로 카운팅되는 애니메이션을 적용했습니다.
이는 단순한 숫자 표시를 넘어, 교육원의 성장과 신뢰도를 동적으로 전달하는 효과를 주었습니다.
화면 하단에는 항상 노출되는 '스터디 잔여좌석 확인' 배너를 배치했는데,
노란색에서 주황색으로 이어지는 그라데이션 효과로 시선을 사로잡으면서도 자연스러운 UI를 구현했습니다.
-- 기술적 특징
네비게이션 메뉴에서는 smooth scroll 효과를 적용하여,
사용자가 메뉴 클릭 시 해당 섹션으로 부드럽게 이동하도록 구현했습니다.
이는 사용자 경험을 한층 더 개선하는 요소가 되었습니다.
특별히 이번 프로젝트는 제가 세 번째로 만든 포트폴리오 작업으로,
약 4시간이라는 비교적 짧은 시간 안에 완성했습니다.
기존 사이트의 디자인을 벤치마킹하면서도, 대부분의 디자인 요소들을 직접 구현했다는 점에서 의미가 있습니다.