안녕하세요 선생님 타이포 그라피 단락 부분 듣다가요!궁금증이 생겼습니다.네임부분은 첫글자를 소문자로 사용하시고 폰트 웨이트 부분은 대문자로 시작하셨는데요 입력할때 대소문자 규칙 같은것이 있는 걸까요? (상관없나요 보통?)나중에 실무에서는 저런 네이밍 규칙은 보통 어떻게 진행되는지 궁금하여 질문 드립니다.! :)

프리텐다드 폰트 사용관련프리탠다드 홈페이지에서 다운받고 보니 다운로드가 두가지 버전이있습니다!Pretendard와 Pretendard variavle. 인데 디자이너는 어떤걸 쓰는게 좋은가요! 그리고 왜 두개로 나눠지는지 혹시 아신다면 궁금합니다!. 개인적으로 범쌤님이 자주쓰는 폰트가 궁금합니다! (프리탠다드, 슈트 등) 3가지 정도 알려주실수 있으신가요! 강의 타이포 편에 서 "heading" "label" "paragraph" 이렇게 쓰시는걸 봤습니다. 짧은 저의 지식으로는 사이즈는 다 같은데 굶기만 다른걸로 이렇게 이름을 나누시는건지 궁금하고, heading은 제목이라고 해석이 되는데 label과 "paragraph가 좀 와닿지가 않았습니다!. 현업에서도 이렇게 사용되는지 궁금합니다..! (저는 그간 참고한게 title, subtitle, body) 였습니다!.  피그마 토큰 깃허브로 핸드아웃 따라중이였는데 이제는 pro로 유료버전이 되야! 가능한가 봅니다. 2023년 피그마 업데이트에 보니까 피그마도 토큰같은 기능을 variavles이름으로 낸다고 하는데 :-)..새로운 레슨 찍어주실 생각은 없으신가요...! 다른 강의도 들어봤지만 범쌤이 짱이에요...거기다가 질문 답변도 주시고 흑흑 텍마이머니..(지갑을 흔든다)  혹시 디자인 시스템 가이드 참고하시는것 있으신가요? 저는 컬러네임 정하는게 정말 어려웠는데 범쌤 덕분에 시스템 컬러와 악센트 등 잘 참고 하고 있습니다.  항상 감사드립니다!

안녕하세요, 강의 실습 중 안되는 부분이 있어 문의 드립니다.타이포그래피 02 강의에서 Font size Default 값을 16에서 14로 변경하면 네이티브 시스템에 있는 스타일 값들과 적용해둔 텍스트 들의 사이즈들이 바뀌지 않습니다.토큰에서 설정 하나만으로 한번에 일괄 적용 할 수 있어서 이렇게 설정하는건데왜 네이티브 시스템으로 적용이 되지 않는지 모르겠습니다.토큰 내에서는 각 사이즈 별로 크기 변경됩니다.혹시 pro 버전이 아니라서 그런걸까요.. 

안녕하세요 자료다운받기 버튼 눌렀는데 png 한장 나오는데 원래 자료는 없는건가요? 인프런 사이트 문제인건지 자료 첨부가 원래 없는 강의인지 문의드립니다

안녕하세요! 강의를 보면서 토큰 등록을 적용해보고 있습니다. 궁금한것이 생겨 질문드려요. font size 등록할 때, {base} * {sizing} 처럼 가변으로 등록하지 않고 14px, 16px, 20px.. 처럼 각각 등록을 해도 괜찮은것인지 궁금합니다. 설명주신 부분은 추후 텍스트 사이즈 변경시 효율적으로 처리하기 위해 base 값과 sizing 의 값을 지정하고, 계산식을 통해 사용하도록 설명주신것으로 이해 하였는데요.만약 텍스트 변동이 잘 일어나지 않는다고 가정한다면, px 고정값으로 각각 등록해도 무리가 없을것일까요? 감사합니다!

