7P by neo 18일전 | favorite | 댓글 1개

UI3: 사용자 중심의 대규모 인터페이스 재설계

  • UI3는 2019년 이후 Figma의 가장 큰 인터페이스 변경으로, 복잡성을 줄이고 팀 협업 공간을 확보하기 위해 재구축됨
  • 초기 베타 테스트에서 떠다니는 패널(floating panels)이 작업 속도를 저하시키는 문제가 발견됨
    • 사용자 피드백을 바탕으로 패널을 **도킹(docked)**하여 크기 조절 가능하게 변경
    • 수평 스크롤링 추가 등 작은 디테일을 반영하여 더 직관적인 편집 환경 제공
  • 주요 개선 사항:
    • 하단 툴바와 Actions 메뉴를 통해 주요 도구 및 AI 기능에 빠르게 접근 가능
    • 색상 스포이트 도구 개선: 스타일 재사용, 색상 형식 변경, 새 변수 생성 가능

핵심 기능 강화: Multi-edit 및 성능 최적화

  • Multi-edit: 다양한 작업 스타일에 적응, 공동 작업 시 효율성을 높임
  • 타이포그래피:
    • 텍스트 스타일 덮어쓰기(기울임꼴, 굵게, 밑줄 등) 지원
    • 향상된 글꼴 선택 도구 및 단일 텍스트 노드에서 혼합된 단락 간격 설정 가능
  • 성능 개선:
    • 대형 파일을 효율적으로 관리하는 동적 페이지 로딩
    • 메모리 사용 최적화 및 원활한 멀티플레이어 협업 제공
  • 팀 관리 도구 개선:
    • 파일 고정, 검색 필터, 페이지 구분선 등의 조직화 도구 추가

AI 기능: 디자인 작업 흐름의 마찰 제거

  • 시각적 검색: 이미지나 캔버스 영역을 업로드해 필요한 파일과 컴포넌트 빠르게 찾기
  • 텍스트 생성 및 변환:
    • 텍스트 대체, 번역, 요약, 현실적인 텍스트 삽입
  • 이미지 제작 및 편집:
    • AI 기반 이미지 생성 및 배경 제거 기능 제공
  • FigJam:
    • AI 마인드맵으로 아이디어 시각화 및 Figma Slides 발표 자료 자동 생성

Figma Slides: 협업 중심의 프레젠테이션 도구

  • Figma의 협업 기능을 기반으로 프레젠테이션 모드 제공
    • 스마트 템플릿으로 일관성 유지
    • 실시간 설문조사 및 상호작용 기능 추가
  • FigJam 보드에서 자동으로 슬라이드 데크 아웃라인 생성 가능

디자인 시스템: 확장성과 유연성 강화

  • 타이포그래피 변수로 텍스트 제어 강화
  • 컴포넌트 속성의 새로운 변수 기능:
    • 인스턴스 분리 없이 디자인 시스템 유지 가능
  • 준비된 UI 키트로 디자인 프로세스 시작 속도 향상

개발자 도구: Dev Mode와 Code Connect

  • Dev Mode 개선:
    • 디자인-개발 협업을 위한 주석 도구 추가
    • VS Code 확장 프로그램으로 디자인 컨텍스트를 코드 편집기에 직접 통합
  • Code Connect:
    • 프로덕션 코드 스니펫 제공으로 디자인 시스템과 코드 간의 일관성 강화

커뮤니티 기여: 플러그인과 템플릿

  • 주목할 만한 플러그인:
    • LottieFiles: 애니메이션 생성
    • Peppercorn: 텍스트 스타일 생성
    • Vector to 3D: 디자인을 3D로 변환
  • 주목할 만한 템플릿:
    • FigJam 템플릿 500개 이상 공유
    • 다양한 디자인 리소스와 창의적인 템플릿 제공

글로벌 이벤트와 커뮤니티 성장

  • Config 2024: 10,000명 이상 참석, 디자인과 개발의 미래를 탐구
  • Friends of Figma: 220개 지역 그룹, 500개 이상 이벤트 개최
    • 커뮤니티 중심의 실질적이고 유의미한 경험 공유
  • 2024년에는 디자인과 개발, 아이디어와 프레젠테이션, 상상과 현실 사이의 격차를 줄이는 데 중점을 두었음
  • 2025년에는 커뮤니티와 함께 디자인 도구의 가능성을 더욱 확장해 나갈 계획

이번에 GeekNight 준비하며 디자인 작업을 Figma로 진행했는데요.
옆에서 곁눈질로만 봐도 정말 놀랍게 편하더군요.
디자이너 뿐만 아니라 개발자들도 써보고 그들의 방식을 배우면 좋을 것 같아요.