인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

박소희님의 프로필 이미지

작성한 질문수

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

컴포넌트 만들기 전 라이브러리 세팅하기 ✅

컴포넌트 파일에 파운데이션 라이브러리가 연결이 안됩니다!

작성

·

57

0

말씀해주신대로, 파운데이션 파일에서 라이브러리 publish 한 후, 컴포넌트 파일에서 add to file을 했는데 베리어블과 local style에 파운데이션이 뜨지 않습니다!

제가 어떤 부분을 누락한 걸까요?

image.pngimage.png

 

답변 2

1

볼드 UX님의 프로필 이미지
볼드 UX
지식공유자

안녕하세요,

 

파운데이션의 베리어블은 컴포넌트 워크시트의 로컬 베리어블에서는 나타나지 않습니다.

파운데이션의 로컬 베리어블과 컴포넌트 워크시트 로컬 베리어블은 말 그래도 각각의 로컬(Local)에서만 만들 수 있고 볼 수 있습니다.

 

컴포넌트 워크시트에서 파운데이션 베리어블을 선택하시기 위해서는...

  1. 오브젝트(텍스트, 프레임, 아이콘, 선)의 색상을 선택하시고

  2. 라이브러리에서 파운데이션을 선택하시면

  3. 파운데이션 로컬 색상 배리어블을 확인하실 수 있습니다.

03.png

나중에 컴포넌트 워크시트 내 로컬 베리어블에서는 반응형 디자인을 할 때 디바이스마다 달라지는 베리어블 값을 넣을 계획입니다.

 

감사합니다

.

0

인프런 AI 인턴님의 프로필 이미지

안녕하세요, 인프런 AI 인턴입니다. 박소희님!

컴포넌트 파일에 파운데이션 라이브러리가 연결되지 않는 문제에 대해 도움을 드리겠습니다. 이러한 상황에서 확인할 주요 사항은 다음과 같습니다.

  1. 라이브러리 활성화 확인: 라이브러리가 올바르게 활성화되어 있는지 피그마의 Assets 패널에서 확인해 보세요. Manage libraries 메뉴로 들어가서 해당 라이브러리가 제대로 활성화되어 있는지 체크해 보시기 바랍니다.

  2. 동기화 상태 확인: 피그마는 인터넷을 기반으로 작동하므로, 네트워크 연결 상태가 안정적인지 확인해 주세요. 때로는 연결 문제로 인해 동기화가 되지 않아 라이브러리가 나타나지 않을 수 있습니다.

  3. 프로젝트 설정 확인: Add to file이 잘못된 위치에서 진행되었을 수 있습니다. 프로젝트 설정에서 올바른 파일에서 실행되었는지 확인하세요.

  4. 피그마 재시작 및 업데이트: 피그마 클라이언트를 재시작하거나, 필요시 업데이트를 통해 버그나 글리치가 해결될 수 있습니다.

유사한 주제에서 도움될 수 있는 링크를 추천해 드립니다:

첨부된 이미지와 같이 “Manage libraries”에서 라이브러리가 표시되더라도 정상적으로 기능하지 않는다면 기본적인 오류탐지 과정(위의 단계)을 통해 문제를 찾아내고 해결하실 수 있습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.