피그마(Figma )와 피그잼(FigJam)에 대해

 

Figma와 FigJam은 같은 회사(Figma Inc.)에서 만든 도구이지만, 목적이 전혀 다릅니다.
둘 다 웹 기반이며 협업 기능이 강력하지만, Figma는 디자인, FigJam은 화이트보드에 초점을 둔 도구입니다.

---

✅ Figma vs FigJam 한눈에 비교

항목FigmaFigJam

🎯 목적	UI/UX 디자인, 프로토타입 제작	아이디어 정리, 회의, 브레인스토밍
🧰 기능	프레임, 컴포넌트, 오토레이아웃, 프로토타입	포스트잇, 도형, 스티커, 선 연결 도구
🤝 협업	실시간 UI 디자인 공동 작업	실시간 화이트보드 협업 도구
📁 파일 확장자	.fig	.jam
📦 주요 사용 예	앱 UI, 웹사이트 디자인, 컴포넌트 시스템	회의 아이디어 정리, 플로우차트, 마인드맵

 

---

🟦 Figma란?

▶ 무엇에 쓰이나요?

• 앱, 웹페이지 등의 UI/UX 설계
• 프로토타입 제작 (버튼 누르면 다음 페이지로 이동 등 인터랙션 설정)
• 디자인 시스템 관리 (버튼, 컬러, 타이포 그래픽 정리)

▶ 누가 쓰나요?

• UI 디자이너
• 프론트엔드 개발자
• 기획자 (와이어프레임 작업 시)

---

🟨 FigJam이란?

▶ 무엇에 쓰이나요?

• 아이디어 회의 (포스트잇에 생각 적기, 화살표로 흐름 만들기)
• 팀 프로젝트의 기획 초기 단계
• 간단한 플로우차트, 마인드맵, 사용자 여정 지도(Journey Map)

▶ 주요 도구

• 포스트잇 (Sticky note)
• 커넥터 선 (Flow 연결용)
• 이모지/스티커 (재미있는 실시간 반응)
• 타이머 (회의 시간 관리용)
• 투표 기능 (아이디어 우선순위 정할 때)

---

🧩 언제 어떤 걸 써야 하나요?

상황사용 도구

UI 화면을 설계하고 싶다	✅ Figma
앱의 흐름(로그인 → 홈 → 설정)을 그려보고 싶다	✅ FigJam
팀원들과 브레인스토밍하고 싶다	✅ FigJam
버튼 클릭 시 다음 화면으로 넘어가는 프로토타입을 만들고 싶다	✅ Figma
간단한 와이어프레임을 빠르게 그리고 싶은데 정확한 디자인은 아직 필요 없다	FigJam or Figma 모두 가능

 

---

✨ 실제 활용 예시

역할Figma 작업 예FigJam 작업 예

기획자	기본 레이아웃 와이어프레임	요구사항 정리, 사용자 흐름 정리
디자이너	디자인 시스템, 컴포넌트 제작	팀과 아이디어 회의, Moodboard 공유
개발자	프로토타입 확인, 마진 확인	API 흐름도, 데이터 구조 아이디어 공유

 

---

📎 하나의 프로젝트에서 같이 쓰는 예

1. FigJam으로 아이디어 회의 → 흐름 정리
2. 결정된 기획을 바탕으로 Figma에서 UI 디자인
3. Figma에서 프로토타입 제작
4. 개발자에게 전달하여 실제 구현