보다 궁금한 부분이 있어 질문남깁니다!오토레이아웃을 잡고 그 사이 또는 양쪽여백등에 간격을 줄때네이티브시스템에서 숫자를 기입하는 경우도 있고피그마토큰에 저장한걸 사용하기도 하던데, 이럴 경우 나중에 전체적으로 간격을 수정할때baseSpacing 을 수정하면 피그마토큰으로 사용한것들은자동으로 변경되어 수정될테고네이티브 시스템에서 기입한경우에는 수정이 안되지 않을까요? 네이티브 시스템에서도 그냥 기입하는 이유는 무엇일까요?

다른분이 연결해제 관련 질문을 올리긴 하셨는데 json 파일을 따로 안올리셔서 같이 첨부드립니다 ㅠ.ㅠ 왜 연결해제와 같은 표시가 뜨는 걸까요..?json 입니다.{ "140": { "value": "140%", "type": "lineHeights" }, "150": { "value": "150%", "type": "lineHeights" }, "160": { "value": "160%", "type": "lineHeights" }, "spacing": { "6": { "value": "{spacing.baseSpacing} *1.5", "type": "spacing" }, "8": { "value": "{spacing.baseSpacing} *2", "type": "spacing" }, "10": { "value": "{spacing.baseSpacing} *2.5", "type": "spacing" }, "12": { "value": "{spacing.8} + {spacing.baseSpacing}", "type": "spacing" }, "16": { "value": "{spacing.12} + {spacing.baseSpacing}", "type": "spacing" }, "20": { "value": "{spacing.16} + {spacing.baseSpacing}", "type": "spacing" }, "24": { "value": "{spacing.20} + {spacing.baseSpacing}", "type": "spacing" }, "28": { "value": "{spacing.24} + {spacing.baseSpacing}", "type": "spacing" }, "32": { "value": "{spacing.28} + {spacing.baseSpacing}", "type": "spacing" }, "36": { "value": "{spacing.32} + {spacing.baseSpacing}", "type": "spacing" }, "40": { "value": "{spacing.36} + {spacing.baseSpacing}", "type": "spacing" }, "44": { "value": "{spacing.40} + {spacing.baseSpacing}", "type": "spacing" }, "48": { "value": "{spacing.44} + {spacing.baseSpacing}", "type": "spacing" }, "52": { "value": "{spacing.48} + {spacing.baseSpacing}", "type": "spacing" }, "56": { "value": "{spacing.52} + {spacing.baseSpacing}", "type": "spacing" }, "60": { "value": "{spacing.56} + {spacing.baseSpacing}", "type": "spacing" }, "64": { "value": "{spacing.60} + {spacing.baseSpacing}", "type": "spacing" }, "baseSpacing": { "value": "4", "type": "spacing" } }, "black": { "value": "#000000", "type": "color" }, "white": { "value": "#ffffff", "type": "color" }, "blue": { "100": { "value": "#d4e2fc", "type": "color" }, "200": { "value": "#a9c5f9", "type": "color" }, "300": { "value": "#7da8f7", "type": "color" }, "400": { "value": "#528bf4", "type": "color" }, "500": { "value": "#276ef1", "type": "color" }, "600": { "value": "#1f58c1", "type": "color" }, "700": { "value": "#174291", "type": "color" }, "800": { "value": "#102c60", "type": "color" }, "900": { "value": "#081630", "type": "color" } }, "red": { "100": { "value": "#f9d1cc", "type": "color" }, "200": { "value": "#f3a399", "type": "color" }, "300": { "value": "#ed7566", "type": "color" }, "400": { "value": "#e74733", "type": "color" }, "500": { "value": "#e11900", "type": "color" }, "600": { "value": "#b41400", "type": "color" }, "700": { "value": "#870f00", "type": "color" }, "800": { "value": "#5a0a00", "type": "color" }, "900": { "value": "#2d0500", "type": "color" } }, "yellow": { "100": { "value": "#fff2d9", "type": "color" }, "200": { "value": "#ffe6b4", "type": "color" }, "300": { "value": "#ffd98e", "type": "color" }, "400": { "value": "#ffcd69", "type": "color" }, "500": { "value": "#ffc043", "type": "color" }, "600": { "value": "#cc9a36", "type": "color" }, "700": { "value": "#997328", "type": "color" }, "800": { "value": "#664d1b", "type": "color" }, "900": { "value": "#33260d", "type": "color" } }, "green": { "100": { "value": "#cde7da", "type": "color" }, "200": { "value": "#9bcfb6", "type": "color" }, "300": { "value": "#68b891", "type": "color" }, "400": { "value": "#36a06d", "type": "color" }, "500": { "value": "#048848", "type": "color" }, "600": { "value": "#036d3a", "type": "color" }, "700": { "value": "#02522b", "type": "color" }, "800": { "value": "#02361d", "type": "color" }, "900": { "value": "#011b0e", "type": "color" } }, "accent": { "value": "{blue.500}", "type": "color" }, "negative": { "value": "{red.500}", "type": "color" }, "warning": { "value": "{yellow.500}", "type": "color" }, "positive": { "value": "{green.500}", "type": "color" }, "gray": { "100": { "value": "#e1e1e1", "type": "color" }, "200": { "value": "#c4c4c4", "type": "color" }, "300": { "value": "#a6a6a6", "type": "color" }, "400": { "value": "#898989", "type": "color" }, "500": { "value": "#6b6b6b", "type": "color" }, "600": { "value": "#565656", "type": "color" }, "700": { "value": "#404040", "type": "color" }, "800": { "value": "#2b2b2b", "type": "color" }, "900": { "value": "#151515", "type": "color" } }, "positiveTransparent": { "value": "#0488481a", "type": "color" }, "negativeTransparent": { "value": "#e119001a", "type": "color" }, "scale": { "value": "1.333", "type": "sizing" }, "default": { "value": "16", "type": "fontSizes" }, "heading": { "S": { "value": "{default} / {scale}", "type": "fontSizes" }, "M": { "value": "{default}", "type": "fontSizes" }, "L": { "value": "{heading.M} * {scale}", "type": "fontSizes" }, "XL": { "value": "{heading.L} * {scale}", "type": "fontSizes" }, "XXL": { "value": "{heading.XL} * {scale}", "type": "fontSizes" }, "XXXL": { "value": "{heading.XXL} * {scale}", "type": "fontSizes" } }, "label": { "S": { "value": "{default} / {scale}", "type": "fontSizes" }, "M": { "value": "{default}", "type": "fontSizes" }, "L": { "value": "{heading.M} * {scale}", "type": "fontSizes" }, "XL": { "value": "{heading.L} * {scale}", "type": "fontSizes" }, "XXL": { "value": "{heading.XL} * {scale}", "type": "fontSizes" } }, "paragraph": { "S": { "value": "{default} / {scale}", "type": "fontSizes" }, "M": { "value": "{default}", "type": "fontSizes" }, "L": { "value": "{heading.M} * {scale}", "type": "fontSizes" }, "XL": { "value": "{heading.L} * {scale}", "type": "fontSizes" } }, "pretendard": { "value": "Pretendard", "type": "fontFamilies" }, "bold": { "value": "Bold", "type": "fontWeights" }, "semibold": { "value": "SemiBold", "type": "fontWeights" }, "\bregular": { "value": "Regular", "type": "fontWeights" }, "Heading": { "XXXL": { "value": { "fontFamily": "{pretendard}", "fontWeight": "{bold}", "lineHeight": "{140}", "fontSize": "{heading.XXXL}", "letterSpacing": "{letterSpacing.0}", "paragraphSpacing": "{paragraphSpacing.0}", "paragraphIndent": "{paragraphIndent.0}", "textCase": "{textCase.none}", "textDecoration": "{textDecoration.none}" }, "type": "typography" }, "XXL": { "value": { "fontFamily": "{pretendard}", "fontWeight": "{bold}", "lineHeight": "{140}", "fontSize": "{heading.XXL}", "letterSpacing": "{letterSpacing.0}", "paragraphSpacing": "{paragraphSpacing.0}", "paragraphIndent": "{paragraphIndent.0}", "textCase": "{textCase.none}", "textDecoration": "{textDecoration.none}" }, "type": "typography" } } }추가로 import 할 때 이런 표시도 뜹니다.

