클로드 5.1 Fable + 디자인, 인스타 캐러셀 완벽 제작! (3단계)

Claude Fable 5.1: 인스타그램 캐러셀 만들기 마스터하기!

안녕! 오늘은 완전 신기한 AI 모델인 Claude Fable 5.1에 대해 이야기해볼 거야. 이 모델이 얼마나 대단하냐면, 다른 AI 모델들을 다 제치고 성능도 좋으면서 가격까지 착하다는 거지!

근데 오늘은 성능 자랑만 하려는 건 아니고, Fable 5.1의 창의력을 제대로 테스트해볼 거야. 바로 Claude 디자인이랑 합쳐서 멋진 인스타그램 캐러셀을 만들어볼 거거든.

이 영상에서는 기본부터 시작해서 완전 예쁜 캐러셀까지, 3단계로 Claude 디자인을 어떻게 사용하는지 알려줄게. 이걸 알면 너만 앞서나갈 수 있을 거야!

혹시 나를 처음 본다면, 나는 던컨 로고프라고 해. 애플, 플레이스테이션, 닛산 같은 유명 브랜드에서 아트 디렉터로 일했고, 지금은 Claude 코드를 배우고 돈 버는 커뮤니티를 운영하고 있어.

그리고 영상 끝에는 오늘 만든 캐러셀 디자인 시스템 전체를 하나의 '스킬'로 만드는 방법까지 알려줄 거야. 그러면 앞으로는 자동으로 멋진 브랜드 캐러셀을 만들 수 있게 되는 거지!

그러니 집중하고, 다른 창은 다 닫고, 같이 만들어보자! 오늘 만든 거 다 갖고 싶으면 설명란에 링크 확인해!

1단계: Fable 5.1의 창의력 맛보기 (기본)

먼저 Claude 코드를 열고, 모델 선택하는 곳에서 Fable 5.1을 골라봐. 이게 앤트로픽에서 나온 최신 모델인데, 진짜 창의력으로는 최고야!

여기에 /design 이라는 새로운 기능도 같이 써볼 거야. 이걸 쓰면 Claude 안에서 바로 멋진 디자인을 만들 수 있어. 예전에는 웹 브라우저에서만 됐었는데, 이제는 데스크톱 앱에서도 된다는 거지!

모바일 앱, 슬라이드 쇼, UI, 애니메이션 뭐든지 만들 수 있는데, 우리는 인스타그램 캐러셀을 만들어볼 거야.

자, Fable 5.1의 창의력을 테스트하기 위해 모두가 좋아하는 주제, 우유에 대한 인스타그램 캐러셀을 만들어보자!

Claude 코드 데스크톱 앱에서 Claude 코드가 선택되어 있는지 확인하고, 작업할 폴더를 정해. 나는 바탕화면에 'milk'라는 폴더를 만들었어.

이제 시작하려면 /design 이라고 입력해서 디자인 스킬을 불러오고, Fable 5.1한테 뭘 만들고 싶은지 말해주면 돼.

나는 이렇게 간단하게 프롬프트를 줬어: "우유 마시는 방법에 대한 인스타그램 캐러셀 만들어줘." 그리고 기존 디자인 규칙이나 파일은 무시하라고 했어. (만약 네가 Claude를 써본 적 있다면, 이미 디자인 시스템이 있을 수도 있잖아? 나중에 어떻게 만드는지 알려줄게. 지금은 Fable 5.1이 얼마나 창의적인지 보려고 무시하라고 한 거야.)

그리고 "정말 창의적으로 생각해줘." 라고 덧붙였지.

참고로, Fable 5.1 성능을 빠르게 보려면, 'level of effort' 를 'high' 로 설정하면 성능과 비용 사이에서 가장 좋은 균형을 찾을 수 있을 거야.

자, 결과가 나왔는데, 라이브로 테스트하는 거니까 장단점을 바로 이야기해볼게.

• 좋은 점: 캐러셀 슬라이드를 다 만들어줬는데, 확대해보니 진짜 웃기더라고! AI가 이렇게 웃긴 건 흔치 않은데 말이지. "우유 마시기 전에 이 카드 먼저 읽어봐, 전에 마셔봤어도 말이야." 라든지, "콧수염이 났다면 침착하게, 소매로 닦고, 계속 마셔." 같은 문구들이 재밌었어.
• 아쉬운 점: 디자인 자체는 아직 그렇게 예쁘진 않았어. 그리고 16분이나 걸렸는데, 갑자기 구글 폰트나 다른 걸 찾으면서 내가 요청하지도 않은 것들을 막 하기 시작하더라고. 너무 창의적으로 생각해서 과하게 이것저것 하려고 했던 것 같아. Fable 5.1을 쓸 때는 명확하게 지시하는 게 중요해. "슬라이드 이미지들만 생성해줘. 다른 건 하지 마." 라고 했어야 했나 봐.

