클로드 AI 무료로 이런 것까지 된다고? 진짜 쓸 수 있는 핵심 기능 4가지

클로드 무료플랜 핵심기능 4가지

무료라서 얕보다가 놀랐다

AI 툴을 꾸준히 써온 지 꽤 됐다. 디자이너로 25년을 일하면서 새로운 툴이 나올 때마다 일단 써보는 편인데, 클로드는 처음에 그냥 “또 다른 챗봇이겠지” 하고 넘겼다.

그런데 어느 날 클라이언트가 “클로드로 작업 정리해봤는데 괜찮더라”고 해서 다시 들여다봤다. 무료 플랜으로 시작해서 이것저것 눌러봤는데, 생각보다 훨씬 많은 게 됐다.

특히 2026년 초에 무료 플랜에도 커넥터 기능이 풀리면서 쓸 수 있는 폭이 넓어졌다. 유료 전환을 고민 중이라면, 이 기능들부터 제대로 써보고 결정해도 늦지 않는다.


1. 커넥터 기능 — 외부 앱을 연결해 실제 업무를 처리한다

커넥터가 뭔가

커넥터는 클로드와 외부 앱을 연결하는 기능이다. 노션, 피그마, 구글 드라이브, 지라 같은 툴을 연결해두면, 클로드가 그 안에 있는 데이터를 읽거나 작업을 수행할 수 있다.

쉽게 말하면, 클로드가 내 업무 툴에 직접 접근할 수 있게 되는 것이다. 이전에는 챗봇에 내용을 복붙해서 넣고, 결과를 다시 복붙해서 써야 했다면, 커넥터가 연결되면 그 중간 과정이 줄어든다.

디자이너 입장에서 이렇게 쓴다

피그마 커넥터를 연결하면, 피그마 파일 구조를 클로드가 읽을 수 있다. 예를 들어 “이 피그마 파일에서 컴포넌트 구조 분석해줘”, “이 화면의 UX 흐름 정리해줘” 같은 요청을 할 수 있다.

노션 커넥터를 연결하면 더 직접적으로 쓸 수 있다. 나는 클라이언트별로 노션에 프로젝트 문서를 관리하는데, “이 프로젝트 노션 페이지 보고 다음 미팅 안건 정리해줘”가 된다.

25년 일하면서 가장 피곤했던 게 반복되는 문서 작업이었다. 커넥터가 생기면서 그 부분이 실질적으로 줄었다.

무료 플랜에서 쓸 수 있는 커넥터

2026년 초 업데이트로 무료 플랜에도 커넥터 기능이 열렸다. 연결 가능한 앱의 종류나 사용 횟수에는 제한이 있을 수 있지만, 핵심 기능 자체는 무료로 쓸 수 있다.


2. 아티팩트 기능 — 결과물을 바로 눈으로 확인한다

아티팩트가 뭔가

클로드가 뭔가를 만들었을 때, 그걸 채팅창 텍스트로만 보여주는 게 아니라 별도 창에서 바로 렌더링해서 보여주는 기능이다.

HTML 코드를 짜달라고 하면, 코드 텍스트와 함께 실제로 어떻게 보이는지 미리보기가 오른쪽에 뜬다. 인터랙티브 차트를 만들면 실제로 클릭해볼 수 있다. 마크다운 문서를 작성하면 실제 레이아웃으로 바로 확인된다.

디자이너 입장에서 이렇게 쓴다

나는 클라이언트 제안서를 빠르게 초안 잡을 때 많이 쓴다. “이 서비스 랜딩페이지 와이어프레임 HTML로 만들어줘”라고 하면, 아티팩트로 바로 확인이 된다. 완성본은 아니지만 방향성 확인용으로는 충분하다.

프리랜서 특성상 빠른 제안이 수주에 직결된다. 클라이언트 미팅 전에 러프한 방향 시안을 보여주는 용도로 쓰면 속도가 확 달라진다.

