플러스프로젝트 배경
[문제점] - 일반적인 그리드 형태의 포트폴리오 사이트는 사용자의 체류 시간이 짧고, '기술적 구현 능력'을 직관적으로 증명하기 어려움. - 다양한 디바이스 환경에서 고사양 그래픽 인터랙션을 구현할 때 발생하는 성능 이슈 해결 필요. [프로젝트 목표] - "보는 웹사이트"를 넘어 "만지는 웹사이트"로의 전환을 통해 사용자 참여 유도. - 크리에이티브 그룹의 정체성을 대변하는 고난이도 WebGL 기
프로젝트 성과
브랜드 몰입도 극대화
정적인 정보 전달 방식을 탈피, 사용자 행동에 반응하는 인터랙티브 요소를 통해 브랜드 인지도 제고 및 체류 시간 증대
렌더링 성능 최적화
화면 밖 렌더링 중지 및 모바일 리소스 제어 기술 적용으로 고사양 그래픽 웹사이트의 고질적인 발열 및 배터리 소모 문제 해결
운영 효율성 확보
Vanilla TypeScript 기반의 모듈형 아키텍처를 구축하여, 향후 기능 추가 및 유지보수 시 개발 생산성 향상
핵심 기능
Fluid WebGL Background
Three.js와 GLSL 쉐이더를 활용하여 마우스 커서와 모바일 기기의 기울기(자이로스코프)에 따라 실시간으로 변화하는 유체 시뮬레이션 배경 구현
프로젝트 상세
1. 프로젝트 배경 및 문제점 - 기존의 정적인 텍스트 및 이미지 위주의 포트폴리오는 크리에이티브 그룹으로서의 기술적 역량과 디자인 감각을 보여주기에 한계가 있었습니다. - 단순한 정보 전달을 넘어, 웹사이트 방문 자체가 하나의 브랜드 경험이 될 수 있는 차별화된 아이덴티티 구축이 필요했습니다. 2. 프로젝트 목표 및 과정 - Three.js와 WebGL 기술을 도입하여 사용자 인터랙션에 실시간으로
