Claude가 또 다른 초능력을 얻었습니다...

비디오: Claude가 또 다른 초능력을 얻었습니다...
채널: Fireship
길이: 5분 12초
출처: 자막 (자동 생성, 영어)

내용:
그 누구도 예상하지 못했던(사실상 모든 사람이 예상했던) 충격적인 전개로, Anthropic이 Claude Code 이후 가장 게임 체인저가 될 만한 도구인 Claude Design을 막 출시했습니다. 이는 새로운 Opus 4.7 기반의 플랫폼으로, 여러분의 어설픈 Figma 디자인을 단 하나의 디자인 도구도 열 필요 없이 실제 프로토타입(prototype), 피치 덱(pitch deck), 그리고 프로덕션 준비가 된 UI(User Interface)로 변환해 줍니다. 발표 후 몇 시간 만에 Figma의 주가는 7% 하락했습니다.

오랜 기간 근무한 Adobe 임원들은 포기하고 고층 빌딩 창문 밖으로 뛰어내리고 있습니다. 모든 AI 디자인 스타트업은 방금 자금 조달에 실패했으며, LinkedIn은 서버를 간신히 유지하고 있습니다. 모든 주니어 UI 디자이너들이 2023년에 모든 프로그래머가 해야 했던 일, 즉 직함을 프롬프트 엔지니어(prompt engineer)로 업데이트해야 했기 때문입니다. 오늘 영상에서는 Claude Design이 할 수 있는 모든 놀라운 기능들을 살펴보고, 이것이 인간 주도의 UI/UX 디자인에 종말을 고하는 마지막 못질이 될지 알아보겠습니다. 오늘은 2026년 4월 21일이며, 여러분은 The Code Report를 시청하고 계십니다.

Claude Design은 지난주에 막 출시된 Anthropic의 새로운 플래그십 모델인 Opus 4.7을 기반으로 구축되었습니다. 이 모델은 이전 모델보다 더 안목 있고 창의적이라고 전해지는데, 이는 기업식 표현으로 바꾸자면

자, 제가 지금까지 들어온 모든 음모론을 다 믿는 편이긴 하지만, 이번만큼은 확신이 서지 않습니다. 왜냐하면 이 데모들은 정말 말도 안 될 정도로 엄청나기 때문입니다. 몇 주 전에 소개했던 Google Stitch와 비슷하게, 이 디자인 도구는 기본적인 UI를 쉽게 구성해 줄 수 있지만, 상호작용성 (interactivity) 측면에서는 Claude가 훨씬 앞서 나갑니다. 이 모든 데모가 완전히 상호작용 가능하다는 점에 주목하세요. 별도의 설정 없이도 바로 작동하는 애니메이션 (animations)을 갖추고 있으며, 이 슬라이더들을 조절하여 다양한 결과를 얻을 수 있습니다. 또한, 애니메이션이 실제로 어떻게 보여야 하는지에 대해 수많은 변형 (variations)을 제공할 수도 있습니다. 예를 들어 채팅 앱을 위한 다양한 애니메이션을 시도해 볼 수도 있고, 혹은 다음번 실패할 사이드 프로젝트에 가장 잘 어울리는 것을 고를 수 있도록 100가지의 서로 다른 로딩 스피너 (loading spinners)를 쏟아내게 할 수도 있습니다. 또한, 모든 웹 개발자를 공포에 떨게 하는 작업, 즉 셰이더 (shaders)를 다룸으로써 이 미친 듯이 미래적인 애니메이션들을 만들어낼 수도 있습니다. 그리고 이 기능은 1분이 넘는 전체 길이의 비디오 애니메이션까지 제작할 수 있기 때문에, 비디오 편집자들을 무용지물로 만들지도 모릅니다. 인상적이긴 하지만, 문제는 이것들이 모두 엄선된 미리 제작된 데모들이라는 점입니다. Claude design이 실제로 뛰어난지 직접 무언가를 만들어보며 확인해 봅시다. 다만, 무언가를 만들기 전에 이미 자신만의 디자인 시스템 (design system)을 갖추고 있을 수도 있습니다. Google Stitch처럼 디자인 시스템을 업로드하면 디자인 간의 일관성을 유지하도록 강제할 수 있습니다. Claude의 멋진 점은 GitHub 리포지토리 (repo)를 연결하여 디자인 시스템을 업로드하거나, Figma 파일을 직접 업로드할 수도 있다는 것입니다. 이는 디자이너에게 정말 놀라운 일인데, 이론적으로는 단 몇 개의 화면만 디자인한 뒤 Claude에게 Figma 파일을 전달하면, Claude가 나머지 100개의 화면을 대신 디자인해 준다는 의미이기 때문입니다. 저는 이미 디자인 시스템을 PDF 파일로 설정해 두었으므로, 바로 업로드하겠습니다. 그런 다음 Claude에게 'Horse Tinder'를 위한 iOS 온보딩 플로우 (onboarding flow)를 만들어 달라고 프롬프트 (prompt)를 입력하겠습니다.