코드를 직접 짜는 디자이너가 아니더라도, 아티팩트로 인터랙션 프로토타입을 빠르게 만들어볼 수 있다는 게 꽤 실용적이다. 피그마로 넘어가기 전에 로직 검증용으로 쓰기 좋다.

실제로 만들 수 있는 것들

  • 인터랙티브 HTML 페이지
  • 데이터 시각화 차트
  • SVG 일러스트
  • 마크다운 문서
  • 간단한 계산기나 폼

3. 프로젝트 기능 — 클로드가 내 업무 맥락을 기억한다

프로젝트가 뭔가

일반 채팅은 대화가 끝나면 맥락이 초기화된다. 다음에 또 클로드에게 뭔가를 물어보면, 처음부터 설명을 다시 해야 한다.

프로젝트 기능은 이 문제를 해결한다. 프로젝트 안에서는 내가 설정해둔 지침과 업로드한 문서가 모든 대화에 유지된다. 클로드가 내 업무 방식, 클라이언트 특성, 자주 쓰는 표현 등을 매번 설명하지 않아도 되는 것이다.

디자이너 입장에서 이렇게 쓴다

나는 클라이언트별로 프로젝트를 만들어 쓴다.

예를 들어 금융 앱 클라이언트 프로젝트를 만들면, 그 안에 이런 것들을 설정해둔다.

  • 클라이언트 업종과 타깃 유저 정보
  • 브랜드 톤앤매너 가이드
  • 이 클라이언트가 자주 쓰는 용어
  • 이전 피드백에서 중요했던 포인트

그러면 그 프로젝트 안에서 “이 화면 카피 써줘”라고 하면, 금융 서비스에 맞는 신뢰감 있는 말투로, 이 클라이언트의 톤에 맞게 써준다.

매번 컨텍스트를 다시 세팅하는 시간이 없어진다. 25년 동안 클라이언트 관리를 해오면서 가장 시간을 많이 잡아먹은 게 “이 클라이언트는 어떤 사람이었지, 뭘 중요하게 봤지”를 매번 다시 정리하는 것이었다. 프로젝트 기능이 그걸 대신해준다.

이렇게 세팅하면 효과가 더 좋다

  • 클라이언트 브리프 PDF를 문서로 업로드해두기
  • 내가 자주 쓰는 UX 원칙이나 판단 기준을 지침에 적어두기
  • 피드백 히스토리를 메모로 추가해두기

세팅이 잘 될수록 결과물 퀄리티가 올라간다.


4. 확장 사고 기능 — 복잡한 문제를 깊게 파고든다

확장 사고가 뭔가

일반적인 AI 응답은 질문을 받으면 바로 대답한다. 빠르지만, 복잡한 문제에는 얕게 답할 때가 있다.

확장 사고(Extended Thinking)는 대답하기 전에 먼저 생각을 충분히 전개한다. 시간이 조금 더 걸리지만, 결과가 다르다. 단순한 답이 아니라 여러 가능성을 검토하고, 맥락을 고려하고, 반례까지 생각한 다음에 답이 나온다.

디자이너 입장에서 이렇게 쓴다

일상적인 카피 작업이나 간단한 정보 정리는 일반 모드로 충분하다. 그런데 아래 같은 상황에서는 확장 사고를 켠다.

UX 의사결정 검토가 필요할 때. “이 결제 플로우에서 단계를 줄이면 전환율이 올라갈 텐데, 반대로 어떤 리스크가 있을까?”처럼 복합적인 판단이 필요한 질문에 확장 사고로 물어보면, 트레이드오프를 꽤 정교하게 정리해준다.

클라이언트 설득 논리가 필요할 때. 디자인 결정을 클라이언트에게 설명해야 할 때, “왜 이 방향이 맞는가”를 논리적으로 풀어야 한다. 확장 사고로 “이 디자인 결정의 근거를 UX 원칙 기반으로 설명해줘”라고 하면, 단순 설명이 아니라 반박을 예상한 구조로 나온다.