안녕하세요! spacing 관련 토큰 만들어보다가 궁금한 점이 생겨서 질문드립니다. 예제처럼 baseSpaing이 4이며, 4의 배수로 커지는 토큰에서 6이나 10 정도의 spacing 값이 필요하게 되면,{baseSpaing}*1.5 = 6 {baseSpaing}*2.5 = 10이런식으로 만들어도 써도 괜찮은걸까요..?뭔가 4의 배수의 규칙에 어긋나는 느낌인 거 같아서 질문드려봅니다..ㅠ.ㅠ아니면 애초에 baseSpaing 값을 2로 두고 진행하는 게 나은 방안인지 여쭈어 봅니다!

안녕하세요, 피그마 토큰을 활용하려고 설명해주신대로 따라했는데 왜 저는 명령어 팔레트에서 보이지도 않고,커뮤니티에 가서 토큰을 검색해도저 상단을 클릭하면 아래와 같은 창이 나올까요?

안녕하세요! 디자인 시스템을 구축하고 사용하는 과정에서 생각지 못한 오류가 있어 질문 드립니다:) 현재 실무에서 디자인 시스템을 구축하면서 컴포넌트를 생성하고 properties를 설정한 후에이 컴포넌트를 피그마 새로운 디자인 파일을 생성하여 가져다 쓰는 경우가 많습니다. 이때에 원본 컴포넌트를 수정하는 경우에 가져다 쓴 복제된 컴포넌트도 같이 수정되어 연동되는 것으로 알고 사용하고 있었는데 연동이 되지 않는 경우가 있더라구요. 디자인 시스템을 만드는 이유가 원본 컴포넌트를 수정하면 복제된 컴포넌트들도 같이 연동되어 반영시키기 위해 사용하는 장점이 크다고 생각하는데요. 같은 디자인 파일에서 다른 페이지에 가져온 컴포넌트는 연동되는데 아예 다른 파일 페이지에 가져오면 연동되지 않아서 이동된 복제된 컴포넌트를 다시 한번 컴포넌트를 생성해주어 해당 페이지에서 원본 컴포넌트와 추가로 복제된 컴포넌트를 사용해야 하는 상황이 되었습니다. 선생님도 이렇게 사용하는 경우가 있으신지 궁금합니다! 😅

