묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
브랜치 지정 사용시 개발 버전관리 문의
피그마 베리어블 강의 잘 듣고 현재 개발자와 회사 디자인 시스템 가이드 구축중입니다. 피그마에서 브런치 기능이 있는데요.. 브런치 기능과 깃업을 연결해서 버전 관리 하는 방법이 있는지 문의 드리고.혹시 그런 기능이 없다면, 개발 버전 관리를 어떤식으로 피그마에서 사용하는지 강의나 문서 볼 수 있는 곳이 있을까요? ㅜㅜ 개발자들이 문의를 하는데 암것도 모르겠네요ㅜㅜ
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
웹표준 컬러 체크 질문
안녕하세요. 웹 표준 컬러에 대해 질문드립니다.혹시 피그마에서 화면단위로 컬러 대비 점수를 확인 할 수 있는 방법이 있을까요?최소 AA 이상이 나와야한다고 하는데, 컬러 잡을 때 고려하지 못해서..이와 관련해서 컬러 시스템 구축때 어떻게 구축을 하고, 만약 고려하지 못했을 때 보완하는 방법은 어떤게 있을까요..?
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
완강 이벤트 관련 질문!
완강 이벤트는 기간 혹은 기한이 있나요?
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
textfield에 맞는 font size 정의
안녕하세요, 볼드 멘토님 🙂 강의를 들으며 현재 버튼과 텍스트필드를 구축해보는 중에 궁금사항이 생겨 질문드리게 되었습니다. 해상도마다 텍스트필드 사이즈에 따라 placeholder나 label 등의 폰트 사이즈가 다르게 구성되도록 구축해야하는지 궁금합니다.이런 식으로 텍스트필드 위 아래에 들어갈 요소들을 사이즈별로 구축을 해야할 필요성이 있는건지 적응형, 반응형에 따라 달라지는건지 궁금합니다. meterial design system은 버튼이나 텍스트필드가 하나로 정해져서 나오는것 같은데 figma design system은 버튼 사이즈마다 안 텍스트 크기가 다 다르게 구축이 되어있어서 서비스마다의 차이인건지 궁금합니다!ㅠㅜ감사합니다-!
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
질문이 있습니다!(공유해 주신 자료)
안녕하세요 볼드님.강의를 듣다가 궁금한 부분이 있어 질문 남깁니다.공유해 주신 자료중 컴포넌트 프로퍼티 워크시트 와 베리어블 시트 차이가 뭔지 잘 모르겠습니다!현재 출시된 제품내 컴포넌트들을 나누고 있는데 어떤시트를 활용 하는게 좋을까요?정확히는 컴포넌트 프로퍼티 워크시트의Working Status/Accessibility/Documentation 부분이 어떤것에 대한 내용인지 잘 이해가 안갑니다.
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
Local Variable 등록
안녕하세요 강사님local variables에 여러개의 생삭을 한번에 등록 하는 방법으로 색상표를 만들고 낱개별로 하나씩 이름을 지정해준 다음 Stlyer플러그인으로 스타일 등록 후 Styles to Variables로 등록해주는 순서로 해보았는데 혹시 한번에 더 많은 색상을 최종적으로 local variables 에 등록 할수있는 방법이 있을까요?
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
디자인 시스템을 만드는 중 버튼 관련 질문이 있습니다.
만드려고 하는 방식은 Leading/Trailing Icon property를 넣어 껐다 켰다 하고 싶습니다. 동시에 버튼에 boolean variable을 넣어 skeleton모드를 껐다 켰다 하려고 합니다.만든 컴포넌트는 다음과 같은 형태로, row는 버튼, skeleton에는 스켈레톤 컬러를 입혀놓은 상태입니다.여기서 Icon 프로퍼티를 껐을 때 다음과 같이 아이콘 영역만큼 줄어드는 것이 아니라 왼쪽으로 밀리기만 하는데, 해결 방법이 있을까요? 더불어 버튼의 width 값도 자유롭게 늘렸다 줄였다 하고싶은데, 컴포넌트 프레임만 조절되며 안의 버튼은 fix된 상태입니다ㅠㅠ
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
섹션4
섹션 410강 / 1시간 59분입력(Input) 컴포넌트 만들어보기처음 시작 때 에쎗으로 만들어논게 없는데 어느 강의부터 참고해서 이어지는 내용인가요 bold plus 에도 아이콘은 없고 그러다보니 버튼 컴포넌트 강의 중 하트 아이콘 인스턴스 선택지가 없습니다.
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
컨포넌트의 파일 간 이동
(상황) 현재 강의 별로 파일을 만들어 수업 한 내용을 페이지에 정리했습니다.(질문)*실무 경험이 없어 이런 질문을 남기게 된 점 양해부탁드립니다.파일을 관리할 때, 지금처럼 주제 별 (네비게이션, 피드백 등)로 파일을 만드는 게 좋은지 아니면 한 파일에 모든 컨포넌트를 넣어놓는 게 좋은지 궁금합니다.각 파일별로 분산 된 컨포넌트를 한 곳에 모을 때, 제가 발견한 방법은 '해당 컨포넌트 잘라내기 - 붙여넣기'입니다. 혹시 좀 더 효율적인 방법이 있을까요?항상 감사드립니다.
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
29일 마감인 인증샷 스터디는 어떻게 신청하나요?
기 수강생도 참여가 가능한가요?강의 소개 페이지에 스터디 프로그램이 있는 것 같아신청란을 찾아보려는데 혹시 신규 수강생에 한해서 진행되는 스터디인지 궁금합니다.
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
[컬러] https://swatchy.twosix.studio/
안녕하세요^^우선 좋은 강의 준비해주셔서 감사합니다.잘 들고 있어요.궁금한점은요.https://swatchy.twosix.studio/에서 베이스 색상입력하면 제가 입력한 컬러가 (브랜드컬러여서)400,500,600 중에 하나로 들어오고 나머지가 구성될줄 알았는데요.피그마에서 .json파일 불러들오오니까 base 가 따로 존재해버려서요.제가 원하는 컬러의 색 변화가 아닌듯합니다.어떻게 된건지 궁금합니다. (제가 이해 잘못하고 있을 수 있습니다.)그리고 컬러 톤 50~ 900 사이를 생성하는 자동 프로그램이다른 플러그인이나, 사이트 추천 부탁드리겠습니다.감사합니다. 우선 강의를 들어주셔서 감사합니다. 강의 들으시면서 궁금하신 부분을 남겨주세요. 회사 일 관계로 빠른 답변이 어려울 수 있으며, 최대 3일 이내에 답변드리도록 하겠습니다. 이해를 돕기 위해서 스크린샷 이미지, 피그마 파일 링크를 반드시 첨부해주세요. 마지막으로 먼저 유사한 질문이 있는지 한번 찾아보시는 걸 권장 드립니다. 인프런 서비스 운영 관련해서는 1:1 문의하기로 인프런 쪽으로 연락 주시기 바랍니다.
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
아이콘 컬러 배리어블 적용이 안되어 질문 드려요!
선생님 안녕하세요!버튼 컴포넌트 제작 강의를 보며 따라서 만들고 있는데요~아이콘 fill에 배리어블을 적용해도 아이콘 색상이 변하지 않는 문제가 있습니다~color/icon/interactive/inverse 색상을 선택해도 적용이 안되며, 다른 배리어블 색상을 적용해도 동일하게 적용이 안됩니다! 이름만 적용되고 색상은 변경이 안되는 상태입니다 ㅠㅠ(feather icon을 shape 면으로 병합한 형태로 정리하였고, Vector로 동일하게 이름도 적용했습니다. 아이콘 컬러 배리어블 색상도 등록한 상태입니다.아이콘을 면으로 정리할 때 유니온과 아웃라인이 안되는 경우, 커뮤니티에 공유해주신 Convert SVG Strokes to Fills 웹 사이트를 이용했습니다! )feather icon 외에 다른 아이콘 컴포넌트로 테스트 해보니 배리어블 색상이 적용됩니다.해결 방법이 있을까요?
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
베리어블 활용에 질문이 있습니다 :)
안녕하세요, 선생님!본격적으로 베리어블을 활용/운영하다보니 궁금한점이 있어 글 남겼습니다.1.semantic으로 지정되지않은 컬러 활용?Primitive의 color-100/200/300 이런 베리어블들은 사용을 지양해야하나요~?Primitive는 시멘틱처럼 용도가 따로 지정되어잇지않아 다른 디자이너들이 보면 어떤 때 200,300을 써야하는지 헷갈릴것같은데 어떻게 해야할까요? 예를들어 미세하게 컬러를 조정할떄가 생기는데 그때마다 시멘틱의 text,bg,border,icon을 각각 1컬러당 4세트씩 작업해줘야하는 점이 번거로울것 같기도한데, 그러자니 primitive를 바로쓰면 용도에 대해 적혀있지않은 네이밍이라 헷갈릴 것 같습니다.조언 주실 부분 있으실까요? 2.텍스트나 도형을 생성하고 컬러칩 라이브러리를 열면라이브러리 상단에 semntic이 우선으로 뜨지 않고 primitive가 먼저 뜨게 되는데 상단에 우선으로 뜨게 하는 방법이있을까요?
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
프레임을 씌울 때
종종 그룹을 먼저 씌운 후, 오토레이아웃을 설정하시던데특별한 이유가 있는지 궁금합니다!
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
darkmode에 기존 gray50~900을 사용하지 않으려면
Primitive에 다른 gray팔레트를 만들어줘야 하나요?이때 네이밍은 어떻게 지정하면 좋을지 궁금해요.. 우선 강의를 들어주셔서 감사합니다. 강의 들으시면서 궁금하신 부분을 남겨주세요. 회사 일 관계로 빠른 답변이 어려울 수 있으며, 최대 3일 이내에 답변드리도록 하겠습니다. 이해를 돕기 위해서 스크린샷 이미지, 피그마 파일 링크를 반드시 첨부해주세요. 마지막으로 먼저 유사한 질문이 있는지 한번 찾아보시는 걸 권장 드립니다. 인프런 서비스 운영 관련해서는 1:1 문의하기로 인프런 쪽으로 연락 주시기 바랍니다.
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
Color Style Guide 플러그인
Color Style Guide 플러그인이 그레이만 제공 되는 것 같아요.혹시 플러그인을 사용하지 않고 컬러 팔레트를 만드는 방법은 없을까요?
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
보조색을 다른 hue로 사용할 경우엔 베리어블 구조를 어떻게 짜야할까요?
머테리얼 컬러 가이드처럼,프라이머리 컬러를 블루 계열로 두고 세컨더리 컬러를 틸 계열로 두고 싶은데,예제는 하나의 색상 계열로 프라이머리, 세컨더리를 나누고 있어서 베리어블 구조를 어떻게 짜야할지 잘 모르겠습니다. 테마-브랜드 컬러에 틸 계열을 추가한 뒤 시멘틱-bg-인터랙티브세컨더리에 해당 브랜드 컬러를 참조하면 되는걸까요?아니면 프리미티브 컬러에만 틸 계열을 넣어둔 뒤 시멘틱-bg-인터랙티브세컨더리 컬러에 프리미티브-틸500 을 바로 참조하면 되는걸까요?..
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
인스턴스 섹션이 보이지 않습니다.
create instance swap property를 적용하려는데, 인스턴스 섹션이 안보입니다. 어디서 찾을 수 있나요? 오른쪽 바에는 보이지 않습니다. 회사 일 관계로 빠른 답변이 어려울 수 있으며, 최대 3일 이내에 답변드리도록 하겠습니다. 이해를 돕기 위해서 스크린샷 이미지, 피그마 파일 링크를 반드시 첨부해주세요. 마지막으로 먼저 유사한 질문이 있는지 한번 찾아보시는 걸 권장 드립니다. 인프런 서비스 운영 관련해서는 1:1 문의하기로 인프런 쪽으로 연락 주시기 바랍니다.
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
Color scoping 적용이 안되어 문의드립니다!
안녕하세요! 선생님색상 배리어블 등록하기 강의를 보며 실습하는 중입니다.Color scoping 적용이 안되어 문의드립니다!첨부 이미지 처럼 text에서는 Text, bg에서는 bg 만 체크, border, icon 각각 해당 항목만 체크하였습니다!이후 텍스트를 작성하고 등록한 배리어블 컬러를 적용해보니, 체크한 Text 외에 bg, border, icon 컬러가 모두 보이는 문제가 있습니다!Text에 적용할 때는 Text 컬러만 보여야 하는데요~ 1)번 설정 시, 추가로 더 체크해야될 부분이 있는 걸까요?도움 부탁 드립니다! 1) 2) 좋은 강의 감사드립니다!!
-
해결됨피그마 배리어블을 활용한 디자인 시스템 구축하기
아이콘 관련 질문
icon/settings를 제외한 다른 아이콘은 하나의 '그룹'으로 만들어져 있습니다.하지만 settings는 그렇지 않아 색을 바꾸려고 할 때 'Border'로 인식되더라구요.두 개를 그룹화 시켜도 '아이콘'으로 변하지 않습니다. 어떻게 하면 두 개를 합쳐 '아이콘'으로 인식될 수 있게 할 수 있을까요?고맙습니다.