다른 파일에서 피그마 토큰 사용 문의드립니다

Question

안녕하세요 선생님 한가지 더 문의사항이 있어 질문 드립니다. 디자인 시스템 파일과 디자인 UI 파일을 각각 다른 파일에서 만들었는데요 그래서 디자인 UI 파일을 만들 때 디자인 시스템 라이브러리를 불러와서 사용했습니다 그런데 문제가 디자인 시스템 라이브러리에서 컴포넌트에 색상 토큰값이 매겨진 채로 다른 파일에서 에셋 인스턴스로 불러오게 될 경우, 다른 파일에서 피그마 토큰 플러그인으로 각각 라이트. 다크 모드를 적용하면 인스턴스로 불러 온 요소들은 연동이 안된다는 점 입니다. 결국 다른 파일에서 피그마 토큰 플러그인 실행 후 디자인 시스템쪽에 적용했던 json코드를 불러 온 다음, 이를 Create stylees해서 local에 불러와 일일히 적용 -> 인스턴스로 불러 온 컴포넌트들도 또 다시 색상 값을 매겨야됨 이런식으로 두번씩 작업해야 되는게 맞는건가요? 애초에 디자인 시스템 파일과 디자인 파일을 각각 나누면 안되는건지 연동되게 할 방법이 없는건지 문의드립니다. 확인 부탁드립니다. 감사합니다.

범쌤 · Answer

안녕하세요 OH 님 😀   오프라인 강의가 많아 답변이 늦어진점 죄송합니다 🥹 피그마 자체의 라이브러리를 사용해 토큰들을 불러와 연동하여 다른 파일들과 사용해야 하는 경우는 피그마의 유료 버전을 사용해야 라이브러리간 토큰이 연동되어 사용할 수 있습니다.   무료 버전에서는 토큰을 json파일로 관리하여 일일이 내보내서 사용해 주셔야 합니다 ㅠㅠ   감사합니다 :)

인프런 AI 인턴 · Answer

안녕하세요, 인프런 AI 인턴입니다. OH님, 피그마에서 디자인 시스템 파일과 UI 디자인 파일을 연동하여 작업하는 과정에서 발생하는 문제에 대해 질문해주셨군요. 피그마에서 토큰을 사용하여 컴포넌트의 스타일 값을 관리할 때, 토큰 값이 다른 파일로 잘 연동되지 않는 문제는 종종 발생할 수 있습니다. 피그마 토큰 플러그인을 사용하여 라이트 모드와 다크 모드를 적용할 때, 각각의 파일에서 토큰을 관리하는 방법에 따라 연동 방법이 달라질 수 있습니다. 피그마에서는 컴포넌트 라이브러리를 통해 디자인 시스템을 다른 디자인 파일과 연결하는 기능을 제공하며, 이를 통해 컴포넌트의 인스턴스를 다른 파일에서 불러와 사용할 수 있습니다. 그러나 피그마 토큰 플러그인이 제공하는 기능을 다른 파일과 연동하기 위해서는 기본적으로 지원되는 라이브러리 기능 외에 추가 작업이 필요할 수 있습니다. JSON 코드를 기반으로 하는 피그마 토큰 플러그인의 특성상, 플러그인을 실행 후 스타일을 생성하고 적용하는 과정은 디자인 파일 간에 재사용성과 일관성을 유지하기 위해 필요한 작업일 수 있습니다. 이런 경우에는 파일 간 스타일의 일관성을 유지하면서 작업 효율성을 높이기 위한 방법을 고민해보셔야 할 것입니다. 아쉽게도 특정한 해결책을 바로 제시해드리기는 어렵지만, 강의 내에서 직접 문의하기 기능을 활용하거나 관련 커뮤니티, FAQ, 혹은 피그마 관련 포럼에서 추가적인 도움을 얻는 방법을 추천드립니다. 특히, 강의 관련 문의는 해당 강의 페이지 내의 문의하기 기능을 통해 질문을 남겨보시면 도움을 받으실 수 있습니다. 피그마와 관련하여 더 자세한 정보가 필요하시다면, 인프런 홈페이지의 FAQ 섹션( https://www.inflearn.com/faq)을 방문하시거나, 강의 페이지 내에서 문의하기 기능을 활용해보시길 권장드립니다. 도움이 될 수 있기를 바라며, 추가적인 궁금증이 있으시면 언제든 문의해 주세요. 감사합니다.