AI Store에서 AI코딩으로 만들어진 앱을 만나보세요!
지금 바로 방문하기

Figma 2025: Config 컨퍼런스에서 발표된 주요 업데이트 요약

카테고리

디자인

서브카테고리

디자인 툴

대상자

디자이너, 개발자, 마케팅 팀

  • 디자인 툴 사용자: Figma의 새로운 기능을 활용한 웹/앱 디자인 작업
  • 개발자: CSS Grid와 직접 호환되는 Dev Mode 지원으로 디자인-코드 연동 효율성 향상
  • 마케팅 담당자: Figma Buzz를 통한 브랜드 자산 생성 및 콘텐츠 배포 자동화

핵심 요약

  • Figma Grid: 2D 구조 기반의 유연한 레이아웃 구축, CSS Grid와 직접 호환 지원
  • Figma Sites: 코드 없이 HTML/CSS 기반의 인터랙티브 웹사이트 직접 출판
  • Figma Make: 자연어 입력으로 프로토타입 생성, 3D 세계 및 실시간 데이터 지원
  • Figma Buzz: CSV 파일 기반의 대규모 브랜드 자산 생성, AI 이미지 생성 기능(gpt-image-1) 포함

섹션별 세부 요약

1. Figma Grid: 유연한 레이아웃 디자인

  • 2D 구조 활용: 행/열 기반의 정확한 요소 배치 및 중첩 가능
  • CSS Grid 호환: Dev Mode에서 CSS Grid 속성으로 디자인-코드 직접 매핑
  • 반응형 디자인: 실시간 조정을 통한 모바일, 태블릿, 데스크탑 대응
  • 복잡한 레이아웃: Auto Layout 중첩 없이 모듈화된 구조 생성

2. Figma Sites: 웹사이트 직접 출판

  • 시각적 편집기: 데스크탑, 모바일 등 브레이크포인트 자동 적용
  • 인터랙티브 기능: 호버, 드래그 등 HTML/CSS 기반 동작 지원
  • 디자인 시스템 연동: 라이브러리 내 요소 재사용 가능
  • 1클릭 출판: 외부 도구 없이 바로 웹사이트 배포

3. Figma Make: 자연어 기반 프로토타입 생성

  • NLP 지원: "메뉴 열기"와 같은 자연어 입력으로 애니메이션/인터랙션 생성
  • 고급 요소: 셰이더, 3D 세계, 실시간 데이터 동작 지원
  • 편집 도구: Point and Edit으로 디자인 요소 정확한 수정 가능

4. Figma Buzz: 브랜드 자산 생성 및 관리

  • CSV 기반 대량 생성: 브랜드 스타일 보장된 콘텐츠 일괄 생성
  • AI 이미지 생성: gpt-image-1 모델 활용한 이미지 자동 생성
  • 다중 포맷 출판: PNG, JPG, PDF 등 다양한 형식으로 내보내기

5. Figma Draw: 고급 일러스트 편집

  • 벡터 편집 강화: 불리언 연산, 라소 도구, 셰이프 빌더 개선
  • 표현력 강화: 브러시, 텍스처, 텍스트 경로 등 효과 지원
  • 디자인 시스템 통합: 색상 변수, 어두운 모드 등 적용 가능

결론

Figma는 2025년 Config 컨퍼런스에서 디자인-개발-배포까지 통합된 플랫폼으로 진화하고 있다.

  • 실무 적용 팁:

- Figma Grid를 활용한 반응형 레이아웃 설계 시 CSS Grid 속성 직접 매핑

- Figma Sites로 웹사이트 출판 시 IP 제한 또는 스태징 환경 기능 요청

- Figma Buzz의 CSV 기반 콘텐츠 자동 생성으로 마케팅 팀 협업 효율화

- Figma Make로 자연어 입력을 통한 프로토타입 개발, 개발자 협업 최소화

  • 향후 기대:

- GitHub과의 연동, 콘텐츠 편집권 관리, 접근성 도구 추가 등 향후 업데이트 기대