경쟁사 분석 정리가 필요할 때. 여러 앱의 패턴을 비교 분석하고 인사이트를 도출하는 작업에서 확장 사고를 쓰면, 표면적인 비교가 아니라 구조적인 차이까지 짚어준다.


네 가지 기능 정리

기능핵심 역할쓸 때효과
커넥터외부 앱 연결노션·피그마·드라이브 연동복붙 작업 제거
아티팩트결과물 즉시 렌더링HTML·차트·문서 생성바로 보고 수정 가능
프로젝트업무 맥락 유지클라이언트별 세팅설명 반복 없음
확장 사고깊은 분석복잡한 판단·전략정교한 결과

클로드 무료플랜 핵심기능 4가지

유료로 넘어가야 할 시점

솔직하게 말하면, 무료 플랜에도 제약은 있다. 메시지 사용량에 제한이 있고, 사용량이 많은 시간대에는 응답이 느려질 수 있다. 하루에 가볍게 몇 번 쓰는 수준이라면 무료로 충분하지만, 업무에 적극적으로 통합하기 시작하면 금방 한계가 온다.

커넥터 기능도 무료 플랜에서는 연결 가능한 앱의 종류나 사용 횟수가 제한될 수 있다.

그래도 일단 무료로 써보고 판단하는 게 맞다. 유료 전환 전에 이 기능들을 충분히 써봐야 어디가 병목인지 보인다.


마치며

25년 동안 디자인 툴의 변화를 봐왔다. 포토샵이 나왔을 때, 일러스트레이터가 나왔을 때, 피그마가 나왔을 때, 그리고 지금 AI 툴이 나온 것까지.

매번 “이게 진짜 디자이너 일을 바꿀까?”라는 질문이 있었다. 피그마는 정말 바꿨다. AI도 비슷한 변곡점에 있다고 느낀다.

클로드 무료 플랜의 이 네 가지 기능은, 단순히 “AI한테 물어보는 것” 수준이 아니다. 업무 흐름 자체를 바꿀 수 있는 것들이다. 가볍게 시작해보고, 어디에 잘 맞는지 직접 확인해보는 걸 권한다.


이 글이 도움이 됐다면, AI 툴을 업무에 도입하려는 동료 디자이너에게 공유해 주세요.

함께 읽으면 좋은 글

Claude AI와 Figma 연동하는 법 – MCP 설정부터 Claude Design 활용까지 (2026 최신)

claude ai 와 figma 연동 카드뉴스 이미지

처음 이 조합을 써봤을 때 솔직히 반신반의했다.

AI가 Figma를 “직접 읽는다”는 말이 과장처럼 들렸다. 그런데 실제로 연결해보니 달랐다. Claude가 내 Figma 파일의 컴포넌트 이름, 오토레이아웃 구조, 스페이싱 값을 정확히 인식하고 있었다. 이건 단순히 스크린샷을 넘기는 수준이 아니었다.

이 글은 그 경험을 바탕으로 쓴다.


먼저 알아야 할 것: 연동 방식이 두 가지다

Claude와 Figma를 연결하는 방법은 현재 크게 둘로 나뉜다.

1) MCP 방식 — Claude (Desktop 또는 Code)와 Figma를 직접 연결

  • Claude가 Figma 파일을 실시간으로 읽고, 수정하고, 코드를 생성한다.
  • 설정이 조금 필요하지만, 양방향으로 작동한다.

2) Claude Design → Figma 내보내기 방식

  • 2026년 4월 출시된 Claude Design에서 만든 결과물을 HTML로 내보낸 뒤 Figma로 옮기는 방식.
  • 설정이 거의 없다. 대신 흐름이 단방향이다.

두 방식 모두 장단점이 있다. 순서대로 설명한다.


1부. MCP로 Claude와 Figma 연결하기

MCP가 뭔지부터

