카티바 — 3D 고양이가 지켜보는 카페 홈페이지

캐릭터 하나로 만든 한 페이지 카페 홈페이지입니다. 에스프레소 바를 운영하는 아주 북슬북슬하고 아주 시큰둥한 3D 고양이, 판나 여사. 영상이 아니라 진짜 3D 모델이라 어디든 볼 수 있습니다. 방문자의 커서를 눈이 먼저, 고개가 한 박자 늦게 따라오고, 커서가 멈추면 고개는 돌린 채 눈만 당신을 봅니다. 얼굴 가까이 가면 눈을 가늘게 뜨고, 클릭하면 천천히 눈을 깜빡여 주고, 끌면 돌아섰다가 다시 정면을 봅니다. 셸 방식의 털, 눈꺼풀이 있는 진짜 안구, 숨 쉬고 꼬리를 흔드는 대기 동작이 살아 있는 느낌을 주고, 카드 그림도 실시간 모델에서 렌더합니다. 그 아래는 실용적인 페이지입니다. 가격과 점장의 발바닥 점수가 붙은 메뉴, 하우스 규칙, 영업시간과 주소, 미리 주문 픽업 시간, 자주 묻는 질문 — 모두 모델 없이도 읽히는 일반 HTML입니다. 영어·한국어 페이지와 SEO, 휴대폰용 가벼운 털, 스크롤을 막지 않는 끌기가 들어 있습니다. 키트에는 React + Vite + three.js 소스, 빌드본, 영어·한국어 블루프린트, 리깅된 GLB, 그리고 우리 마스코트를 만드는 Meshy 프롬프트와 Blender 스크립트가 들어 있습니다. 카티바와 고양이는 가상입니다.

스택

React 19 · Vite 8 · Tailwind 4 · three.js

3D

Meshy image-to-3D → Blender 리깅(머리·꼬리·눈 위치·털 마스크) → 실시간 털·안구·눈꺼풀

모션

커서 시선(눈 먼저, 고개 나중) · 곁눈질 · 실눈 · 눈인사 · 끌어서 돌리기

언어

영어 + 한국어

구성

소스 · 빌드본 · EN/KO 블루프린트 · 리깅된 GLB · Meshy + Blender 워크플로