게시판에 이미 유사한 질문이 있지만 선생님 답변을 참고하고도 해결되지 않아서 질문 드려요!저도 Uppercase로 전환하는 선택지가 뜨지 않습니다ㅠㅠ 버전을 확인했는데도 이미 최신버전이라고 떠요!혹시나해서 재설치했는데도 잘 해결되지 않습니다해결할 수 있는 방법이 있을까요?

안녕하세요. 우선 유익한 강의 감사드립니다!강의를 보다가 아무리 보아도 제가 보는 화면과 다른 것 같아서 질문 올립니다. 이렇게 컴포넌트를 만들고 프로퍼티 기능을 추가할 때 + 버튼을 누르면 나오는 메뉴가 강사님께서 보여주시는 화면에는 Variant 아래에 Boolean, instance swap, text 가 다른 목록으로 분류되어 나오는데요. 제가 작업할 때 화면은 위와 같이 Variant, Boolean, instance swap, text가 나오는데 어떻게 해야 강사님이 작업하신 화면처럼 나오는건가요??그리고 아래에 Nested instances 라는 기능은 어떤 경우에 쓰는건지 궁금합니다!

안녕하세요 선생님! 강의 너무 유익하고 잘 시청하고 있습니다.궁금한게 있습니다. 타이포 강의를 듣던 중에,1.333배를 입력해서 전체 가이드를 가지고 기준이 되는 "디폴트"값을 정해놓고. 디폴트 값만 변경해도 다 맞춰서 변경되니까 이런 좋은 점은 알겠는데폰트가 12가 티폴트이면 +2pt 만큼 늘어난다 이런거는 안되나요?배수로 정해 놓으면 소수점으로 끝나는데 디자이너한테 이런 부분이 생소해서요!!! {디폴트}+2pt = xl 이런식은 불가능한건지 궁금합니다.그리고 소수점이 문제가 안되는지 궁금합니다(보통 다 디자이너는 1px 이 최소단위니까 궁금해요!_

플레이스 홀더 영역을 만들고 아래에 힌트텍스트가 하나있을 때는 오토레이아웃과 불린 기능을 이용해서 힌트 텍스트가 제거되었을 때 플레이스홀더 영역만큼만 보여지게 할 수 있는데힌트텍스트 우측에 텍스트 카운터가 있을 경우(헬프 텍스트가 2가지인 경우) 어떻게 짜야 하나씩 껐을 때 한쪽으로 치우치지 않고 제거했을 때 해당 영역이 사라지고 플레이스 홀더 영역만큼만 잡히게 하는지 모르겠습니다..

안녕하세요! 사내에 두 개의 프로덕트가 있는데 그럼 디자인시스템을 각각 프로덕트마다 따로 만들어야 하는걸까요?그리고 새로 생기는 프로덕트마다 계속 만들어서 각각 관리하는것인지 궁금합니다.만약 하나의 디자인시스템으로 관리한다고하면 각 프로덕트마다 버튼크기나 사용하는 컴포넌트들도 다를거고 색상도 다를텐데 어떻게 관리해야할까요?  감사합니다!

안녕하세요?글로벌에 타이포그래피 토큰을 만들면 다크모드, 라이트모드 테마쪽에는 굳이 안만들어도 상관이 없는건가요?글로벌에 등록된 토큰은 모든 테마에 전반적으로 적용이되는건가요??그리고 토큰스튜디오 프로를 사용했을때의 큰 메리트가 있을까요? 감사합니다!

안녕하세요. 강의 자료는 어디서 받을 수 있을까요?

안녕하세요.강의를 듣던 중 궁금한 점이 생겨서 질문 드립니다.색상이나 스페이싱 등 다양한 스타일을 미리 지정해 두는데, 피그마 토큰에 등록 해두었으나, 디자인 작업이 끝날때까지 단 한번도 사용하지 않는 스타일값도 있더라구요.예를 들어 blue색상을 등록할 경우 총 9가지의 단계로 (blue 100 - blue 900) 지정하는데, blue 400은 사용되지 않는 그런 상황이 발생하더라구요. 물론 9단계든 5단계든 정해진 법칙이 있는건 아니지만, 이렇게 다양한 색상을 미리 지정해 두는 이유가 궁금합니다. 답변 부탁드립니다 !ㅎㅎ (강의 너무 유익하게 잘 듣고 있어용!!)

범쌤님 질문 답변 정말 감사합니다. 궁금했던 속이 뻥 뚫리네요.ㅜㅜ추가질문1. 프론트 개발자 입장에서 필요한 최대 단위 토큰은 어느정도일까요?전역에서 베이스단위 토큰으로 관리되는것만으로도(큰단위 필요 없이) 개발에 매우 용이한것이라는거죠? 개발자가 아니여서 어느정도 매력적인지가 감이 안와서 여쭤봅니다. (현재 '토큰'으로 개발되어있지 않음)사실 디자인 관리측면에서는 아무리 못해도 원자단위 까진(버튼,인풋) 만들어서 개발연동해두고 싶어서요.생각의 차이인듯해서 어느정도가 서로가 생각하는 필요선의 합의점일지가 궁금합니다.추가질문2. 버튼 토큰은 무료버전에서 만들수없을까요?테스트 단계라 아원자보다 더 큰 단위의 토큰까지 테스트 해보고싶습니다.그리고 유료버전 강의는 생각하고 있지 않으신걸까요?

안녕하세요. 강의를 통해 토큰스튜디오를 배우고 다크모드/라이트모드에 각 시멘틱컬러를 적용해놓았는데요,피그마 업데이트로 생긴 로컬베리어블기능에도 같은 기능이 있어서.. 혹시 피그마 로컬베리어블 기능으로 만들어놓은 각 모드별 스페이싱, 컬러, 스트링등 토큰들을 그대로 토큰스튜디오 플러그인으로 옮길 수 있을까요? 피그마 로컬 스타일로 저장해놓은 컬러와 텍스트들은 임폴트 기능을 통해서 global로 불러오는건 되는데 라이트모드 / 다크모드에 토큰이 자동으로 옮겨지진않네요 ㅠ 사내 디자인시스템을 구축하려하는데 어떤걸 써야할지, 둘 다 사용해야하는건지 고민입니다.