설정

← LEARN:US 목록
디자인 · 개발 · AI툴 · 2026.09.14
이 콘텐츠 공유

웹 디자인을 위한 클로드 셋업,
처음부터 따라 하실 수 있게 정리했습니다

클로드에 디자인 스킬을 붙이고, 만든 화면을 직접 확인하게 만들기

개발을 해 보신 적이 없어도 됩니다. 복사해서 붙여 넣는 것이 전부입니다. 단계마다 무엇을 복사해 어디에 붙이는지, 잘 됐으면 무엇이 보이는지, 안 되면 어디를 보면 되는지를 함께 적었습니다.

순서대로만 하시면 됩니다. 중간에 막히셔도 각 단계 아래에 막혔을 때를 위한 설명이 있습니다.

이 셋업은 Claude Code 위에서 돌아갑니다. 유료 요금제나 콘솔 계정이 있어야 로그인이 됩니다.

처음 준비하는 데 20~30분쯤 걸립니다. 한 번 해 두면 다음부터는 바로 쓰실 수 있습니다.

00 터미널 01 클로드 설치 02 스킬 3종 03 Figma 04 Playwright 05 첫 요청 06 막혔을 때

00. 터미널부터 엽니다

앞으로 나오는 명령은 전부 터미널에 붙여 넣습니다. 창 안에 글자만 빼곡한, 그 화면입니다. 이름이 낯설 뿐이지, 글을 붙여 넣고 엔터를 치는 창이라고 생각하시면 됩니다.

윈도우는 시작 단추를 누르고 PowerShell 이라고 친 다음 나오는 것을 엽니다.
맥은 스포트라이트(Command + 스페이스)에서 터미널 이라고 치고 엽니다.
여기까지 됐으면 창이 하나 열려 있고 커서가 깜빡입니다. 그 창을 끝까지 쓰시게 됩니다.
붙여 넣는 법만 익히면 끝입니다

이 글의 상자 오른쪽 위에 복사 단추가 있습니다. 누르시고 터미널 창을 클릭한 다음 Ctrl + V(맥은 Command + V)로 붙여 넣고 엔터를 칩니다. 그게 전부입니다.

여기부터는 로그인하면 이어서 볼 수 있어요.

간편 로그인하고 이어서 보기

로그인을 마치면 이 글로 바로 돌아와 전문이 열려요.

이 콘텐츠 공유

© BIZNI:US · LEARN:US · @bizni.us