MCP(Model Context Protocol)는 Anthropic이 개발한 개방형 표준 프로토콜로, AI 모델과 소프트웨어를 연결하는 통신 규약이다. 흔히 “AI 분야의 USB-C 커넥터”에 비유된다. Brunch

쉽게 말하면, Claude가 Figma 안에 있는 데이터를 직접 꺼내 쓸 수 있게 해주는 다리다.

MCP 없이는 Claude가 내가 붙여넣은 내용만 알 수 있다. MCP가 있으면 파일 시스템, 데이터베이스, Figma 파일 등을 실시간으로 읽고 작업할 수 있다. AI Blogs

예전에는 Figma 스크린샷을 캡처해서 Claude에 올리고, “이 버튼 색이 뭐야?” 같은 걸 물어봤다. 이제는 그럴 필요가 없다. 파일을 연결해두면 Claude가 직접 열어본다.


연결 방법 A: Claude Desktop + Figma Desktop (비개발자도 가능)

가장 진입장벽이 낮은 방법이다. 터미널 명령어 없이 설정할 수 있다.

준비물

  • Claude Desktop 앱 (유료 플랜 필요)
  • Figma Desktop 앱 (브라우저 버전은 연결이 불안정하다)
  • Figma Professional 이상 플랜 (Dev Mode 사용 필요)

설정 순서

① Figma Desktop에서 MCP 서버 활성화

Figma Desktop을 실행한다. 상단 메뉴에서 FigmaPreferencesEnable Dev Mode MCP Server를 켠다. 이걸 켜야 Claude가 Figma에 접근할 수 있다.

Figma Desktop 앱을 실행한 뒤, 공식 문서를 따라 Figma Desktop Server를 활성화하면 된다. 이 단계는 비교적 간단하며, Figma 브라우저 버전보다 Desktop 버전을 쓰는 것을 권장한다. 브라우저도 연결은 가능하지만 Desktop 버전에 비해 안정성이 떨어진다. Brunch

② Claude Desktop에서 MCP 연결 확인

Claude Desktop을 실행한다. SettingsDeveloper로 이동하면 Figma MCP 서버가 Running 상태인지 확인할 수 있다.

Claude Code에서 Settings → Developer로 이동해 Figma Desktop MCP가 실행 중(Running)인지 확인하면 된다. Brunch

③ Figma 파일 링크로 작업 시작

연결이 완료되면, Claude 대화창에 Figma 파일 링크를 붙여넣고 바로 작업을 요청할 수 있다. "이 파일에서 카드 컴포넌트 구조 설명해줘" 같은 식으로.


연결 방법 B: Claude Code + Figma (개발자 협업용)

코드와 디자인을 동시에 다루는 워크플로우에 적합하다. 개발자와 함께 쓰거나, 직접 프론트엔드 코드까지 뽑아내고 싶을 때 효과적이다.

터미널에서 명령어 한 줄로 연결

claude mcp add --transport http figma-remote-mcp https://mcp.figma.com/mcp

위 명령어를 터미널에 붙여넣고 실행하면 된다. 완료 후 /mcp를 입력하면 메뉴가 나타나고, Discover에서 Installed로 이동해 Figma MCP 서버 인증을 진행하면 된다. 브라우저 창이 열리면서 Figma 접근 권한 허용 절차가 진행된다. Substack

또는 Claude Code 채팅창에서 직접 입력해도 된다.

claude plugin install figma@claude-plugins-official

연결이 완료되면 Claude에 ‘Authentication successful. Connected to figma’가 표시된다. Figmapedia


연결하면 실제로 뭘 할 수 있나

연결 후 파이프라인은 양방향으로 작동한다. Figma에서 Claude 방향으로는, 컴포넌트 구조, 스페이싱 값, 보더 라디우스, 폰트 크기, 컬러 토큰, 오토레이아웃 설정, 레이어 계층까지 읽어들여 코드로 정확하게 변환해준다. Claude에서 Figma 방향으로는, Claude가 만든 UI를 편집 가능한 Figma 프레임으로 캡처해 넣어준다. 실제 레이어로 구성되어 있어 바로 수정하거나 복제할 수 있다. Substack

