inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

173만명의 커뮤니티!! 함께 토론해봐요.

node.js 설치 (LTS버전)

미해결

Figma MCP × AI x Vibe Coding 4시간만에 완성하는 반응형 웹포트폴리오

맥에서는 어떻게 선택하면 될까요?

  • HTML/CSS
  • figma
  • 포트폴리오
  • 인공지능(ai)
  • 바이브코딩
강예림 댓글 0 좋아요 0 조회수 3

Cursor & Antigravity 소개 및 설치

미해결

Figma MCP × AI x Vibe Coding 4시간만에 완성하는 반응형 웹포트폴리오

여기서 커서랑 비주얼스튜디오 말고 다른 툴을 사용해도 된다고 하셨는데 클로드를 사용해도 될까요?

  • HTML/CSS
  • figma
  • 포트폴리오
  • 인공지능(ai)
강예림 댓글 1 좋아요 0 조회수 5

24번 수업에 나온 창은 무슨 프로그램인가요

미해결

Figma MCP × AI x Vibe Coding 4시간만에 완성하는 반응형 웹포트폴리오

터미널은 써본적이 없는데... 그부분을 스킵하고 건너뛴 것 같아요 24번째 수업에 나오는 화면이 터미널인가요? ㄷㄷ 무슨 화면인지 모르겠네요 피그마 수업이 길고 ㅠㅠ 바이브 코딩 진입 부터 너무 훌쩍 건너뛰고 진행되는 느낌입니다..... 22. Node.js 설치 여기도 터미널 화면이 나오는데....당연히 사용법을 안다는 전제로 작성하셔서 따라가는데 어려움이 있고 당황스러워요

  • HTML/CSS
  • figma
  • 포트폴리오
  • 인공지능(ai)
  • 바이브코딩
suhyun lee 댓글 1 좋아요 0 조회수 14

Desktop모드-header영역 제작에서 제공해드린 폰트와 이미지

미해결

Figma MCP × AI x Vibe Coding 4시간만에 완성하는 반응형 웹포트폴리오

제공한 폰트를 다운받았냐고 물으시는데 다운을 어디서 받나요? 첫 강의 노션과 피그마를 봐도 링크가 안 보여요 관련 자료는 해당 강의에 코멘트로 링크를 주시면 좋을 것 같아요

  • HTML/CSS
  • figma
  • 포트폴리오
  • 인공지능(ai)
  • 바이브코딩
댓글 1 좋아요 0 조회수 11

토큰 추출을 베리어블+AI 활용 vs 토큰 스튜디오 차이

미해결

디자인 시스템 with 피그마

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요, 범쌤! 해당 강의를 보면서 디자이너와 개발자간의 협업에 있어서 토큰 스튜디오가 매우 중요한 역할을 하는구나 생각이 드는데요~ 그런데 최근 AI가 활용되면서 토큰 스튜디오 사용이 거의 없다는 얘기도 있던데, 토큰 스튜디오의 장점들이 대체가 가능한건지.. 실제 현업에서는 어떤지 궁금합니다. 그리고 피그마 베리어블만으로 AI를 활용해서 토큰으로 뽑고 활용하는 방법과 토큰 스튜디오의 토큰으로 사용할 때 차이점도 함께요!

  • figma
  • figma-tokens
  • 디자인-시스템
  • 아토믹-디자인
  • 프로덕트디자인
류지25 댓글 1 좋아요 0 조회수 27

'만능으로 쓰이는 기본카드' 강의 내용에 대해 질문드립니다.

미해결