그래도 이 정도면 꽤 괜찮지? 이제 이걸 더 멋지게 만들어보자!

2단계: 나만의 디자인 시스템 만들기 (중급)

이제 디자인 시스템을 만들 차례야. 디자인 시스템은 폰트, 색깔, 간격, 질감, 애니메이션, 아이콘 등 브랜드를 만들거나 자산을 반복적으로 만들 때 필요한 모든 것을 담고 있어. 캐러셀, 웹사이트, 애니메이션 등 어떤 걸 만들든 일관된 스타일을 유지할 수 있게 도와주지.

가장 좋은 방법은 참고할 만한 이미지를 찾는 거야. 핀터레스트 같은 곳에서 소셜 미디어 게시물을 검색해서 마음에 드는 걸 찾아봐. 나는 이 이미지가 마음에 들어서 이걸 참고해볼게.

이 이미지를 복사해서 Claude에 붙여넣고, 이렇게 프롬프트를 주는 거야: "첨부된 참고 자료를 기반으로 HTML 디자인 시스템을 만들어줘. 그리고 이 스타일로 인스타그램 캐러셀을 다시 생성해줘. 슬라이드만 생성하고 다른 건 하지 마."

Claude 디자인의 또 다른 강력한 점은 모든 것이 편집 가능하다는 거야. 글자 크기, 폰트, 정렬, 간격 등 모든 걸 직접 수정할 수 있어. 직접 수정하기 싫으면 채팅창에 말해서 Claude한테 바꿔달라고 할 수도 있고!

두 번째 시도가 끝났는데, 벌써 훨씬 좋아졌어! 주황색 빛깔, 크고 멋진 그래픽, 깔끔하고 브랜드 느낌이 나는 디자인이 마음에 들어.

작업한 폴더에 가보면 design system.html 파일이 생겼을 거야. 이걸 열어보면 색깔 팔레트, 폰트, 하이라이트, CTA 버튼, 배경 요소 등 모든 게 정리되어 있어. 이제 이걸로 앞으로 어떤 자산을 만들든 일관된 스타일을 유지할 수 있겠지?

Fable 5.1이 스스로 작업물을 확인하고 더 나은 이미지를 다시 생성하는 경향이 있는데, 이게 시간이랑 토큰을 더 많이 쓰게 만들 수 있어. Fable 5.1이 얼마나 똑똑하길 바라느냐에 따라 시간과 비용이 달라지는 거지.

3단계: AI 이미지와 디자인 시스템의 완벽한 조화 (고급)

이제 이걸 더 아름답게 만들어볼 거야. Claude 디자인과 AI가 만든 멋진 이미지를 합쳐서 편집 가능한 레이어를 만드는 거지.

배경 이미지를 더 멋진 걸로 바꾸고 싶어. 텍스트랑 디자인 요소는 Claude 코드에서 편집 가능하게 유지하면서 말이야.

이렇게 프롬프트를 줬어: "우리 캐러셀 배경 이미지를 Higgsfield를 사용해서 생성해줘. 크고 아름다운 풀샷 이미지로. 텍스트랑 다른 요소들은 편집 가능하게 유지해줘."

Higgsfield라는 사이트를 이용할 건데, 여기서는 최신 이미지랑 비디오 모델들을 사용할 수 있어. GPT 이미지 2나 Nano Banana 같은 것들이지.

Higgsfield를 Claude 코드에 연결하는 건 아주 쉬워. MCP랑 CLI에 가서 링크를 복사하고, Claude 코드에서 '+' 버튼을 누르고, 커넥터 관리에서 'add custom connector'를 선택해. 이름은 'Higgsfield'로 하고 URL을 붙여넣으면 돼. 로그인하면 Higgsfield의 모든 이미지/비디오 생성 모델을 Claude 코드 안에서 사용할 수 있게 되는 거야.

세 번째 시도가 끝났는데, 진짜 재밌어! AI가 만든 이미지와 디자인 요소가 합쳐져서 멋진 결과물이 나왔어. 물론 텍스트 편집이나 요소 이동도 그대로 할 수 있지. 특히 콧수염 이미지는 정말 마음에 들어.

이제 이걸 자동으로 멋진 캐러셀을 만들어주는 '스킬'로 만들 수 있어. Fable 5.1한테 주제만 주면, 알아서 예쁜 캐러셀을 만들어주는 거지.

"이 과정을 새로운 캐러셀 스킬로 만들어줘. Claude한테 주제를 주면, AI 이미지와 Claude 디자인 편집 가능 요소를 섞어서 아름답게 디자인된 캐러셀을 생성하게 해줘."

이 스킬이랑 다른 자료들을 갖고 싶으면 설명란 링크를 확인해!

Claude 디자인으로 멋진 웹사이트 만드는 방법이 궁금하면 이 영상도 봐봐! 거기서 보자!