협업 & 프로세스

Figma 어노테이션 기능 활용

피그마 오픈카톡방2026. 3. 7.

질문사항

프로덕트 디자이너 포지션에서 디자인 디스크립션 문서를 일일이 만들기 어려울 때, 피그마에서 어노테이션 기능을 활용하여 카테고리 분류해서 작성하는 방법도 있다고 들었습니다. 어노테이션 기능이 무엇인가요?

답변

Figma의 어노테이션(Annotation) 기능은 디자인 파일 내에서 특정 요소나 영역에 대한 설명, 지시사항, 피드백 등을 추가하는 것을 의미합니다. 이는 주로 개발자 핸드오프, 팀원 간의 협업, 또는 디자인 시스템 문서화에 활용됩니다.

주요 활용 방법:

Comment 기능: Figma의 기본 Comment 기능을 사용하여 특정 프레임, 레이어, 또는 영역에 직접 텍스트 주석을 달 수 있습니다. 이는 실시간 피드백 및 논의에 유용합니다.

텍스트 레이어/스티커: 디자인 파일 내에 일반 텍스트 레이어나 미리 만들어둔 '어노테이션 스티커' 컴포넌트를 사용하여 디자인 요소에 대한 상세 설명을 추가할 수 있습니다. 예를 들어, '이 버튼은 클릭 시 A 페이지로 이동합니다' 또는 '이 컴포넌트는 Design System v2.0의 Primary Button입니다' 와 같은 설명을 달 수 있습니다.

Dev Mode: Figma의 Dev Mode에서는 디자인 요소의 속성(크기, 색상, 폰트 등)을 자동으로 보여주며, 디자이너가 추가한 섹션 설명이나 컴포넌트 속성 설명을 개발자가 쉽게 확인할 수 있습니다.

이러한 어노테이션 기능을 활용하면 별도의 문서 없이도 디자인 파일 자체를 상세한 설명서로 만들 수 있어 효율적인 협업이 가능합니다.