디자이너 입장에서 가장 체감 되는 것은 맥락 설명을 반복하지 않아도 된다는 점이다.

예전 방식은 이랬다.

“이 버튼은 Primary 버튼이고, 색상은 #2563EB이고, 패딩은 상하 12px, 좌우 20px이고, 보더 라디우스는 8px야. 이 스타일로…”

MCP 연결 후엔 그냥 Figma 링크 하나 던지면 된다. Claude가 알아서 읽는다.


한계도 솔직히 말하면

  • Figma Professional 이상 플랜이 없으면 Dev Mode를 못 쓴다. 공식 MCP는 Dev Mode가 필요하다. 무료 계정 사용자라면 비공식 오픈소스 플러그인(claude-talk-to-figma-mcp)을 써야 하는데, 설정이 훨씬 복잡해진다.
  • 현재는 Figma → 코드 방향이 더 안정적이다. 코드 to Figma 같은 양방향 흐름은 현재 Claude Code에서 가장 안정적으로 구현되며, Cursor나 Windsurf 등에서는 기능 차이나 제한이 있다. Litmers
  • 디자인 시스템 정리가 먼저다. 연동 효과는 기존 디자인 시스템 완성도에 비례한다. 가이드라인이 불명확하거나 파편화된 팀은 연동 전 정비가 먼저다. 레이어 이름이 Frame 432, Rectangle 7 이런 식이면 Claude도 헤맨다. 네이밍 정리가 선행되어야 한다. Dxtalk

2부. Claude Design에서 Figma로 가져오기

Claude Design이 뭔지

Claude Design은 Anthropic이 2026년 4월 17일 출시한 AI 비주얼 창작 도구다. Claude Opus 4.7 모델을 기반으로 하며, claude.ai 좌측 내비게이션의 팔레트 아이콘을 통해 접근할 수 있다. Digit2sight

자연어 프롬프트만으로 디자인 시안, 프로토타입, 슬라이드 같은 실무 결과물을 만들 수 있는 대화형 AI 디자인 도구로, 발표 당일 Figma 주가가 약 7% 하락할 정도로 업계의 관심이 쏠렸다. Elancer

기존 Claude가 텍스트와 코드 중심이었다면, Claude Design은 시각적인 결과물에 특화된 전용 모드다.


Claude Design → Figma로 옮기는 방법

Claude Design 자체에는 아직 Figma 직접 내보내기 버튼이 없다. 현재 가장 많이 쓰는 방법은 Anima라는 Figma 플러그인을 활용하는 방식이다.

순서

  1. claude.ai에 접속해 좌측 팔레트 아이콘 클릭 → Claude Design 모드 진입
  2. 원하는 화면을 프롬프트로 생성한다
  3. 완성된 결과물에서 ShareExport as standalone HTML 선택
  4. Figma에서 Anima 플러그인 실행
  5. HTML 파일을 불러오면 Figma 편집 가능한 레이어로 변환된다

Anima Figma 에이전트는 전문 디자이너가 Claude Design에서 Figma로 이동해 편집 가능한 캔버스에서 계속 작업할 수 있도록 도와준다. Anima


Claude Design의 실제 강점

온보딩 시 디자인 시스템 연동이 가능하다.

온보딩 과정에서 코드베이스와 디자인 파일을 읽어 디자인 시스템을 구축할 수 있기 때문에, 이후 프로젝트마다 일반적인 플레이스홀더 대신 실제 컬러, 타이포그래피, 컴포넌트를 사용하게 된다. Anima

한 번 설정해두면 매번 “우리 Primary 컬러는 이거야” 같은 설명을 반복하지 않아도 된다.

Claude Code와 연결하면 코드까지 바로 나온다.

