📌 Studio Gonggan 스튜디오 공간 인테리어 에이전시 웹사이트
🔹 프로젝트 개요
- 작업 기간: 2026.01 ~ 2026.02
- 작업 범위: 브랜드 아이덴티티 웹 이식, 글로벌 다국어 지원, 통합 관리자(Admin) 시스템 구축, SEO 최적화
- 사용 도구:
- Frontend: Next.js (App Router), TypeScript, Tailwind CSS, next-i18n
- Animation: GSAP, Lenis (Smooth Scroll), Framer Motion
- Backend: Supabase (Auth, DB, Edge Functions), Vercel
- Optimization: Google Search Console, Lighthouse CI
🔹 프로젝트 목적
"Global Minimalist Architecture (세계로 뻗어가는 미니멀리즘 아키텍처)."
스튜디오 공간의 디자인 철학을 디지털로 옮기는 것을 넘어, 운영 효율성과 글로벌 확장성까지 고려한 '지속 가능한 웹 플랫폼'을 구축했습니다. 심미적인 완성도뿐만 아니라, 클라이언트가 직접 콘텐츠를 관리하고 전 세계 잠재 고객과 소통할 수 있는 비즈니스 도구로서의 기능을 강화했습니다.
🔹 핵심 기술 및 구현 기능 (Key Technical Features)
- Integrated Admin & CRM System (통합 관리자 및 상담 시스템)
- Dynamic Portfolio Management: 개발자의 개입 없이 클라이언트가 직접 고화질 프로젝트 이미지와 설명을 CRUD(생성, 조회, 수정, 삭제) 할 수 있는 직관적인 대시보드를 구축했습니다.
- Inquiry Tracking System: 웹사이트를 통해 접수된 인테리어 상담 내역을 DB에 체계적으로 적재하고, 상태별(접수/진행중/완료)로 관리할 수 있는 간이 CRM 기능을 구현했습니다.
- Global Localization Engine (다국어 지원 엔진)
- Seamless i18n Architecture: 미들웨어(Middleware) 단에서 사용자의 브라우저 언어를 감지하여 한국어/영어를 자동으로 전환하며, URL 경로에 따른 완벽한 다국어 SEO 구조를 설계했습니다.
- Content Synchronization: 관리자 페이지에서 등록한 프로젝트 데이터가 언어별로 매끄럽게 맵핑되도록 데이터 구조를 설계했습니다.
- Elite Performance & SEO (초고성능 최적화 및 검색엔진 장악)
- Lighthouse Score 95+: 코드 스플리팅(Code Splitting), 폰트 최적화, 스크립트 지연 로딩을 통해 Performance, Accessibility, Best Practices 전 영역에서 95점 이상의 최상위 점수를 달성했습니다.
- Technical SEO Mastery (Score 100): 시멘틱 태그 사용은 물론,
JSON-LD 구조화 데이터를 심어 Google 봇이 사이트 구조를 명확히 이해하도록 했습니다.
- Google Search Console Integration: 사이트맵(sitemap.xml) 및 로봇(robots.txt) 최적화를 통해 구글 검색 엔진 등록을 완료하고, 주요 키워드 검색 시 노출 순위를 극대화했습니다.
- Atmospheric Scroll Experience (공감각적 스크롤 경험)
- Lenis Smooth Scroll & GSAP: 물리적인 무게감이 느껴지는 부드러운 스크롤링과 시차(Parallax) 효과를 통해, 2D 화면에서도 공간의 깊이감을 느낄 수 있도록 연출했습니다.
🔹 디자인 포인트