[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기

안녕하세요, 강의듣고 있는 수강생입니다. '만능으로 쓰이는 기본카드' 강의 내용에서 utillties 부분에 해당하는 이미지 크기를 고정 시키는 플러그인을 알려주셨는데, 해당 플러그인 현재 2026년 8월 기준에는 나오지 않아서 첨부한 이미지와 같은 'Aspect Ratio Lock'을 사용해보았는데, 비슷하면서도 다른 플러그인이라 그런지, 강의에서 알려주신대로 도형에 바로 적용되지 않는 플러그인이며, 비율을 400:400로 키운다음에 1:1로 맞추려고 하면 고정 자체가 되지 않습니다 이렇게 플러그인을 사용할 수 없는 상황이라면, 이미지 비율을 고정시킬 수 있는 대체 방법에 대해 알려주실 수 있으실까요?

  • 웹-디자인
  • figma
  • figma-tokens
  • 디자인-시스템
  • 아토믹-디자인
  • figma-variable
  • 프로덕트디자인
D.Hye 댓글 2 좋아요 0 조회수 27

커서도 프로 요금제(유료 버전)이 필요하네요

미해결

요즘 AI 서비스 제작법: Google Stitch·Figma·Cursor로 기획부터 즉시 배포까지

커서도 유료 구독 필요하다고 강의 소개 업데이트 좀 해주세요.. Free 버전으로는 Sonnet 이용 불가요

  • notion
  • figma
  • cursor
  • 인공지능(ai)
  • mcp
  • claude
SouthCreate 댓글 2 좋아요 0 조회수 50

디자인 시스템 강의 질문

해결됨

비전공자도 쉽게 배우는 클로드 디자인

해당 내용에 대한 강의를 찾고있는데 혹시 몇강에서 사용했는지 알 수 있을까요?

  • figma
  • terminal
  • figma-plugin
  • ai-agent
  • claude
나유진 댓글 1 좋아요 1 조회수 77

[무료 강의] AI로 브랜드 가이드라인, 디자인 시스템 구축부터, 앱 제작, 피칭 덱, 카드 캐러셀까지

미해결

반응형 UI디자인 완전 정복 with 피그마

안녕하세요, 에릭입니다. 오랜만에 인사드려요. 오늘은 요즘 디자인 업계에서 벌어지고 있는 변화, 그리고 그걸 직접 해볼 수 있는 영상 하나를 들고 왔어요. 피그마 주가가 하루에 7% 떨어진 날 두 달 전에 '클로드 디자인'이라는 게 나왔습니다. 그리고 그날, 피그마 주가가 하루에 7%나 떨어지는 일이 있었어요. 시장이 이렇게 반응했다는 건 의미가 커요. 이제 UX/UI 디자인도 손으로 그리는 작업에서 프롬프트로 만드는 방향 으로 가고 있다는 것. 그리고 클로드 디자인이 내놓는 결과물이 그 흔한 'AI 티'가 나는 게 아니라, 디자이너가 만든 것 같은 수준 으로 나오고 있었다는 겁니다. 저도 직접 써보면서 확인했어요. 보라색 그라디언트에 어디서 본 듯한 화면이 아니라, 브랜드의 톤을 지키는 정돈된 결과물이 나옵니다. 말만 하면요. 아직 AI로 디자인을 안 해보셨다면, 이번이 좋은 타이밍이에요 피그마 같은 툴을 이미 마스터하셨거나 배우고 계신다면 이미 어느 정도 디자인에 대한 능력치를 쌓고 계신거에요. 그리고 여기에 AI디자인까지 활용할 수 있다면 속도에 날개를 달아줄 수 있습니다. 처음 해보는 분들도 따라올 수 있는 영상을 하나 준비했습니다. 클로드 디자인 A to Z 마스터클래스 (유튜브, 47분 분량) 브랜드 하나를 처음부터 끝까지 세우는 전체 과정이에요. 이론만 배우는 게 아니라 'Flowdeck'이라는 칸반 보드 앱을 실제로 만들어서 배포까지 했습니다. 순서는 이렇게 됩니다. - 브랜드 컨셉 & 로고 — 프롬프트만으로 시안 3개 뽑고 고르기 - 브랜드 가이드라인 — 미션·철학·보이스앤톤까지 - PRD & 화면 정의서 — '기획서'가 처음인 분들을 위한 개념 설명 포함 - 디자인 시스템 구축 — 컬러·폰트·컴포넌트를 하나의 원천으로 - 와이어프레임 → 하이파이 프로토타입 — 그리고 클로드 코드와 연동해서 실제 작동하는 앱으로 구현 - 랜딩 페이지 + 피칭덱 + 카드 캐러셀 까지 — 전부 같은 브랜드 톤으로 포인트는 산출물 하나하나가 아니라, 브랜드 가이드라인이라는 뿌리 하나에서 모든 결과물이 일관되게 뻗어 나오는 워크플로우 를 가져가시는 겁니다. 회사에서 몇 명이 나눠 하던 일을, 이제 혼자서 하실 수 있어요. "PRD가 뭐지, 디자인 시스템은 어디까지지" 막막했던 분들, 포트폴리오에 '실제 출시한 제품'을 넣고 싶었던 분들에게 특히 도움이 될 거예요. ▶ 마스터클래스 영상 보러 가기 커피 한 잔 준비하시고, 가능하면 화면 옆에 클로드 켜두고 따라 해보세요. 실습에 쓴 문서들(브랜드 가이드라인·PRD 등)도 해당 유튜브 영상 댓글에 공개해뒀습니다. 그럼, 다음에 뵈요. 에릭 드림 [카카오 그룹챗 안내] 카카오톡에서 "AI 빌더 커뮤니티" 그룹챗을 운영을 시작했습니다. 앞으로 AI 관련된 컨텐츠 소식을 이 채널을 통해서 공유하고 AI 및 스터디 정보를 공유하고 함께 성장하는 공간으로 활용합니다. 그룹챗 조인하기 >>

  • figma
  • 반응형-웹
  • ui
  • ux
  • 취업
에릭 댓글 1 좋아요 0 조회수 41

[무료 강의] AI로 브랜드 가이드라인, 디자인 시스템 구축부터, 앱 제작, 피칭 덱, 카드 캐러셀까지

미해결

입문자에서 실무자로: 피그마로 마스터하는 디자인 시스템 A to Z

안녕하세요, 에릭입니다. 오랜만에 인사드려요. 오늘은 요즘 디자인 업계에서 벌어지고 있는 변화, 그리고 그걸 직접 해볼 수 있는 영상 하나를 들고 왔어요. 피그마 주가가 하루에 7% 떨어진 날 두 달 전에 '클로드 디자인'이라는 게 나왔습니다. 그리고 그날, 피그마 주가가 하루에 7%나 떨어지는 일이 있었어요. 시장이 이렇게 반응했다는 건 의미가 커요. 이제 UX/UI 디자인도 손으로 그리는 작업에서 프롬프트로 만드는 방향 으로 가고 있다는 것. 그리고 클로드 디자인이 내놓는 결과물이 그 흔한 'AI 티'가 나는 게 아니라, 디자이너가 만든 것 같은 수준 으로 나오고 있었다는 겁니다. 저도 직접 써보면서 확인했어요. 보라색 그라디언트에 어디서 본 듯한 화면이 아니라, 브랜드의 톤을 지키는 정돈된 결과물이 나옵니다. 말만 하면요. 아직 AI로 디자인을 안 해보셨다면, 이번이 좋은 타이밍이에요 피그마를 이미 마스터하셨거나 배우고 계신다면 이미 어느 정도 디자인에 대한 능력치를 쌓고 계신거에요. 그리고 여기에 AI디자인까지 활용할 수 있다면 속도에 날개를 달아줄 수 있습니다. 그래서 처음 해보는 분들도 따라올 수 있는 영상을 하나 준비했습니다. 클로드 디자인 A to Z 마스터클래스 (유튜브, 47분 분량) 브랜드 하나를 처음부터 끝까지 세우는 전체 과정이에요. 이론만 배우는 게 아니라 'Flowdeck'이라는 칸반 보드 앱을 실제로 만들어서 배포까지 했습니다. 순서는 이렇게 됩니다. - 브랜드 컨셉 & 로고 — 프롬프트만으로 시안 3개 뽑고 고르기 - 브랜드 가이드라인 — 미션·철학·보이스앤톤까지 - PRD & 화면 정의서 — '기획서'가 처음인 분들을 위한 개념 설명 포함 - 디자인 시스템 구축 — 컬러·폰트·컴포넌트를 하나의 원천으로 - 와이어프레임 → 하이파이 프로토타입 — 그리고 클로드 코드와 연동해서 실제 작동하는 앱으로 구현 - 랜딩 페이지 + 피칭덱 + 카드 캐러셀 까지 — 전부 같은 브랜드 톤으로 포인트는 산출물 하나하나가 아니라, 브랜드 가이드라인이라는 뿌리 하나에서 모든 결과물이 일관되게 뻗어 나오는 워크플로우 를 가져가시는 겁니다. 회사에서 몇 명이 나눠 하던 일을, 이제 혼자서 하실 수 있어요. "PRD가 뭐지, 디자인 시스템은 어디까지지" 막막했던 분들, 포트폴리오에 '실제 출시한 제품'을 넣고 싶었던 분들에게 특히 도움이 될 거예요. ▶ 마스터클래스 영상 보러 가기 커피 한 잔 준비하시고, 가능하면 화면 옆에 클로드 켜두고 따라 해보세요. 실습에 쓴 문서들(브랜드 가이드라인·PRD 등)도 해당 유튜브 영상 댓글에 공개해뒀습니다. 그럼, 다음에 뵈요. 에릭 드림 [카카오 그룹챗 안내] 카카오톡에서 "AI 빌더 커뮤니티" 그룹챗을 운영을 시작했습니다. 앞으로 AI 관련된 컨텐츠 소식을 이 채널을 통해서 공유하고 AI 및 스터디 정보를 공유하고 함께 성장하는 공간으로 활용합니다. 그룹챗 조인하기 >>

  • figma
  • figma-tokens
  • 디자인-시스템
  • responsive-design
  • uiux
에릭 댓글 1 좋아요 0 조회수 47

[무료 강의] AI로 브랜드 가이드라인, 디자인 시스템 구축부터, 앱 제작, 피칭 덱, 카드 캐러셀까지

미해결

피그마(Figma)를 활용한 UI디자인 입문부터 실전까지 A to Z

안녕하세요, 에릭입니다. 오랜만에 인사드려요. 오늘은 요즘 디자인 업계에서 벌어지고 있는 변화, 그리고 그걸 직접 해볼 수 있는 영상 하나를 들고 왔어요. 피그마 주가가 하루에 7% 떨어진 날 두 달 전에 '클로드 디자인'이라는 게 나왔습니다. 그리고 그날, 피그마 주가가 하루에 7%나 떨어지는 일이 있었어요. 시장이 이렇게 반응했다는 건 의미가 커요. 이제 UX/UI 디자인도 손으로 그리는 작업에서 프롬프트로 만드는 방향 으로 가고 있다는 것. 그리고 클로드 디자인이 내놓는 결과물이 그 흔한 'AI 티'가 나는 게 아니라, 디자이너가 만든 것 같은 수준 으로 나오고 있었다는 겁니다. 저도 직접 써보면서 확인했어요. 보라색 그라디언트에 어디서 본 듯한 화면이 아니라, 브랜드의 톤을 지키는 정돈된 결과물이 나옵니다. 말만 하면요. 아직 AI로 디자인을 안 해보셨다면, 이번이 좋은 타이밍이에요 피그마를 이미 마스터하셨거나 배우고 계신다면 이미 어느 정도 디자인에 대한 능력치를 쌓고 계신거에요. 그리고 여기에 AI디자인까지 활용할 수 있다면 속도에 날개를 달아줄 수 있습니다. 그래서 처음 해보는 분들도 따라올 수 있는 영상을 하나 준비했습니다. 클로드 디자인 A to Z 마스터클래스 (유튜브, 47분 분량) 브랜드 하나를 처음부터 끝까지 세우는 전체 과정이에요. 이론만 배우는 게 아니라 'Flowdeck'이라는 칸반 보드 앱을 실제로 만들어서 배포까지 했습니다. 순서는 이렇게 됩니다. - 브랜드 컨셉 & 로고 — 프롬프트만으로 시안 3개 뽑고 고르기 - 브랜드 가이드라인 — 미션·철학·보이스앤톤까지 - PRD & 화면 정의서 — '기획서'가 처음인 분들을 위한 개념 설명 포함 - 디자인 시스템 구축 — 컬러·폰트·컴포넌트를 하나의 원천으로 - 와이어프레임 → 하이파이 프로토타입 — 그리고 클로드 코드와 연동해서 실제 작동하는 앱으로 구현 - 랜딩 페이지 + 피칭덱 + 카드 캐러셀 까지 — 전부 같은 브랜드 톤으로 포인트는 산출물 하나하나가 아니라, 브랜드 가이드라인이라는 뿌리 하나에서 모든 결과물이 일관되게 뻗어 나오는 워크플로우 를 가져가시는 겁니다. 회사에서 몇 명이 나눠 하던 일을, 이제 혼자서 하실 수 있어요. "PRD가 뭐지, 디자인 시스템은 어디까지지" 막막했던 분들, 포트폴리오에 '실제 출시한 제품'을 넣고 싶었던 분들에게 특히 도움이 될 거예요. ▶ 마스터클래스 영상 보러 가기 커피 한 잔 준비하시고, 가능하면 화면 옆에 클로드 켜두고 따라 해보세요. 실습에 쓴 문서들(브랜드 가이드라인·PRD 등)도 해당 유튜브 영상 댓글에 공개해뒀습니다. 그럼, 다음에 뵈요. 에릭 드림 [카카오 그룹챗 안내] 카카오톡에서 "AI 빌더 커뮤니티" 그룹챗을 운영을 시작했습니다. 앞으로 AI 관련된 컨텐츠 소식을 이 채널을 통해서 공유하고 AI 및 스터디 정보를 공유하고 함께 성장하는 공간으로 활용합니다. 그룹챗 조인하기 >>

  • 웹-디자인
  • 모바일-디자인
  • figma
  • 프로덕트디자인
에릭 댓글 1 좋아요 0 조회수 36

PPT 제작 시 실제와 강의 내용 차이 문의

해결됨

비전공자도 쉽게 배우는 클로드 디자인

ppt 제작하는데 우버 스타일로 제작후 스킬 넣고 다시 제작해 하니까 우버 스타일 지정이라 해당 스킬을 적용할수 없다네요. 수정하고 싶은거만 알려달라는데... 강의 내용따라 한다고 하니 해당 스킬로 만들려면 새로 만들어라고 하네요.

  • figma
  • terminal
  • figma-plugin
  • ai-agent
  • claude
kangdh777 댓글 2 좋아요 1 조회수 54

figma.com/@boldux 계정이 없다고 나옵니다

미해결

[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기

bold님 계정 운영을 안하시는건가요? 강의에서 보이는 화면이 검색에서 나오지 않습니다

  • 웹-디자인
  • figma
  • figma-tokens
  • 디자인-시스템
  • 아토믹-디자인
  • figma-variable
  • 프로덕트디자인
최정임 댓글 2 좋아요 0 조회수 48

문의

미해결

피그마UI3 기초 + 실무 탄탄 초스피드 완강코스

8강에 연결되는 창들은 일아서 만들어야 하는 건가요~?

  • figma
  • ui
qq 댓글 1 좋아요 0 조회수 49

변수 설정 시에 질문입니다.

미해결

Figma MCP × AI x Vibe Coding 4시간만에 완성하는 반응형 웹포트폴리오

안녕하세요, J.영님. 강의 잘 수강하고 있습니다, 감사합니다. 일전에 변수 설정을 올려주셔서 모두 적용하고 태블릿,모바일버전까지 만들었습니다. 이 부분에서 궁금한 점이 생겼는데, 모바일버전까지는 직접 다 손으로 디자인하고, 해당 수치를 변수로 등록하나요 ? 예를 들어 이 강의에서 언급된 'desktop-section-skill' 에서 line height가 데스크탑/태블릿/모바일 이 다 다른데, 이 부분은 결국 다 디자인 해보고 변수 등록 하는게 아닌가 싶어서요. 아니면 대략적으로 얼마나 줄어든다와 같은 공식이 있나요 ? 저는 J.영님이 설정하라는대로만 해서 모바일로 편하게 바꿨는데, 제 작업을 할때는 오토레이아웃으로 모바일까지 다 설정해두고 그 다음에서야 변수 등록을 하는게 맞나 싶어서 확인차 질문 남깁니다 !

  • HTML/CSS
  • figma
  • 포트폴리오
  • 인공지능(ai)
  • 바이브코딩
오상훈/디자인컨버전스학부 댓글 2 좋아요 0 조회수 48

템플릿 생성

해결됨

비전공자도 쉽게 배우는 클로드 디자인

시안 3개에 대한 템플릿 생성이 안 되는데 지금 버전에서는 막혀있어서 그런 걸까요?

  • figma
  • terminal
  • figma-plugin
  • ai-agent
  • claude
나유진 댓글 1 좋아요 0 조회수 57

클로드 디자인 안에서 프롬프트 작성시?

해결됨

비전공자도 쉽게 배우는 클로드 디자인

클로드코드가 아닌 클로드 디자인 안에서 내용을 수정하는 작업은 토큰을 많이 잡아 먹지 않는건가요??

  • figma
  • terminal
  • figma-plugin
  • ai-agent
  • claude
마스터코드 댓글 1 좋아요 1 조회수 64

디자인 시스템 관련 질문드립니다!

해결됨

비전공자도 쉽게 배우는 클로드 디자인

저희 회사 홈페이지를 상업목적으로 제작할 예정인데 일관된 디자인 시스템을 입혀서 제작하고 싶은데 이런 경우 클로드 코드에 디자인 시스템 md 파일로 추가해놓은에 사업 확장에 따른 추가되는 페이지를 바이브코딩으로 design.md 파일을 참조해서 제작하라고 하면 어떨까 싶은데 가능할까요? 또한 디자인 시스템을 코드로 생성하는 방법과 경로를 알고 싶습니다!

  • figma
  • terminal
  • figma-plugin
  • ai-agent
  • claude
마스터코드 댓글 2 좋아요 1 조회수 85

피그마 스킬설치 강의 중 피그마 디자인 파일 링크 관련 문의

해결됨

비전공자도 쉽게 배우는 클로드 디자인

피그마 디자인 파일 링크 클릭하면 권한요청 하라고 해서 했는데, 기다리면 되는 건가요? 아니면 제가 뭘 잘못한걸까요?

  • figma
  • terminal
  • figma-plugin
  • ai-agent
  • claude
이후한 댓글 2 좋아요 1 조회수 74

Request for Prompts

해결됨

비개발자를 위한 코덱스 AI 실무 자동화: 기획부터 마케팅까지

Hello, I have been trying to follow along via the transcripts but struggle with demos. Is there a way you could share the prompts in English?

  • 디지털 마케팅
  • figma
  • codex
  • ai
  • chatgpt
  • vibe-coding
Zara Palevani 댓글 1 좋아요 0 조회수 43

인기 태그

인프런 TOP Writers

주간 인기글