이제 우리는 그저 기다리고, 기다리고,
기다리고, 또 기다려야 합니다. Opus 4.7은 Google Stitch, Code X, 또는 Cursor Composer보다 훨씬 느리지만, 적어도 인간보다는 천 배는 빠릅니다. 하지만 결국, 이 다섯 개의 아름답게 디자인된 화면이 담긴 캔버스(canvas)로 우리를 안내합니다. 여기서 '아름답다'는 표현은 약간의 과장일 수도 있지만, 좋은 시작점임은 분명합니다. 다만 한 가지 문제는, 채팅 출력 결과에서 제 디자인 시스템(design system)을 인식했음에도 불구하고 이를 사용하지 않았다는 점입니다. Fire Ship 스타일이라기보다는 훨씬 더 Claude 스타일처럼 보입니다. 하지만 그건 그냥 무시해도 됩니다. 또 다른 문제는 Horse Tinder 로고가 너무 흐릿하다는 것이니까요. 음, Claude 디자인의 또 다른 멋진 기능은 우리가 이 캔버스에 직접 그림을 그리고 주석을 달 수 있다는 점입니다. 예를 들어, 이 형편없는 로고에 직접 화살표를 그린 다음, 주석을 달거나 수정하기 위한 새로운 프롬프트 (prompt)를 추가할 수 있습니다. 그러면 5분에서 10분 뒤에 마법처럼 수정됩니다. 음, 사실 잠시만요. 수정되지 않은 것 같네요. 배경 색상만 아주 조금 바꿨을 뿐입니다. 정말 아쉽네요. 결국 Horse Tinder를 완성하려면 Opus 4.8이 나올 때까지 기다려야 할 것 같습니다. 하지만 우리가 계속 작업할 수 있는 한 가지는 오늘 영상의 스폰서인 Google Cloud Run과 같은 멋진 도구를 사용하여 백엔드 (back end)를 구축하는 것입니다. 이는 오버헤드 (overhead) 없이 Google의 세계적인 인프라에서 코드를 실행할 수 있게 해주는 완전 관리형 서버리스 (serverless) 플랫폼입니다. 어떤 언어나 프레임워크를 사용하여 프론트엔드 (front-end) 및 백엔드 (back-end) 서비스, 배치 작업 (batch jobs), 또는 GPU를 사용하는 미세 조정된 LLM (fine-tuned LLMs)을 호스팅할 수도 있으며, 터미널 (terminal)이나 Cloud Code에서 단일 명령으로 즉시 배포하거나 GitHub에서 지속적 배포 (continuous deployment)를 설정할 수 있습니다. 또한 Google AI Studio를 풀스택 (full-stack) 개발 환경으로 사용하여 완전한 React 또는 Node.js 앱을 바이브 코딩 (vibe code)한 다음, 클릭 한 번으로 Cloud Run에 배포할 수도 있습니다. 가장 좋은 점은 스케일 투 제로 (scales to zero)가 가능하다는 것입니다. 따라서 유휴 (idle) 프로젝트에는 비용이 전혀 들지 않으며, 수동 개입 없이도 트래픽 급증을 처리하기 위해 자동으로 확장 (auto scales)됩니다.

또한 매달 200만 건의 무료 요청 (free requests)을 제공하므로, 지금 바로 cloud.run에서 무료로 체험해 보세요. 지금까지 Code Report였습니다. 시청해 주셔서 감사합니다. 다음 영상에서 뵙겠습니다.