디자인이 완성되면 Claude Design이 핸드오프 번들을 자동으로 생성할 수 있다. 이 번들에는 디자인 의도와 컴포넌트 구조, 스타일 정보가 정리되어 있어서 Claude Code에 한 번의 지시로 전달할 수 있다. “여기 이 번들을 기반으로 Next.js 프로젝트에 구현해줘” 정도의 명령이면 실제 코드로 옮기는 작업이 시작된다. Daleseo

디자이너가 Figma에서 시안을 만들고, 개발자가 그걸 다시 해석하는 과정에서 생기는 갭이 여기서 상당히 줄어든다.


Claude Design의 현실적인 한계

직접 써보고 느낀 것들이다.

  • 아직 Research Preview 단계다. Claude Design은 현재 연구 프리뷰(Research Preview) 단계이며, 향후 몇 주에 걸쳐 모든 유료 사용자에게 순차적으로 공개될 예정이다. 기능이 갑자기 바뀌거나 제한될 수 있다. Apiyi.com Blog
  • Figma로 넘어갈 때 레이어 정리가 필요하다. HTML → Figma 변환이다 보니, 자동 생성된 레이어 구조가 실무에서 바로 쓰기엔 지저분하다. 이후 정리 작업은 디자이너 몫이다.
  • 복잡한 인터랙션은 아직 약하다. AI 모델은 여전히 사람의 공감 능력이 필요한 깊이 있는 UX 로직에서는 어려움을 겪는다. 기본 레이아웃과 시각 구조는 잘 잡아주지만, 복잡한 상태 변화나 엣지 케이스는 직접 다듬어야 한다. Skypage

3부. 디자이너로서 이 도구를 어떻게 쓰면 좋을까

경력을 쌓으면서 느낀 건, 좋은 도구는 내 판단을 대체하는 게 아니라 내가 판단할 시간을 더 만들어준다는 것이다.

Claude + Figma 연동도 마찬가지다.

지금 당장 효과적인 사용 시나리오:

  • 초기 와이어프레임 초안 생성 → Claude Design으로 빠르게 뽑고, Figma에서 디테일 다듬기
  • 디자인 스펙 전달 → Figma MCP 연결 후 “이 컴포넌트 패딩이 몇이야?”를 Claude에게 물어보며 개발자와 소통
  • 디자인 시스템 문서화 → Claude가 Figma 파일 읽고 컴포넌트 사용 가이드 초안 생성
  • 핸드오프 준비 → Claude Design에서 핸드오프 번들 생성 → Claude Code로 넘겨서 프론트엔드 코드 출력

이건 Claude한테 맡기지 마라:

  • 서비스의 핵심 UX 흐름 결정. 이건 아직 사람이 해야 한다.
  • 사용자 리서치 기반의 의사결정. Claude는 데이터를 줘야 분석하지, 현장 감각은 없다.
  • 디자인 시스템의 최초 구축. 정리가 안 된 상태에서 연동하면 쓰레기가 더 빠르게 만들어질 뿐이다.
claude ai 와 figma 연동 카드뉴스 이미지
본 카드뉴스는 AI 이미지 생성 기술을 활용해 제작되었습니다

마무리

솔직히 말하면, 이 조합이 Figma를 대체하진 않는다.

적어도 지금은. Claude Design이 나왔을 때 Figma 주가가 떨어졌지만, 실무에서 써보면 여전히 Figma는 디자이너의 메인 작업 공간이다. Claude는 그 앞과 뒤를 더 빠르게 만들어주는 역할에 가깝다.

그럼에도 이 연동을 지금 세팅해두는 게 의미 있는 이유는, 워크플로우는 습관이기 때문이다. 지금 세팅해두고 조금씩 쓰다 보면, 6개월 뒤에는 이게 없는 방식으로 돌아가기 싫어지는 시점이 온다.

한번 연결해보고, 직접 판단해보길 권한다.


참고 링크

함께 읽으면 좋은 글