Projects

Look Up Lens 아이콘

Interaction · 2026

Look Up Lens

커서가 지나가는 자리에만 AR 렌즈의 홀로그램 HUD가 드러나는 제품 히어로.

인물 이미지는 AI 생성

1인 제작

  • 맨 얼굴 · HUD 두 장을 겹치고 radial-gradient 마스크로 커서 아래만 드러내기
  • 버튼 하나로 마스크를 뒤집어 커서 아래만 홀로그램이 꺼지게
  • 동심원 호 위에 스펙 수치를 그리고 눈금이 도는 SVG

스택

CSS MaskSVGJavaScriptHTML Video
데모
Isle of Embers 아이콘

Scroll Experience · 2026

Isle of Embers

스크롤로 해안 마을에서 화산 분화구까지 한 번에 날아가는 판타지 비행 랜딩 페이지.

1인 제작

  • 스크롤 한 번에 다음 지점으로 미끄러지는 정거장 스크롤
  • 비행 영상을 그대로 재생하고 스크롤이 따라가게 해 끊김 제거
  • 퀘스트 · 나침반 · 미니맵 · 고도와 속도를 담은 게임 HUD

스택

HTML VideoJavaScriptCSS
데모
I SEE YOU 아이콘

Interaction · 2026

I SEE YOU

커서 방향에 맞는 영상 프레임을 골라, 캐릭터가 커서를 바라보게 하는 푸터.

캐릭터 영상은 AI 생성

1인 제작

  • 각도 → 영상 시간 표로 시선 스크러빙
  • 프레임을 건너뛰지 않는 이징 · seek 게이트
  • 한 바퀴 구간 추출 · 선명화 · 인코딩

스택

HTML VideoJavaScriptffmpegNumPy
데모
GC Symbol Study 아이콘

WebGL · 2026

GC Symbol Study

SVG 로고를 3D로 압출하고, 커서·스크롤에 반응하는 이리데선트 셰이더를 입힌 심볼.

모션 참고: oryzo.ai

1인 제작

  • SVG → ExtrudeGeometry 3D 변환
  • 박막 간섭 컬러 + 이중 스페큘러 셰이더
  • 3프레임 주기 큐브맵 갱신으로 120fps

스택

Three.jsGLSLWebGL
데모
Moody 아이콘

Hardware · App · 2025

Moody

지금 듣는 Spotify 곡의 앨범 아트를 띄우는 10.1인치 디지털 액자.

담당

  • BLE 기기 탐색 · WiFi 설정
  • Spotify OAuth 2.0 (PKCE)
  • 기기 상태 실시간 모니터링

스택

FlutterRiverpodBLESpotify API
econix 아이콘

Data Platform · 2025

econix

경제 데이터를 모아 LLM으로 분석하고, 8개 언어 대시보드와 리포트로 내는 플랫폼.

1인 제작

  • Next.js 14 다국어 대시보드
  • Fed · 매크로 · 시장 · 뉴스 수집 파이프라인
  • LLM 리포트 생성 · Threads 자동 발행

스택

Next.jsTypeScriptSupabasePythonLLM
사이트