44,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 해결됨디자인 시스템 with 피그마
Token studio 플러그인 사용시...
안녕하세요! Token studio 플러그인 깔아서 간격 수업에서 말씀해주신 Spacing을 다 동일하게 따라 지정해 설정, 저장 해놓고 플러그인을 껐다가 키면 설정값이 다 사라지고 처음 플러그인을 실행시켰던 화면과 같이 아무것도 남아있지 않습니다..... 혹시 로그인을 해야하나 싶어서 찾아보면 GITHUB아이디가 필요한것같은데... 맞나요??
- 해결됨디자인 시스템 with 피그마
타이포그라피(Typography)가 계속 사라집니다
안녕하세요.타이포그라피를 강의대로 추가하고 Git에 Push까지 진행하였으나 token studio를 껐다 키게되면 전부 사라져있어서 질문 드립니다.한시간정도 토큰 스튜디오 사용하면서 푸시까지 하고 다 껐는데 타이포그라피만 계속 설정해주면 사라져있어서 질문드립니다.
- 해결됨디자인 시스템 with 피그마
네이비티브 시스템 활성화
새로운 파일에서Tokens Studio for Figma 플러그인으로제이슨 파일, 깃허브로 데이터값을 불러오는 것까지는 완성하였습니다. 그 이후 Create styles로 오른쪽 네이티브 시스템을 생성하려고 하는데안된다고 창이 뜹니다.
- 해결됨디자인 시스템 with 피그마
다른 곳에서도 강의 하고 계신지 궁금합니다.
다른 곳에서도 강의 하고 계신지 궁금합니다.다른 강의 하고 계시면 또 들어보고 싶어서요
- 해결됨디자인 시스템 with 피그마
Default 값을 16 에서 14로 변경했는데.
변화가 없습니다.오른쪽 네이티브 시스템과 화면에 폰트에 변화가 없습니다. Token Studio for Figma의 값들은14에 맞게 변화하였습니다.
- 해결됨디자인 시스템 with 피그마
Tailwind Color Generator가 검색이 안됩니다.
Tailwind Color Generator가 아예 검색이 되지 않네요 ㅠ어떻게 하면 좋을까요?
- 해결됨디자인 시스템 with 피그마
Import styles 질문드립니다!
안녕하세요! 섹션1 Color border 수업 중시스템에서 피그마 토큰으로 borderOpaque를 가져오는 작업에서 질문드립니다.저는 Import Styles를 누르면 토큰 전체가 아닌 부분만 뜨는데 스크롤도 움직이지 않고 더보기할 수 있는 버튼도 없어서 추가하지 못했습니다.전체보기를 할 수 있는 방법이 있다면 알려주세요 :)(light 모드만 클릭하고 color만 체크해도 노출된 항목으로 뜨지 않았고, 창 사이즈를 늘려도 뜨지 않았습니다!)
- 해결됨디자인 시스템 with 피그마
피그마 토큰 Create Style 에러
XL사이즈를 Creative style하여네이티브에 추가하려고 하면캡쳐이미지와 같은 에러가 뜹니다.도와주세요 ㅠㅠ
- 해결됨디자인 시스템 with 피그마
섹션1 Foundation 구성 - 타이포그래피 - 토큰 default 값에 따른 업데이트
저는 디자인 시스템 with 피그마 - 범쌤 강의 듣고 있습니다. 그 중 섹션1 Foundation 구성 - 타이포그래피 강좌를 듣는 중 질문이 있습니다. 현재 토큰 플러그인으로 타이포그래피 설정 후 Create styles 까지 완료하였습니다.하지만 폰트 사이즈 default 값을 변경하면 자동으로 업데이트 되지 않고 다시 Create style을 해야 적용이 됩니다.다행히 create 시 오류 알림 뜨지 않음그래서 폰트 설치 확인, 오타 확인을 해보았지만 찾지 못해서 글을 남깁니다.사진1-토큰 플러그인 파일 정보사진2-피그마에서 스타일을 가져오기를 했을 때 업데이트 사항
- 해결됨디자인 시스템 with 피그마
최고입니다.
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
- 해결됨디자인 시스템 with 피그마
파일 편집 권한
안녕하세요피그마 수업 자료 파일 편집 권한이 없어수업을 진행못하고 있습니다 ㅠㅠ권한좀 부탁드립니다
- 해결됨디자인 시스템 with 피그마
디자인 시스템 Component 만들 때
안녕하세요 디자인 시스템에서 버튼 컴포넌트를 예시로 등록할 때 같은 속성에 같은 디자인인데 크기만 달라지는 경우 이것도 일일히 디자인 시스템에서 높이 42짜리 버튼, 높이 30짜리 버튼 이런식으로 하나하나 등록을 하는지 궁금합니다.아니면 디자인 시스템에 있는 버튼을 인스턴스로 불러와서 디자인 화면에서 조정해서 써도 되는걸까요?버튼 뿐만 아니라 다른 컴포넌트도 동일하게 단순히 크기만 달라지는것도 디자인 시스템에서 크기별로 하나하나 등록해야 되는지 문의드립니다~~ 두번째 질문으로는 색상에서 컬러 토큰 명칭 지정할 때 주요하게 쓴다고 판단되는 것만 따로 (예 : 버튼 프레스, 버튼 디폴트 등...) 추려서 토큰 명칭을 새로 매기는지 아니면 디자인 화면안에 들어가는 모든 색상은 무조건 토큰 명칭으로 새로 지정을 해서 관리하는지 궁금합니다. 기존에 등록되어있는 컬러에서 새롭게 토큰 명칭으로 지정하는 부분에 대한 문의입니다 (예 : grey200 = $tertiary 식으로 새로 지정)감사합니다.
- 해결됨디자인 시스템 with 피그마
토큰 네임 작성
토큰에서 네임을 작성할때 대문자와 소문자를 번갈아가면서 쓰시던데 기준이 있나요? 소문자로시작해서 띄어쓰기 대신 대문자가 들어가는 것까진 이해가 되는데 아예 대문자로 시작하는건 어떤 경우에 이런식으로 작성하는 건가요?
- 해결됨디자인 시스템 with 피그마
반응형 문의
안녕하세요 범쌤님새해복 많이 받으세요.범쌤이 보여주신 헤더,GNB를 보다가.반응형 이론에 대해서 궁금한게 있어서 문의드립니다. 현재 저는 고정사이즈 웹을 디자인 하고 있는데요 나중에 반응형을 할거같은데 깊이 알지 않아서 겁이납니다! 그래서 범쌤님께 조언을 구하고 싶습니다. 반응형 웹에 대하여반응형 웹은 3가지 사이즈로 작업해야 한다. (핸드폰/타블렛/웹) 핸드폰 (360~743px)타블렛 (744~1024px)웹( 1025~1920px) 즉, 반응형 웹을 할때는 같은 디자인이지만, 3가지 플랫폼을 생각하여 3개로 디자인한다.(360 한개, 1024 한개, 1920 한개)ㄴ 최소크기를 기준으로 작업하고 크게 핀다. ㄴ 최소 크기로 짤리면 안되는 컨텐츠를 염두하고 작업한다 (최소크기: 360,744,1025)3개로 작업하고 개발자한테 넘기면 된다! (에셋이나 컴포넌트 사용은 공통!)여기까지가 반응형 웹 작업시, 이론으로 알고있습니다! 혹시 제가 잘못알고 있는게 있을까요 그리고 두번째 질문은 모바일은. 고정으로 작업하는걸로 알고있는데 (물론 아이폰과 안드로이드 사이즈는 다름, 기종사이즈다름) 모바일은 반응형은 없는거죠..? 궁금합니다. 질문이 많아 송구스럽습니다! 항상 감사드립니다.
- 해결됨디자인 시스템 with 피그마
디자인시스템 문의
안녕하세요 범쌤님! 저는 정말 사수가없는 직장에서 범쌤님 강의와 질문답변 읽으면서 ㅠㅠ 너무 많이 배우고 있습니다.새해복 많이 받으세요! (절) 제가 문의글을 쓴 이유는 디자인시스템을 잡다가 variant 를 할때 불편한 점이 있어서! 문의드려요.1번 질문너무 많은 버튼의 상태값이 반복되다 보니 계속....... hover 타이핑만 20번 치고있는데 제가 주로 쓰는건 EnabledHoverSelectedFoucsed 정도인데 ㅠㅠ 이걸 계속 타이핑 치다보니까 힘들어서요 혹시 범쌤님은 어떻게 하시나요?2번 질문그리고 범썜님이 자주쓰는 상태값 (hover, selected등) 알고싶습니다! 제발 알려주세요....! (내부디자이너 1명인 상황ㅠㅠ)3번 질문 오토레이아웃을 쓰면 "Fixed" "Hug" "Fill" 이 세가지 값이 있고 오토레이아웃 안에 오토레이아웃을 쓸때마다 혼란이 옵니다. 제가 아직 잘 채득을 못한거 같은데 저는 아래와 같이 이해하고 쓰고있습니다. 검토 부탁드립니다 ㅠㅠ "Fixed" - 현재 프레임 길이 값에 고정. 내부 컨텐츠가 많든 적든 현재 프레임 길이에서 벗어나지 않음."Hug" - 현재 프레임 내부에 존재하는 컨텐츠 양에 따라 프레임 길이도 변함."Fill" - 현재 프레임 내부에 존재하는 컨텐츠 양에 따라 프레임 길이도 변함. (근대 Hug와 다른이유는 프레임을 꽉채우겠다는//?) 항상 감사드립니다 범쌤님! 새해에도 좋은일만 가득하세요~~
- 해결됨디자인 시스템 with 피그마
tocken이 바로 적용 안되요
tocken용 파일을 만들고, 다른 파일에서 libraries로 불러와서 사용하고 있습니다.문제는, tocken에서 변경 사항을 올리고 다른 파일에서 update를 받아도 바로 적용이 안될때가 많아요이땐 업데이트가 안된 컴포넌트에 가서 reset all change를 해서 사용중인데 자동으로 반영이 안되는 이유가 있을까요?
- 해결됨디자인 시스템 with 피그마
다른 파일에서 피그마 토큰 사용 문의드립니다
안녕하세요 선생님한가지 더 문의사항이 있어 질문 드립니다.디자인 시스템 파일과 디자인 UI 파일을 각각 다른 파일에서 만들었는데요그래서 디자인 UI 파일을 만들 때 디자인 시스템 라이브러리를 불러와서 사용했습니다그런데 문제가 디자인 시스템 라이브러리에서 컴포넌트에 색상 토큰값이 매겨진 채로 다른 파일에서 에셋 인스턴스로 불러오게 될 경우, 다른 파일에서 피그마 토큰 플러그인으로 각각 라이트. 다크 모드를 적용하면 인스턴스로 불러 온 요소들은 연동이 안된다는 점 입니다.결국 다른 파일에서 피그마 토큰 플러그인 실행 후 디자인 시스템쪽에 적용했던 json코드를 불러 온 다음, 이를 Create stylees해서 local에 불러와 일일히 적용 -> 인스턴스로 불러 온 컴포넌트들도 또 다시 색상 값을 매겨야됨 이런식으로 두번씩 작업해야 되는게 맞는건가요?애초에 디자인 시스템 파일과 디자인 파일을 각각 나누면 안되는건지 연동되게 할 방법이 없는건지 문의드립니다.확인 부탁드립니다.감사합니다.
- 해결됨디자인 시스템 with 피그마
디자인 시스템 문의드립니다
안녕하세요 선생님글자 폰트 설정하는거랑 행간 설정하는거 문의 드립니다!기존에 다른 타 기업들의 디자인 시스템을 보면 소수점이 아닌 40px, 32px, 이런식으로 딱딱 떨어지게 되어있는데요 scale로 1.333 배수로 지정할 경우 글자 뒤에 붙는 소수점이 알아볼 수 있게 적어놨을 때 한번에 인식이 잘 되지 않는데 이로 인한 문제는 전혀 없을까요?(그리고 아래처럼 그냥 딱 떨어지게 설정해서 토큰을 발행해도 되는건지 알고 싶습니다) 그리고 또 어떤 디자인 시스템을 보면 px / 옆에 rem으로 지정하는 곳이 있고 위처럼 em으로 지정하는 곳이 있는데 각각 어떤 이유로 단위를 변환해서 기재하는건지 알고 싶습니다. 행간의 경우 선생님 강의에서는 150% 160%이런 식으로 %로 주셨는데, 그렇다면 디자인 시스템을 표기할 때 이런식으로 표기가 들어가야 하는 건지 알고 싶습니다. 그리고 마지막으로 개발자는 가공을 거쳐야 한다고 강의에서 말씀하셨는데, 그러면 회사에서 개발자가 json코드를 가공하는 방법을 모른다고 하면 강의처럼 디자인 시스템을 사용할 수 없는걸까요?답변해주시면 감사드리겠습니다.
- 해결됨디자인 시스템 with 피그마
타이포그래피 create style시 오류메세지
안녕하세요 선생님!타이포그래피 part2강의를 듣다가 궁금한 점이 있어서 글을 남깁니다.디자인 토큰에서 만든 스타일을 'create style' 할 경우에 이런 오류창이 뜹니다 ㅠㅠ 왜이런지 알 수 있을까요?
- 해결됨디자인 시스템 with 피그마
강의에 적어주신 링크가 들어가지지 않습니다.
https://bit.ly/figma_finished링크가 변경된걸까요?