한눈에 보는 정의
웹브라우저에서 화면 디자인과 프로토타입을 만들고 여러 사람이 함께 편집하는 디자인 도구.
이런 말로 들어요
- 피그마 링크로 시안 보내드릴게요. 수정할 곳에 코멘트 달아 주세요.
- 개발은 피그마 확정본 기준으로 들어갑니다.
그림으로 보기
여러 사람이 같은 캔버스에서 화면을 보고 코멘트를 남깁니다. 실제 피그마 화면이 아닌 일반화한 도식입니다.
하캄솔루션 자체 제작 설명도식자세히 알아보기
홈페이지나 앱 화면을 개발하기 전에 그림으로 먼저 설계할 때 씁니다. 파일을 링크 하나로 공유하고, 의뢰인이 화면 위에 바로 의견을 남길 수 있습니다. 버튼을 누르면 다음 화면으로 넘어가는 시안(프로토타입)도 만들 수 있어 실제 사용 흐름을 미리 확인할 수 있습니다.
실무 예시
예를 들어 홈페이지 리뉴얼 때 메인·서비스·문의 화면 3장을 피그마로 먼저 보고, 문구와 버튼 위치를 확정한 뒤 개발을 시작하면 수정 비용이 줄어듭니다.
함께 살펴볼 점
시안이 예쁘게 보여도 실제 글 길이·모바일 화면에서 깨질 수 있습니다. 확정 전에 실제 문구와 모바일 화면 시안을 함께 확인합니다.
AI에게 이렇게 요청해 보세요
이 피그마 시안 캡처를 보고 같은 구조의 반응형 HTML·CSS 섹션을 만들어 줘. 색과 여백 값은 CSS 변수로 분리해 줘.
코딩·작성 도구에 붙여 쓰기 전에 내 상황에 맞게 바꾸고, 결과는 직접 확인하세요.출처와 검토 정보
- Guide to prototyping in Figma 새 창
피그마 공식 도움말에서 프로토타입 기능(화면 연결·상호작용)을 확인했습니다.
자료 확인
내용 검토
최초 발행 · 내용 수정