이것을 보면 손해 볼 게 없습니다.

원문 발행 2026. 06. 11. 14:10원문 언어 일본어AI 한국어 번역X @so_ainsight (자동 발견) 원문 보기

요약

Anthropic의 최신 AI 모델 'Fable 5'를 활용하여 애니메이션이 적용된 웹사이트를 제작하는 무료 튜토리얼이 공개되었습니다. 이 가이드에서는 프롬프트만으로 디자인과 움직임을 지정하며, 코딩 지식 없이도 어워드 수상급 결과물을 만드는 방법을 다룹니다.

AI 챗 서비스 'Claude'의 최신 모델 'Fable 5'를 사용하여 애니메이션이 적용된 어워드 수상급 웹사이트를 12분 만에 만드는 무료 튜토리얼이 공개되었습니다.

・스크롤 애니메이션 구현
・어워드 수상급 디자인을 AI로 즉시 생성
・프롬프트 하나로 디자인과 움직임을 동시에 지정
・직접 작성하는 코드는 제로(0)
・사용했던 프롬프트도 전부 공개

12분 만에 'AI × 웹사이트 제작'을 완벽하게 공략할 수 있습니다.

애초에 'Claude Fable 5'란 무엇인가요?

Anthropic이 2026년 6월 9일에 출시한 최신 AI 모델입니다. 코딩이나 웹 제작 분야에서 특히 평가가 높으며, 스크린샷을 보여주는 것만으로도 웹 앱의 소스 코드를 재구성할 수 있을 정도의 시각적 이해력을 가지고 있습니다.

이번 튜토리얼에서는
・어떤 프롬프트를 입력해야 애니메이션이 작동하는지
・디자인의 톤과 움직임을 말로 지정하는 방법
・수상급 웹사이트가 완성될 때까지의 전 과정
・실제로 사용했던 프롬프트 전체 목록

을 처음부터 만듭니다.

더 강력한 점은 이겁니다.

튜토리얼 내에서 사용된 프롬프트는 스레드에서 원클릭으로 가져올 수 있습니다. 영상을 보면서 바로 복사하여 사용할 수만 있습니다.

・애니메이션 지시 프롬프트
・레이아웃 및 색상 지정 프롬프트
・완성까지 사용한 프롬프트 일체

한 번 익히면

・서비스 사이트
・포트폴리오
・랜딩 페이지
・기업 코퍼레이트 사이트

모두에 사용할 수 있습니다. 다시 만들 필요가 없습니다.

참고 포스트는 여기입니다.

이 게시물이 도움이 되었다면,
@so_ainsight
를 팔로우해주세요.
좋아요, 리포스트도 부탁드립니다.

AI 자동 생성 콘텐츠