Thumbnail
BEST
디자인 · 아트UX/UI

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

(4.9)
168개의 수강평 ∙ 1,396명의 수강생
198,000원

월 39,600원

5개월 할부 시
지식공유자: 볼드 UX
총 81개 수업 (19시간 53분)
수강기한: 
무제한
수료증: 발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변이 제공되는 강의입니다
폴더에 추가공유
  • 모모 프로필모모
    2025-09-181680494

    안녕하세요! 아래 상세한 답변 감사합니다 ㅎㅎ 추가적으로 궁금한 점이 있습니다. 기존 강의에서 제공하는 완주선물혜택인[강의 노션 요약본 PDF, 워밍업 클럽 특강 자료, 디자인 실무 필수 자료 제공, 인프런 워밍업 미션 완성본 피그마 파일]은 부트캠프 강의에서는 따로 제공이 안되는건지 궁금합니다!

    볼드 UX
    볼드 UX
    볼드 UX
    2025-09-18441935

    전부 다 제공 해드릴 예정입니다! 완강만 하시면 됩니다.

  • 모모 프로필모모
    2025-09-171680083

    안녕하세요! 현재 2년차 디자이너로, 직접 디자인 시스템을 구축한 경험은 여러 번 있지만 정석적인 개념이나 체계에 기반해 만든 것 같지 않아 이번에 더 깊이 공부해보려 합니다. 개인적으로 디자인시스템 관련 문서를 통해 공부중인데, 텍스트로 공부하다 보니 많이 부족하게 느껴져서 강의를 들을 예정입니다! 강의에 대해 궁금한 점이 있는습니다. 현재 해당 [디자인 시스템 강의]와 [6주 완성 디자인 시스템 부트캠프 4기]의 차이가 어떻게 되는지 알고 싶습니다. 댓글에 동일한 강의 내용을 기반으로 한다고 되어 있는데, 1) 두 강의의 커리큘럼이 실제로 동일한지? 2) 부트캠프는 참여형·실습형 형식이 주 목적이고 강의 자체는 약간의 차이가 있는지? 또 마지막으로, 저 같은 케이스는 어떤 강의를 듣는게 좋을지 고민입니다ㅜㅜ 부트캠프도 현재 참여할 수는 있어서 커리큘럼이 거의 동일하다면 두 강의 중 아무거나 들어도 상관은 없을 것 같습니다~! 답변 남겨주시면 감사하겠습니다 ㅎㅎ

    볼드 UX
    볼드 UX
    볼드 UX
    2025-09-17441674

    안녕하세요, 모모님 두개가 비슷하고 차이는 6주 동안 미션을 갖고 다른 수강생들과 완주한다는 차이가 있습니다. 라이브 오리엔테이션, Q&A, 그리고 특강 - 그리고 완주 시 우수자들은 혜택도 있습니다. 저는 아래 조건이 해당하시면 해보시는 걸 추천드립니다. 1. 배리어블로 디자인 시스템 구축하고 싶다(기존 강의) 2. 6주 동안 최소 하루 1시간이 있어서 미션을 끝낼 수 있다.(완주율이 3배차이) 3. 질문이 많아서 실시간으로 물어보거나 특강도 듣고싶다.(특강은 기존 강의에 없습니다) 결정하시는데, 도움이 되셨으면 좋겠습니다.

  • 엄묭 프로필엄묭
    2025-09-151679266

    피그마와 디자인 자체를 접한지 얼마안된 uiux초짜입니다. 듣는데 무리없을까요? 올해 디자인시스템 구축을 목표로 하고있습니다! 실무를 피그마로 하고있어서 얼레벌레 하고있습니다. 이쪽 사수가 없다보니 강의로 사수님을 찾고있습니닷! 비싸서 고민인데 제 투자로 생각하고 결제 진행하려하는데 괜찮을까요?

    볼드 UX
    볼드 UX
    볼드 UX
    2025-09-15441435

    안녕하세요, 엄묭님 디자인 시스템 구축을 목표로 하신다면 이 강의를 수강하셔도 좋습니다. 다만 디자인 시스템은 혼자 만드는 것이 아니라 개발자와 팀원들이 함께 만들어가는 과정이지만, 디자이너가 주도적으로 진행할 수 있는 부분은 이 강의에서 충분히 다루고 있습니다. 특히 올해 안에 디자인 시스템을 완성하고 싶으시다면, 시간이 3개월 정도밖에 남지 않았기 때문에 챌린지 프로그램 참여를 추천드립니다. 동일한 강의 내용을 기반으로 하지만, 6주 동안 밀착형으로 진행되며 제가 오리엔테이션부터 Q&A까지 직접 함께합니다. 현재 가격도 더 저렴하게 제공되고 있으니 이쪽으로 참여하셔도 좋을 것 같습니다. 마지막으로 수강평은 제가 임의로 조작할 수 없는 부분이니, 직접 읽어보시고 결정해 주시면 도움이 될 거라 생각합니다. 감사합니다.

  • whgu 프로필whgu
    2025-08-141660614

    안녕하세요! 강의 수강 신청을 진행하려고 하는데, 현재 결제 금액이 할인가(158,400)가 아닌 정가(198,000)로 표시되고 있어 확인 요청드립니다. 검토 후 답변 부탁드립니다.

    볼드 UX
    볼드 UX
    볼드 UX
    2025-08-14435177

    안녕하세요, 방금 수강생 목록에 보니 있으신 걸 보니 인프런팀을 통해 잘 해결되신 것 같습니다. 강의 들으시면서 궁금 하신 부분 있으시면 무엇이든 질문 주세요. 감사합니다!

  • Alice 프로필Alice
    2025-06-171617403

    5월 14일에 있던 최근 피그마 업데이트를 반영하실 예정이실까요? 컴포넌트 네이밍에 대한 내용도 다루시는지 궁금합니다. (규칙 등)

    볼드 UX
    볼드 UX
    볼드 UX
    2025-06-17422945

    Alice님 안녕하세요, 현재 제 강의는 최신 내용을 반영하여 꾸준히 업데이트되고 있습니다. 혹시 최근 Figma Config 관련 업데이트를 말씀하신 것이라면, 해당 변경 사항들은 강의 주요 내용과는 크게 관련이 없어 현재로선 강의에 반영할 계획은 없습니다. 다만, 베리어블(Variables)과 같이 강의 주제와 밀접한 기능 업데이트가 있을 경우에는 수강생 분들을 위해 신속하게 반영해드리고 있습니다. 그동안의 업데이트 흐름은 수강생 리뷰를 보시면 확인하실 수 있습니다. 또한 강의에서는 컴포넌트 네이밍과 관련된 부분도 충분히 설명드리고 있으며, 수강 중 혼란스러우실 수 있는 용어나 표기법 등은 정리된 PDF 자료로 제공하고 있습니다. 이 자료는 완강하신 분들께 드리지만, 수강 중 미리 필요하신 경우 요청 주시면 보내드리고 있습니다. 수강생 분이 필요로 하시는 부분을 최대한 맞춰드리기 위해 노력하고 있으며, 더 배우고 싶은 내용이 있으실 경우 요청에 따라 웨비나, 1:1 세션, 혹은 추가 강의도 고려하고 있습니다. 강의 수강 전에 참고가 되셨기를 바랍니다. 감사합니다.

  • darkmoon90 프로필darkmoon90
    2025-02-271531162

    디자인 토큰을 이용해서 토큰 구조도도 짤 수 있는 방법을 알려주시는건가요? 그리고 다크모드 디자인 시스템에 대한 내용도 다루는 걸까요?

    볼드 UX
    볼드 UX
    볼드 UX
    2025-02-27400955

    안녕하세요! 강의에 관심 가져주셔서 감사합니다. 이 강의에서 직접 실습하며 배울 수 있는 내용은 다음과 같습니다. - Figma 베리어블(디자인 토큰)의 이름 짓기, 구조 설계 방법을 자세히 익힙니다. - 색상, 타이포그래피, 쉐도우 등 현재 Figma에서 지원하는 모든 베리어블을 다룹니다. - 단순한 스타일 가이드 제작을 넘어, 베리어블을 적용한 33개 이상의 버튼 컴포넌트를 만들어봅니다. - 다크 모드뿐만 아니라 브랜드, 반응형, 언어 전환 모드까지 학습합니다. - 강의에서 만든 모든 컴포넌트를 페이지 단위로 조합하여 모드 적용까지 실습합니다. 이 강의를 듣고 복습하시면, Figma를 능숙하게 다룰 수 있으며 디자인 시스템(토큰 및 UI 키트) 활용 능력을 키울 수 있습니다. 추가로 궁금한 점이 있다면 언제든지 문의 주세요!

  • dasom won 프로필dasom won
    2025-02-261530909

    워밍업 클럽 하면서 강의 들으려했는데 워밍업클럽 모집 마감인가요??

    볼드 UX
    볼드 UX
    볼드 UX
    2025-02-27400868

    안녕하세요 dasom won님 인프런 워밍업은 마감 되었습니다. 인프런워밍업은 인프런팀에서 관리하고 있습니다. 죄송합니다.

  • 아웃프런 프로필아웃프런
    2025-02-251529436

    1. 주니어 서비스 기획자가 듣기에도 괜찮은 강의일까요? 2. 워밍업 클럽 참여시 강의와 과제를 포함한 하루 예상 소요 시간이 궁금합니다.

    볼드 UX
    볼드 UX
    볼드 UX
    2025-02-26400627

    안녕하세요, 아웃프런님. 이 강의는 주니어 서비스 기획자분들에게도 매우 유용합니다. 디자이너 및 개발자와의 원활한 소통에 도움이 될 뿐만 아니라, 디자인 시스템이 어떻게 만들어지는지 직접 만들어보면서 살펴볼 수 있습니다. 특히, 모든 강의를 수강하시면 피그마를 자유롭게 활용할 수 있게 되어, 기획문서를 피그마에서 효율적으로 제작할 수 있으며, 컴포넌트를 가져다가 쉽게 사용하실 수 있습니다. 실제로 많은 PM 및 기획자분들이 제 강의를 들으셨으며, 개발자분들도 많이 참여하셨습니다. 또한, 인프런 워밍업 과정은 하루 최소 2시간 이상 투자하는 것이 좋습니다. 강의는 보통 1시간 정도이며, 과제 수행에 1시간 정도가 소요되는 커리큘럼으로 구성되어 있습니다. 과제는 주말에 몰아서 진행하셔도 괜찮습니다. 3월 한 달 동안 개인 일정을 조정하고 강의에 집중하신다면, 피그마와 디자인 시스템을 동시에 익힐 수 있는 매우 유익한 시간이 될 것입니다.

  • Hyse 프로필Hyse
    2025-02-011508661

    올해 2월초 스터디 모집을 할 예정이라고 하셨는데, 먼저 수강신청후에 스터디 모집이 열리면 신청도 가능한가요?

    볼드 UX
    볼드 UX
    볼드 UX
    2025-02-01395692

    미리 신청 하셔도 상관없습니다. 스터디는 수강생 누구나 참여가능합니다. 스터디는 3월에 시작할 예정이라 미리 2월에 강의를 듣고 참여하시면 수월하실 것입니다. 왜냐하면 1달동안 강의와 미션을 동시에 수행하는 거라 굉장히 일정이 빡빡합니다.

  • 마몬드 프로필마몬드
    2025-01-201493779

    지금은 쿠폰은 적용이 안되는걸까요?

    볼드 UX
    볼드 UX
    볼드 UX
    2025-01-20393450

    인프런에서 발급한 쿠폰의 경우는 인프런 쪽에서 관리하고 있어서 저는 잘 모릅니다. 저는 현재 완강 이벤트 지인 추천 쿠폰만 발급하고 있으며, 최근에 업데이트해서 2026년까지 가능합니다. 지금도 최대 할인 중이니 강의에 관심 있으시면 신청해주세요. 궁금하신 점 있으면 boldplus.ux@gmail.com으로 직접 연락주세요. 감사합니다.

  • 용꾸 프로필용꾸
    2025-01-131488063

    피그마 최신 버전의 강의일까요?

    볼드 UX
    볼드 UX
    볼드 UX
    2025-01-19393239

    현재 강의는 UI2로 제작 되어 있으며, UI3로 2월 초애 업데이트 예정입니다. 업데이트시 가격 인상도 고려중이라 미리 사시는 것을 추천드립니다. 감사합니다!

  • 시원한 코알라 프로필시원한 코알라
    2025-01-041479118

    스터디모집 또 모집 안하나요?? 피그마 업데이트된 버전으로 강의 제작 계획도 궁금합니다

    볼드 UX
    볼드 UX
    볼드 UX
    2025-01-04389970

    시원한 코알라님 안녕하세요! 스터디 모집은 2월 초에 진행될 것 같습니다. 아직 인프런팀이랑 이야기 중이긴하지반 이번에도 워밍업 스터디 3기에 참여할 예정입니다. 강의는 2월 초 스터디에 맞추어서 업데이트 예정입니다. 현재, 기존 UI2 강의도 보실 수 있고 새로 업데이트 된 UI3 강의로도 보실 수 있도록 준비 중입니다. 추가로 타이포그래피 베리어블, 컴포넌트 워크시트, 버튼 스택 컴포넌트, Fixed ratio 이미지 등 지금 강의보다 더 많은 컨텐츠를 추가할 예정이며, 현재 80퍼센트 촬영 편집이 완료 되었습니다. 현재 제 강의는 현재 기준으로 제일 저렴하다는 알려드립니다. 궁금하신 점 있으시면 강의 구매 전에 언제든지 질문 주세요! 감사합니다.

  • 도크 프로필도크
    2024-12-111458380

    혹시 쿠폰이벤트는 끝났을까요? 쿠폰함으로 이동은 되는데 보이지 않아 문의 드립니다!!

    볼드 UX
    볼드 UX
    볼드 UX
    2024-12-11385979

    "피그마배리어블"이라고 할인쿠폰 코드 입력란에 입력하시고 등록하시면 됩니다. ㅎㅎ

  • 마이클 프로필마이클
    2024-12-081456392

    안녕하세요. 강의전 궁금한 사항이 있어서 문의드립니다. 현직 개발자로 일하고 있습니다. 회사에서 디자이너가 따로 없어서 웹페이지를 리뉴얼중에 있습니다. 디자인을 전체적으로 한다기보다는 전체 레이아웃 / 버튼 / 테이블 / 체크박스 / 폰트 등 공통으로 쓰이는 부분을 통일성 있게 구성을 하려고 생각하고 있습니다. 혹시 이 강의를 들으면 많은 도움이 될까 해서 문의 드려봅니다.

    볼드 UX
    볼드 UX
    볼드 UX
    2024-12-09385591

    안녕하세요, 마이클님 목표가 통일성 있는 웹페이지 구현이라면 제 강의가 적합할 수 있습니다. 제 강의에서는 전체 레이아웃, 버튼, 테이블, 체크박스, 폰트 등 주요 UI 요소들을 스타일 가이드를 기반으로 공통된 스타일을 설정하고, 베리어블(변수)을 활용하여 일관된 디자인을 구현하는 방법을 다룹니다. 이 베리어블들은 JSON 파일로 내보내어 Style Dictionary라는 npm 패키지를 통해 CSS로 변환해 바로 사용할 수 있어 개발 효율성도 높입니다. 다만, 강의는 다음과 같은 점들을 고려하셔야 합니다: 난이도: 베리어블 활용은 개발자 분에게는 상당히 어려울 수 있습니다. 지금까지 완강하신 분들 중 대부분이 프론트엔드 개발자들이셨고, 난이도가 있다는 피드백을 주셨습니다. 그리고 백엔드 개발자분들께는 다소 어려울 수 있습니다. 강의 시간: 강의 분량은 약 14시간이며, 실습까지 제대로 진행하신다면 30시간 이상 소요될 수 있습니다. 스터디 모임이 진행 예정 중이라 같이 공부하시면 다 끝내실 수 있습니다. 결론적으로: 마이클님이 목표로 하시는 웹페이지 구현에는 강의 내용이 적합하지만, 위에서 언급한 난이도와 학습 시간 투자를 꼭 고려해 주세요. 다른 강의들도 살펴보시고, 마이클님께 가장 알맞은 강의를 찾으시기를 바랍니다. 감사합니다.

  • gangsugi 프로필gangsugi
    2024-08-101348807

    2024년6월에 대대적으로 피그마 화면부터 싹 바뀌었는데요, 그 부분이 반영이 된 강의인지 궁금합니다. 새로 바뀐 UI 로 강의를 볼수 있는건지요???

    볼드 UX
    볼드 UX
    볼드 UX
    2024-08-10359570

    질문해 주셔서 감사합니다. 본 강의는 새로운 UI가 아닌 기존 UI를 기반으로 만들어졌습니다. 강의를 수강하실 때는 ‘Go back to previous UI’로 돌아가셔서 학습을 완료하시는 것을 추천드립니다. 완강하시면 모든 개념과 변수(variable)를 어떻게 활용하는지 이해하실 수 있을 것입니다. 이후, 제가 8월 중순에 진행할 라이브 강의에서는 UI2에서 UI3로 무엇이 어떻게 바뀌었는지 분석해 드릴 예정입니다. 이 강의를 들으시면 새로운 UI에서 어떤 부분이 어떻게 적용되었는지 더 잘 이해하게 되실 것입니다. 9월 초,중순에 녹화 강의도 업로드할 예정입니다. 이 강의를 수강하시면 조금이라도 UI3를 사용하는 데 큰 도움이 될 것입니다. 당분간은 아직 베타 버전이라 UI를 바꿔서 강의를 찍을 계획은 없습니다. 이번 주에도 툴에서 Clip content와 Constraints이 변경이 되었고 앞으로도 계속 바뀔 예정입니다. 하지만 베타 버전이 종료되면 강의를 재촬영할 예정입니다. 마지막으로 새로운 UI의 피그마 툴을 배우고 싶으시면 본 강의는 적합하지 않습니다. 하지만 피그마 베리어블을 활용한 전반적인 토큰, UI 킷 디자인 시스템을 배우고 싶으시다면 단언컨대 강력 추천합니다. 수강생 분들이 남기신 리뷰 꼭 확인 해보시기 바랍니다. 강의를 수강하시기 전에 이 정보가 도움이 되었으면 좋겠습니다.

  • moonjulu 프로필moonjulu
    2024-08-071346136

    혹시 강의 할인 이벤트 진행 계획이 있으신가요~?

    볼드 UX
    볼드 UX
    볼드 UX
    2024-08-08359040

    인프런에서 진행하는 이벤트는 항상 있습니다. 저장해놓고 기다리시면 알림이 가는걸로 알고 있습니다. 감사합니다!

  • 은비 프로필은비
    2024-07-121319904

    혹시 피그마 유료계정으로 들어야 하는 수업이 있을까요?

    볼드 UX
    볼드 UX
    볼드 UX
    2024-07-12353282

    무료 계정으로 배리어블 등록은 가능하지만 다중 모드를 사용하기 위해서는 그 이상의 계정이 필요합니다. 본 강의를 들으시면 피그마의 다중 모드 기능을 무료로 사용할 수 있는 방법을 안내해드릴 예정이니 걱정하지 않으셔도 됩니다.

  • 오미현 프로필오미현
    2024-06-291306988

    혹시 스터디를 나중에 또 진행하실 예정이 있으신가요?? ㅠㅠ 오늘 이 강의를 사이트에서 처음 보는 바람에..ㅠㅠ 스터디가 어제 마감인걸 오늘 알아버려서요 ㅠㅠㅠ

    볼드 UX
    볼드 UX
    볼드 UX
    2024-06-29350388

    안녕하세요. 스터디 7월 3일까지 더 연장해서 모집할 예정입니다. 20명 넘게 모이시긴 했는데, 강의 수강하시고 지원해주세요!

  • imagineMaker 프로필imagineMaker
    2024-06-021281197

    베리어블을 프로토타이핑에 쓸 수 있는 방법도 배우고 싶습니다. 이것에 대한 강의 내용도 혹시 있을까요? 아니라면 강의를 해보실 의향은 있으실까요??

    볼드 UX
    볼드 UX
    볼드 UX
    2024-06-02343733

    imagineMaker님 안녕하세요. 본 강의에서는 프로토타이핑은 다루지 않고 있습니다. 본 강의가 아닌 다른 강의를 통해 준비를 하고는 있긴합니다. 혹시 구체적으로 어떤 부분에 대해서 궁금하신지 여쭤뵙고 싶은데, 혹시 관심있으시면, 제 이메일로 boldplus.ux@gmail.com으로 연락주시면 감사하겠습니다. 감사합니다!

  • dlatjdgus 프로필dlatjdgus
    2024-05-011254867

    디자인 시스템 레퍼런스나 실제로 앱을 사용하다보면 OS별로 디자인 컴포넌트들의 height와 같이 사이즈들이 달라지는 경우를 많이 접했는데요, 관련한 내용도 혹시 강좌에 담겨있는지 궁금합니다 :) 혹시 볼드님 회사의 디자인 시스템은 OS별로 타이포부터 컴포넌트들까지 나눠서 관리가 되고 있는지도 궁금합니다!

    볼드 UX
    볼드 UX
    볼드 UX
    2024-05-01336873

    감사합니다. 본 강의에서는 OS별로 다른 디자인 컴포넌트를 다루지 않습니다. 강의의 주 내용은 웹과 모바일에서 공통적으로 사용되는 33개의 디자인 컴포넌트를 하나씩 만들어보는 과정입니다. 이를 통해 컴포넌트의 구성, 프로퍼티, 값을 이해하는 데 도움이 됩니다. 이 과정을 통해 두 가지 중요한 결과를 얻을 수 있습니다: 1. Material UI, Apple HIG, Microsoft Fluent와 같은 UI 키트를 분석할 때 각 구성 요소를 이해하고, 필요에 따라 적절히 활용할 수 있는 능력을 갖추게 됩니다. 2. 어떤 컴포넌트라도 스스로 구성하고 만들 수 있는 지식과 기술을 습득하게 됩니다. 타이포그래피와 같은 파운데이션의 경우 이번에 새로운 베리어블이 업데이트되어서 따로 관리하실 필요가 없구요. 보통 컴포넌트의 경우 OS 별로 따로 만듭니다.(소규모 서비스의 경우는 다 같은 파일 안에 페이지 별로 따로 넣어두는 편입니다.) - 공용 컴포넌트: 버튼, 알림 등등 - 개별 OS별 UI Kit: 네비게이션 바 등등 강의 수강 전 결정하시는데, 도움이 되셨으면 좋겠습니다. 감사합니다

채널톡 아이콘