Claude Code + Nano Banana = Beautiful Animated Websites

핵심 요약

• general → AI 생성 웹사이트의 일반적인 디자인을 탈피하고 '와우 팩터'를 추가하기 위해 애니메이션 효과가 있는 히어로 섹션(Hero Section)을 만드는 방법을 단계별로 설명합니다.
• general → 핵심 워크플로우는 Nano Banana Pro로 시작 이미지 생성 → Clling 또는 VO로 해당 이미지를 영상으로 변환 → Claude Code로 이미지와 영상을 활용하여 랜딩 페이지 제작 → GitHub를 통해 코드를 Vercel에 배포하여 무료로 웹사이트를 온라인에 게시하는 것입니다.
• general → 이미지 생성 시에는 프롬프트 템플릿과 Pinterest, MidJourney 같은 플랫폼의 참고 이미지를 활용하면 더 나은 결과를 얻을 수 있으며, 랜딩 페이지 전체 디자인 컨셉을 미리 고려하는 것이 중요합니다.