2026콘텐츠 유통·AI 라이선싱 — 기업 웹사이트
FastView
설명
콘텐츠 유통·AI 라이선싱 — 기업 웹사이트
기간
Apr 2026 - May 2026
역할
- 기업 브랜드 아이덴티티(BI)에 맞춘 웹사이트 전체 기획 및 UI/UX 디자인.
- React 기반 반응형 프론트엔드 퍼블리싱 및 스크롤 인터랙션·동적 모션 총괄 구현.
- 제품·뉴스룸·팀 콘텐츠 데이터 구조화 및 모바일 최적화 반응형 웹 개발.
기술
Frontend
React 19 · React Router 7 · Vite 6 · TypeScript · Tailwind CSS v4
Motion
Framer Motion · GSAP · Lenis
프로젝트 목적
"A single gateway for Asia's content. And its AI future." 패스트뷰는 자사 플랫폼 ViewUs를 통해 아시아의 프리미엄 콘텐츠를 전 세계 플랫폼과 AI 랩에 연결하는 기업입니다. 문제는 가독성이었습니다. 라이선싱 운영체제, 4개 제품, AI가 콘텐츠를 소비·과금하는 4가지 방식을 30초짜리 주의력을 가진 파트너에게 전달해야 했습니다. 정형화된 B2B 사이트의 틀을 벗어나 근거를 앞세웠습니다 — 850+ 퍼블리셔, 7개국, 5.8B PV, 사전 동의 기반 권리 인프라.
범위
- · 기업 공식 웹사이트 UI/UX 기획 및 디자인
- · 반응형 프론트엔드 퍼블리싱 (React 19 · Vite · Tailwind v4)
- · 스크롤 인터랙션 및 모션 구현
- · 콘텐츠 데이터 구조화 — 제품·뉴스룸·팀·성과 케이스
주요 기술 특징
스크롤 기반 내러티브
- · Lenis 스무스 스크롤에 Framer Motion·GSAP를 결합해 히어로 → 문제 정의 → 3계층 파이프라인 → 제품 → 성과로 이어지는 10개 섹션을 하나의 흐름으로 만들었습니다.
- · 각 섹션이 카피 덩어리가 아니라 하나의 주장으로 닫히도록 구성했습니다.
데이터 기반 콘텐츠 구조
- · 제품 4종, 뉴스룸, 팀, 성과 케이스를 타입 정의 기반 데이터 레이어로 분리했습니다.
- · 카피가 확정되면 데이터 파일만 교체하면 되고, 컴포넌트는 다시 열 필요가 없습니다.
라이선싱 OS 시각화
- · Direct Feed / Multilingual Feed / AI Tracker / RightsHub 4개 제품을 'AI가 콘텐츠를 소비·과금하는 4가지 방식'과 나란히 놓았습니다.
- · 이 정도로 추상적인 라이선싱 모델은 문단으로 안 되고 그리드·비교 표·다이어그램이라야 전달됩니다.
성능 및 반응형 최적화
- · 스톡 사진을 완전히 배제하고 타이포그래피·라인·그라데이션 패널로 구성했습니다. 로딩이 가벼워진 건 아트 디렉션의 결과지 타협의 결과가 아닙니다.
- · reduced-motion 대응과 크로스 브라우징으로 모바일에서 애니메이션이 끊기지 않게 했습니다.
디자인 포인트
에디토리얼·신뢰 아이덴티티
화이트·크림(#FAF7F0) 배경에 액센트 레드(#E13832)와 모노스페이스 라벨. 미디어·테크 기업의 신뢰감에 에디토리얼한 온도를 더했습니다. "아시아 콘텐츠의 가치를 세계와 연결하는 단 하나의 방법"이라는 철학을 두 번 말하지 않고 타이포 위계와 여백으로 전달했습니다.
근거 중심 레이아웃
4.9 평점, 850+ 퍼블리셔, 2.5× YoY 성장, ₩200B(2030 목표), CP 70% / FastView 30% 수익 배분을 전면에 배치했습니다. B2B 파트너에게는 이 숫자들이 곧 주장이고, 나머지는 맥락입니다.
프로젝트 보기웹사이트 방문 →