글

라벨이 피그마 라이브러리인 게시물 표시

[기획자 편] 효율적인 화면 설계를 위한 피그마 라이브러리 운용 가이드

이미지
[기획자 편] 효율적인 화면 설계를 위한 피그마 라이브러리 운용 가이드 [기획자 편] 효율적인 화면 설계를 위한 피그마 라이브러리 운용 가이드 많은 서비스 기획자가 피그마를 쓰면서 가장 많이 하는 실수는, 디자인 시스템이 담긴 라이브러리(Library) 를 ‘도구함’이 아니라 ‘내 마음대로 수정하는 스케치북’으로 착각하는 겁니다. 기획자의 피그마 숙련도는 화려한 디자인 실력이 아니라 정해진 규격을 얼마나 정확하게 가져다 쓰느냐 에서 갈립니다. 오늘은 디자이너·개발자에게 사랑받는 기획자가 되기 위한 라이브러리 운용법(가져다 쓰되, 망치지 않기) 을 실무 기준으로 정리합니다.  📚 목차 라이브러리 사용의 대원칙: “가져다 쓰되, 망치지 않기” 왜 ‘Instance(인스턴스) 유지’가 중요한가? 효율적인 화면 설계를 위한 3단계 운용법 Detach(연결 해제) 지양: 부채가 되는 순간 디자이너와 평화롭게 협업하는 체크리스트 라이브러리에 없는 UI가 필요할 때: 기획자의 정석 요청법 FAQ 1) 라이브러리 사용의 대원칙: “가져다 쓰되, 망치지 않기” 라이브러리는 ‘제약’이 아니라 가이드레일 입니다. 기획자는 새로운 UI를 창조하는 역할보다, 라이브러리 안에서 최적의 컴포넌트를 선택해 배치(Layout) 하고 의도를 명확히 전달 하는 데 집중할수록 팀 생산성이 올라갑니다. 이 원칙을 지키는 가장 쉬운 방법은 단 하나예요. ✅ Instance(인스턴스) 상태를 유지한 채 사용하기 2) 왜 ‘Instance(인스턴스) 유지’가 중요한가? 라이브러리의 Main Component(원본)를 직접 만지는 순간, 협업의 평화가 흔들립니다. 반대로 인스턴스를 유지 하면...

복붙 지옥 탈출: Figma 컴포넌트 라이브러리 ‘정리 규칙’ 7가지(실무 템플릿)

이미지
Figma 컴포넌트 라이브러리 ‘정리 규칙’ 7가지를 제공합니다. 복붙 지옥 탈출: Figma 컴포넌트 라이브러리 ‘정리 규칙’ 7가지(실무 템플릿) 서론 안녕하세요~ Figma로 버튼, 탭, 입력 폼까지 열심히 만들었는데 어느 날 이런 순간이 오더라고요. “그때 그 버튼… 어디 있더라?” 화면은 많아지고, 복사본은 더 많아지고, 결국 수정 요청이 오면 찾는 데 시간이 더 걸립니다. 저도 초반엔 화면 파일마다 컴포넌트를 만들고 그때그때 가져다 썼는데, 프로젝트가 커지니까 같은 UI가 조금씩 다른 버전으로 퍼지기 시작했습니다. 그때부터 깨달았어요. 만드는 실력보다 중요한 건 정리와 공유 라는 걸요. 그래서 이번 글에서는 Figma 라이브러리 를 기준으로 “복붙 지옥”을 끝내는 정리 규칙 7가지 를 실무 템플릿 형태로 정리합니다. (오늘 글은 예쁜 말보다, 바로 써먹는 규칙 위주로 갑니다 🧾) 이 글을 읽고 나면: UI 자산(버튼/칩/탭/입력폼)을 한 곳에 모아 공유해도 망가지지 않는 구조로 운영할 수 있습니다. 글 마지막에 Figma 라이브러리 체크리스트가 있습니다. 📚 목차 Figma 라이브러리란? (컴포넌트와 뭐가 다를까) 규칙 1) “원본 파일”과 “사용 파일”을 분리한다 규칙 2) 네이밍은 슬래시(/)로 ‘검색 가능’하게 만든다 규칙 3) Variants 속성은 공통 규칙(Type/Size/State)로 통일한다 규칙 4) 컴포넌트 페이지는 ‘전시장’처럼 구역화한다 규칙 5) 바뀌는 값(토큰/스타일)은 중앙에서 관리한다 규칙 6) 공유 전 체크리스트로 ‘망한 배포’를 막는다 ...