vs-code

6 개의 포스트

github

가까운 곳에서 열 (새 탭에서 열림)

소프트웨어 개발 전반이 AI 중심으로 빠르게 바뀌는 가운데, GitHub Copilot Dev Days는 개발자들이 GitHub Copilot을 실제 업무에 적용하는 방법을 함께 배우는 글로벌 오프라인 행사다. 초보자부터 숙련자까지 참여할 수 있으며, 라이브 데모와 실습을 통해 AI 보조 개발의 최신 도구와 모범 사례를 익히는 것이 목적이다. 행사는 2026년 3월부터 전 세계 여러 도시에서 열리며, 개발자 커뮤니티나 사용자 그룹이 직접 개최할 수도 있다. ## AI 보조 개발 역량을 함께 높이는 행사 - AI는 더 이상 미래의 도구가 아니라 코드 기획, 작성, 리뷰, 배포 방식에 이미 영향을 주고 있다. - 개발자는 빠르게 변화하는 개발 환경에 맞춰 AI 도구를 효과적으로 활용해야 한다. - Dev Days는 이러한 변화에 대응해 개발자들이 함께 학습하고 경험을 공유하도록 설계됐다. - 글로벌 시리즈이지만 각 행사는 지역 커뮤니티가 주도하는 대면 이벤트로 진행된다. ## 초보자부터 전문가까지 참여 가능 - 전문 개발자, 학생 등 다양한 배경의 참가자를 대상으로 한다. - AI 보조 개발을 처음 접하는 사람에게는 기본 도구와 성공적인 활용 방법을 소개한다. - 이미 Copilot을 사용 중인 개발자에게는 최신 기능, 팁, 활용 기법을 제공한다. - 행사별로 수준과 프로그래밍 언어, 주제가 다를 수 있으므로 등록 전에 세부 내용을 확인해야 한다. ## 실습 중심의 프로그램 - 라이브 데모, 실용적인 강의, 상호작용형 워크숍으로 구성된다. - GitHub Copilot CLI, Cloud Agent, VS Code, Visual Studio 및 기타 편집기 관련 교육 자료를 다룬다. - 일반적인 예시 일정은 다음과 같다. - GitHub Copilot 소개: 30~45분 - 지역 개발자 또는 커뮤니티 리더의 세션: 30~45분 - 코딩 실습과 실전 연습: 약 1시간 - GitHub Stars, Microsoft MVPs, GitHub Campus Experts, Microsoft Student Ambassadors, GitHub·Microsoft 직원 등이 진행자로 참여한다. - 행사마다 지역 개발자들의 관심사에 맞춰 일정과 주제가 조정될 수 있다. ## 지역 커뮤니티와의 교류 - 참가자는 Copilot 활용법뿐 아니라 지역 개발자들과 네트워킹할 수 있다. - 행사에는 음식, 간식, 기념품 등 커뮤니티 이벤트 요소도 포함된다. - 각 지역의 사용자 그룹은 공식 양식을 통해 Dev Days 개최를 신청할 수 있다. - 행사는 2026년 3월부터 전 세계 도시에서 시작되며, 좌석이 제한되어 있다. 가까운 지역에서 열리는 행사의 등록 페이지를 확인하고, 관심 있는 주제와 실습 환경이 포함되어 있다면 직접 참여하는 것이 좋다. 사용자 그룹을 운영한다면 자체 행사를 개최해 지역 개발자들에게 AI 보조 개발을 경험할 기회를 제공할 수 있다.

figma

요점만 말하자면: (새 탭에서 열림)

Figma의 「Building better」는 개발자 경험(DX)이 특정 팀이나 도구만의 문제가 아니라, 조직 전체의 문화·원칙·프로세스에서 결정된다고 주장한다. 글은 VS Code, Atlassian, Linear 등의 사례를 통해 개발자의 몰입을 보호하고, 개발자 만족을 측정하며, 명확한 제품 철학과 디자인·개발 협업 체계를 구축하는 방법을 소개한다. 결론적으로 더 나은 개발 환경은 도구 도입보다 조직 차원의 일관된 운영 방식에서 출발한다. ## 개발자의 몰입을 지키는 ‘이너 루프’ VS Code는 개발자가 코드 작성에 집중하는 시간을 “이너 루프”, 버그 관리·티켓 응답·회의 같은 협업 활동을 “아우터 루프”로 구분한다. - 생산성을 가장 크게 떨어뜨리는 요인은 작업 자체보다 잦은 컨텍스트 스위칭이다. - 코드 편집과 디버깅처럼 집중력이 필요한 작업을 보호해야 한다. - 협업 활동을 완전히 제거하기보다, 이너 루프와 아우터 루프 사이의 전환 횟수를 줄이는 것이 핵심이다. - 개발 도구는 개발자가 여러 업무 시스템을 오가며 흐름을 잃지 않도록 지원해야 한다. ## 개발자 경험을 넘어선 ‘개발자 기쁨’ Atlassian은 개발자 경험을 넘어 “developer joy”를 조직의 중요한 기준으로 삼는다. - 개발자 기쁨은 단순한 편의성이나 만족도보다, 좋은 소프트웨어를 만드는 과정의 완성도와 장인정신에 초점을 둔다. - 이를 추상적인 구호로 남기지 않고 조직의 가치와 업무 방식에 반영한다. - 개발자 경험 개선이 생산성, 업무 만족도, 비즈니스 성과에 어떤 영향을 주는지 측정하려 한다. - 특정 팀의 활동에 그치지 않고 조직 전체로 확장하려면 공통된 원칙과 운영 체계가 필요하다. ## 강한 의견을 반영한 소프트웨어 Linear는 모든 사용자의 요구를 수용하기보다, 제품이 지향하는 명확한 관점을 바탕으로 기본적인 업무 흐름을 설계한다. - 좋은 도구는 기능을 무작정 늘리기보다 사용자가 따라갈 수 있는 강한 기본값을 제공한다. - 제품의 철학은 인터페이스뿐 아니라 우선순위 설정, 협업 방식, 내부 프로세스에도 반영된다. - 일반적인 관행과 다르더라도 일관된 원칙이 사용자 경험을 단순하고 예측 가능하게 만들 수 있다. - 다만 독단적인 설계가 아니라, 어떤 문제를 해결하려는지에 대한 분명한 판단이 전제되어야 한다. ## Dev Mode 도입에서 얻은 10가지 교훈 Decathlon의 엔지니어링 매니저는 1년간 Dev Mode를 디자인 시스템과 개발 workflow에 적용한 경험을 공유한다. - 처음부터 조직 전체에 도입하기보다 작은 범위에서 시작하는 것이 좋다. - 빠르게 효과를 확인할 수 있는 작은 개선부터 추진한다. - 디자인과 개발 사이의 전달 과정에서 반복되는 혼선을 찾아 해결한다. - Dev Mode를 단순한 기능 도입이 아니라 디자인 시스템 운영 방식의 일부로 활용한다. - 실제 사용 경험을 바탕으로 팀에 맞는 규칙과 협업 방식을 점진적으로 정립한다. ## 대규모 제품의 복잡성 관리 Crunchyroll은 웹, 모바일, 게임 콘솔 등 15개 플랫폼과 12개 언어를 지원하기 위해 Universal Design System을 활용한다. - 플랫폼과 언어가 늘어날수록 디자인 일관성과 개발 전달 과정이 복잡해진다. - 공통 컴포넌트와 디자인 시스템을 통해 여러 접점에서 동일한 사용자 경험을 유지한다. - Dev Mode는 디자인 사양을 확인하고 개발에 필요한 정보를 전달하는 과정을 간소화한다. - 디자인 시스템의 채택률을 높이려면 문서화뿐 아니라 실제 workflow 안에서 쉽게 사용할 수 있어야 한다. - 복잡성을 줄이는 핵심은 개별 화면을 관리하는 것이 아니라 재사용 가능한 시스템을 구축하는 데 있다. ## 디자인과 코드 사이의 연결 글의 ‘Rabbit hole’에서는 Figma의 Code Connect와 Simple Design System 사례를 통해 디자인과 실제 코드의 연결을 다룬다. - Simple Design System은 실제 코드 기반을 갖춘 UI 키트로, 디자인 결과물과 구현 결과 사이의 간극을 줄이는 것을 목표로 한다. - 디자인 시스템은 시각적 컴포넌트 모음에 그치지 않고 코드에서 어떻게 사용되는지까지 연결되어야 한다. - Code Connect 같은 접근은 디자인 컴포넌트와 실제 코드 컴포넌트의 관계를 명확히 하는 데 도움을 준다. - 디자인과 개발의 연결은 단순히 협업 편의성을 높이는 것뿐 아니라 구현 품질과 일관성을 관리하는 수단이기도 하다. 조직은 새로운 도구를 도입하는 데 그치지 말고, 집중 업무 보호, 명확한 제품 원칙, 측정 가능한 개발자 만족도, 디자인 시스템과 코드의 연결을 함께 설계해야 한다. 작은 workflow 개선부터 시작해 실제 효과를 검증하고, 검증된 방식을 조직 전체의 문화와 프로세스로 확장하는 접근이 현실적이다.

figma

개발 모드의 향후 계획 (새 탭에서 열림)

Figma는 Dev Mode 무료 베타 종료를 앞두고 주석, 변경 사항 비교 개선, 플러그인, Jira·VS Code 연동 기능을 공개했다. 이를 통해 디자이너와 개발자 간 핸드오프에 필요한 맥락을 강화하고, 조직별 기술 스택과 디자인 시스템에 맞춘 개발 워크플로를 지원한다. Dev Mode는 2024년 1월 31일부터 무료 베타를 종료하고 유료 좌석이 필요해진다. ## 디자인과 연결되는 주석 기능 - 디자이너가 디자인 레이어에 설명, 속성, 사양, 측정값을 직접 추가할 수 있다. - 클릭과 드래그만으로 치수와 간격을 표시해 개발자에게 구체적인 구현 정보를 전달한다. - 주석이 특정 레이어에 연결되므로 디자인이 변경되면 속성이나 측정값도 함께 업데이트된다. - 확대·축소 수준에 따라 주석이 자동으로 표시되거나 숨겨져 캔버스를 복잡하게 만들지 않는다. - 플러그인 API를 이용하면 여러 레이어에 주석을 일괄 생성하고 관리할 수 있다. ## 시각적·코드 기반 변경 사항 비교 - Compare Changes 기능이 개편되어 디자인 변경 사항을 시각적 차이와 코드 차이로 모두 확인할 수 있다. - 주석 기능과 결합해 어떤 디자인 요소가 바뀌었고 구현에 어떤 영향을 주는지 파악하기 쉬워졌다. - Figma for Jira 앱을 사용하면 Jira 이슈에 디자인 맥락을 삽입할 수 있다. - 디자인이 변경될 때 Jira에서 알림을 받아 핸드오프 과정에서 업데이트를 놓치지 않도록 지원한다. ## 조직별 코드 생성과 플러그인 - 조직마다 다른 개발 환경에 맞춰 HTML, React, Tailwind, Bootstrap 등 다양한 형식의 코드를 생성할 수 있다. - 디자인 시스템 컴포넌트와 실제 코드베이스의 컴포넌트 연결 여부를 확인하는 플러그인을 만들 수 있다. - 플러그인에 내부 API 안내, 디자인 시스템 문서 링크, 사용 가능한 컴포넌트 정보 등을 포함할 수 있다. - Enterprise 관리자는 특정 플러그인을 조직 전체에 고정하고 Dev Mode에서 기본 실행되도록 설정할 수 있다. - Razorpay는 자체 Dev Mode 플러그인인 RazorSharp를 구축해 디자인에 대응하는 코드를 자동 생성했다. ## Figma for VS Code 개선 - VS Code 안에서 Figma 디자인을 탐색하고 검사할 수 있도록 확장 기능의 탐색성과 검색성이 개선됐다. - 여러 페이지와 무한 캔버스를 직접 이동하는 대신 프레임을 그리드 형태로 선택할 수 있다. - Focus View를 통해 개별 프레임을 집중해서 확인할 수 있다. - VS Code를 떠나지 않고 Figma 플러그인을 실행할 수 있어, 사내 도구나 코드 생성 플러그인을 개발 환경에서 바로 사용할 수 있다. ## Dev Mode 유료 전환 - Dev Mode는 2024년 1월 31일 무료 베타에서 정식 서비스로 전환된다. - 이후 사용하려면 플랜과 좌석 유형에 따라 유료 Dev Mode 좌석이 필요하다. - 무료 베타 기간 동안 사용자 피드백을 반영해 200개 이상의 기능과 수정 사항이 추가됐다. 조직은 디자인 시스템과 실제 코드베이스의 연결이 중요하다면 주석과 플러그인을 우선 도입하고, 개발자가 VS Code 중심으로 작업한다면 Figma for VS Code와 사내 플러그인 연동을 검토하는 것이 효과적이다. 유료 전환 전 팀별 좌석과 플러그인 운영 정책도 함께 정하는 것이 좋다.

figma

Razorpay가 개발자 워크플 (새 탭에서 열림)

인도 최대의 금융 서비스 기업인 Razorpay는 1,000만 개 이상의 비즈니스를 지원하기 위해 디자인 시스템 'Blade'를 구축하여 일관된 사용자 경험과 개발 효율성을 동시에 확보했습니다. 웹과 모바일을 아우르는 단일 API 구조를 통해 플랫폼 간 전환 비용을 최소화하고, 전용 플러그인과 Figma Dev Mode를 적극 활용해 디자이너와 개발자 간의 협업 마찰을 획기적으로 줄였습니다. 결과적으로 Blade는 단순한 가이드를 넘어 제품의 신뢰성을 높이고 시장 출시 속도를 앞당기는 핵심 동력으로 자리 잡았습니다. **크로스 플랫폼을 위한 단일 라이브러리 체계** * 웹, iOS, Android 등 다양한 플랫폼에서 동일한 API와 속성을 공유하는 단일 디자인 시스템을 운영하여 개발자가 플랫폼을 옮겨가더라도 기존 지식을 그대로 활용할 수 있게 했습니다. * 하드코딩으로 인해 발생할 수 있는 텍스트 필드의 에러 처리나 버튼 상태값 누락 등의 세부적인 오류를 방지하고, 모든 컴포넌트에 접근성(Accessibility)을 기본적으로 내장했습니다. * 디자이너와 개발자가 동일한 언어를 사용함으로써 커뮤니케이션 비용을 줄이고, 디자인에서 보는 결과물이 코드와 일치하도록 보장합니다. **지표 기반의 도입 전략과 조직 내 확산** * 새로운 기능을 개발할 때는 디자인의 70%, 기존 화면을 수정할 때는 50% 이상 Blade 컴포넌트를 사용하도록 KPI를 설정하여 디자인과 개발 팀이 공동의 목표를 추구하게 합니다. * 'Blade Coverage' 플러그인을 통해 디자이너가 시스템에서 얼마나 벗어나고 있는지 실시간으로 확인하게 함으로써, 핸드오프 단계 이전에 피드백을 주고받을 수 있는 환경을 조성했습니다. * 리더십의 지지를 바탕으로 전담 슬랙 채널 운영, 오피스 아워, 시연 영상 공유 등을 통해 내부 고객(직원)들의 채택률을 높이고 연간 NPS(순추천지수) 설문을 통해 만족도를 관리합니다. **RazorSharp와 Dev Mode를 통한 코드 자동화** * 개발자가 일일이 속성을 검사하던 비효율을 제거하기 위해 디자인을 코드로 자동 변환해주는 자체 플러그인 'RazorSharp'를 개발했습니다. * Figma의 Dev Mode를 도입하면서 기존 편집 권한이 필요했던 플러그인 제약을 극복했고, 개발자가 편집 권한 없이도 코드를 복사하고 Storybook 링크를 통해 바로 컴포넌트 환경으로 이동할 수 있게 했습니다. * VS Code 플러그인을 연동하여 개발 환경 내부에서 직접 디자인 사양을 확인하며 코드를 작성하는 워크플로우를 구축했습니다. **Variables를 활용한 토큰 관리 및 성능 최적화** * 기존의 복잡한 토큰 명명 규칙(surface/text/subtle)을 개발자 친화적인 구조(surface.text.subtle)로 변환하고, 간격(spacing) 토큰을 변수화하여 개발 편의성을 높였습니다. * 여러 테마와 라이트/다크 모드를 개별적으로 만들던 방식에서 변수(Variables) 기반 시스템으로 전환하여 메모리 소모를 대폭 줄이고 디자인 작업 속도를 개선했습니다. * 이를 통해 하나의 테마 안에서 다양한 모드를 유연하게 구현할 수 있게 되어 시스템의 복잡성을 낮추고 관리 효율을 극대화했습니다. **디자인 시스템 운영을 위한 실용적 제언** 디자인 시스템의 성공은 단순히 컴포넌트를 만드는 것에 그치지 않고, 개발자가 실제 작업 환경에서 얼마나 편리하게 코드를 추출하고 적용할 수 있느냐에 달려 있습니다. Razorpay처럼 자체 플러그인을 개발하거나 Dev Mode를 적극 활용하여 '디자인 검사'에 들어가는 시간을 줄이고, 정량적인 사용량 지표(Coverage)를 통해 팀의 성과를 객관화하는 접근 방식이 권장됩니다. 또한, 시스템의 복잡도가 커질수록 Variables 기능을 활용해 성능 저하를 방지하고 개발 생산성을 높이는 전략이 필수적입니다.

figma

Dev Mode 후속 업데이트: (새 탭에서 열림)

Figma는 Dev Mode 오픈 베타 2개월 동안 사용자 피드백 5,000건 이상을 반영해 200개가 넘는 기능과 수정 사항을 배포했다. 이번 업데이트의 핵심은 디자인 파일을 개발자가 더 쉽게 탐색·검수하고, 코드 생성 결과를 실제 개발 환경에 가깝게 만드는 것이다. 상태 라벨, 버전 비교, 향상된 코드 스니펫, VS Code 연동 등으로 디자이너와 개발자 간 협업 효율을 높였다. ## Dev Mode에 새로 추가된 기능 - 컴포넌트, 인스턴스, 프레임, 섹션에 개발 준비 상태를 나타내는 **상태 라벨**을 추가할 수 있다. - Design Mode에서 제공되던 **레이아웃 그리드, 룰러, 아웃라인 모드**를 View 메뉴와 기존 단축키로 사용할 수 있다. - 분리(detached)된 컴포넌트를 원본 메인 컴포넌트와 비교해 변경 사항을 확인할 수 있다. - 코드 옵션으로 **Android XML과 iOS UIKit**이 다시 제공된다. - 색상 형식에서 `UIColor`를 선택할 수 있다. - 파일 이름을 클릭하면 **버전 기록의 여러 디자인 버전**을 열어 검사할 수 있다. ## 사용성 및 성능 개선 - 외부 라이브러리에서 가져온 디자인 시스템 컴포넌트의 라이브러리 이름을 표시한다. - 컴포넌트 플레이그라운드에서 중첩된 컴포넌트 속성과 컴포넌트 모드를 확인하고 실험할 수 있다. - 텍스트 속성에는 `rem` 단위를 사용하면서, 다른 속성은 픽셀 단위로 유지할 수 있다. - 캔버스에서 여러 객체를 `Shift` 클릭으로 선택하고 한 번에 내보낼 수 있다. - Figma 파일과 알림을 **VS Code 내부에서 확인**할 수 있다. - 타이포그래피 미리보기에서 스타일 이름, 글자 크기, 줄 높이 같은 속성을 확인하고 복사할 수 있다. - 텍스트의 특정 부분만 선택해 개별 속성을 검사할 수 있다. - 왼쪽 레이어 패널의 높이를 드래그로 조절할 수 있다. - 원시 값과 일치 가능성이 높은 디자인 시스템 변수를 자동으로 제안한다. - 코드 스니펫뿐 아니라 Figma 속성 형식으로도 값을 확인할 수 있다. - 디자인에 포함된 이미지 등의 소스 파일을 다운로드할 수 있다. - 대체 단위 설정을 일반 환경설정 메뉴에서 쉽게 찾을 수 있다. - 섹션을 선택하면 프레임별 링크를 모아서 확인할 수 있다. ## 코드 생성 개선 - `Shift` 키를 누른 채 모든 코드 스니펫을 한 번에 복사할 수 있다. - 하나의 패딩 값만 설정된 경우에도 CSS에서 `padding-top`, `padding-bottom`, `padding-left`, `padding-right`를 생성한다. - 코드에 `font-style`, `line-height`, `font-weight`를 항상 표시한다. - `line-height`를 백분율과 픽셀 값으로 함께 제공한다. - CSS 코드 생성에서 다음 OpenType 기능을 지원한다. - `font-feature-settings` - `font-variant-numeric` - `font-kerning` - 오토 레이아웃의 `min-width`, `max-width`, `min-height`, `max-height`와 줄바꿈 레이아웃의 세로 간격에 변수를 사용할 수 있다. - 여러 문단이나 서로 다른 텍스트 스타일이 섞인 텍스트 레이어는 스타일별 CSS 코드를 개별적으로 표시한다. - 커뮤니티에는 Tailwind, React, Vue 등을 위한 약 80개의 코드 생성 플러그인이 제공된다. ## 버그 수정 및 탐색 개선 - 탭 키 내비게이션으로 Design Mode와 Dev Mode 사이를 전환할 수 있다. - 힌트와 툴팁 전반에서 대체 단위를 올바르게 표시한다. - 텍스트 그라디언트 표시를 개선하는 등 시각적 품질 문제를 수정했다. 이번 업데이트는 Dev Mode를 단순한 디자인 검사 도구가 아니라, 디자인 시스템 확인·코드 생성·파일 관리·개발 환경 연동을 아우르는 협업 작업 공간으로 발전시키는 데 초점을 맞췄다. 팀에서는 상태 라벨과 버전 기록을 개발 핸드오프 과정에 적극 활용하고, 생성된 CSS나 플랫폼 코드는 실제 프로젝트 규칙과 비교해 검토하는 것이 좋다.

figma

Config 2023 다시 보기 (새 탭에서 열림)

Figma는 Config 2023을 통해 단순한 디자인 도구를 넘어 디자인과 개발의 경계를 허물고 전체 제품 개발 팀이 함께 협업할 수 있는 통합 플랫폼으로의 진화를 선언했습니다. 이를 위해 개발자 전용 워크스페이스인 '개발 모드(Dev Mode)'와 코드의 논리를 디자인에 이식하는 '변수(Variables)', 그리고 실질적인 제품 작동 방식을 구현하는 '고급 프로토타이핑' 기능을 새롭게 도입했습니다. 이번 업데이트는 디자인 결과물이 실제 제품 코드로 전환되는 과정을 가속화하고, 팀 간의 소통 방식을 근본적으로 재정의하는 데 목적이 있습니다. ### 개발자 경험을 최적화하는 개발 모드(Dev Mode) * **개발자 전용 워크스페이스:** 무한한 캔버스 내에서 개발자가 작업에 필요한 구조와 기능을 직관적으로 파악할 수 있는 별도의 모드를 제공합니다. * **코드 번역 및 검사:** 디자인 요소를 코드로 더 빠르게 변환할 수 있으며, Jira, GitHub, Storybook과 같은 주요 개발 도구 및 코드베이스와 플러그인을 통해 직접 연결됩니다. * **VS Code 통합:** 'Figma in VS Code'를 통해 개발 환경을 벗어나지 않고도 에디터 바로 옆에서 디자인 파일을 검사하고 협업할 수 있습니다. * **배포 추적:** 어떤 디자인 요소가 프로덕션에 반영되어야 하는지 상태를 추적하여 디자인과 개발 간의 누락을 방지합니다. ### 디자인 시스템의 유연성을 극대화하는 변수(Variables) * **디자인 토큰의 코드화:** 색상, 숫자, 텍스트, 불리언(Boolean) 값을 변수로 저장하여 디자인 시스템을 코드의 언어와 일치시킵니다. * **모드(Modes) 지원:** 라이트 모드와 다크 모드, 혹은 다양한 테마 간의 전환을 변수 값을 통해 손쉽게 토글하며 테스트할 수 있습니다. * **확장성 있는 관리:** 에일리어싱(Aliasing) 및 스코핑(Scoping)을 지원하며, REST API와 플러그인을 통해 변수 생성 및 관리 프로세스를 자동화할 수 있습니다. ### 논리적 흐름을 구현하는 고급 프로토타이핑 * **조건부 로직 및 표현식:** "특정 변수가 X일 때 프레임 2로 이동"과 같은 조건문이나 수학적 표현식을 활용하여 실제 앱과 유사한 복잡한 상호작용을 구현할 수 있습니다. * **효율적인 프로토타입 제작:** 수많은 화면을 직접 연결할 필요 없이 변수를 활용해 동적인 변화를 줄 수 있어 프로토타입 제작 시간이 단축됩니다. * **인라인 프리뷰:** 디자인 편집 화면과 프로토타입 미리보기 화면을 동시에 띄워두고 수정한 내용을 즉각적으로 확인할 수 있어 반복 작업의 효율이 높아졌습니다. ### 워크플로우 개선을 위한 편의 기능(Quality of Life) * **오토 레이아웃 고도화:** 요소가 넘치면 다음 줄로 넘겨주는 '줄 바꿈(Wrap)' 기능과 최소/최대 너비 및 높이 설정 기능이 추가되었습니다. * **글꼴 선택기 업그레이드:** 글꼴 이름을 해당 서체로 미리 볼 수 있는 기능과 검색 및 필터링 기능이 강화되어 원하는 폰트를 더 빠르게 찾을 수 있습니다. * **파일 브라우저 업데이트:** 외부 팀과 공유된 프로젝트나 파일을 더 쉽게 찾을 수 있도록 인터페이스가 개선되었습니다. ### AI 기술을 통한 디자인의 미래 확장 * **Diagram 인수:** AI 기반 디자인 도구를 개발해온 Diagram을 인수하여 Figma 플랫폼 전반에 AI 기능을 통합할 계획입니다. * **창작 보조 및 가속:** AI가 시각적 표현을 돕고 워크플로우를 가속화하며, 누구나 수준 높은 초안을 만들 수 있도록 지원함으로써 디자인의 진입장벽을 낮추고자 합니다. Figma의 이번 업데이트는 디자이너와 개발자가 서로 다른 언어를 사용하는 문제를 해결하는 데 집중하고 있습니다. 개발 모드를 통해 개발자는 디자인 의도를 명확히 파악하고, 디자이너는 변수와 로직을 활용해 실제 제품에 가까운 설계를 할 수 있게 되었습니다. 팀의 생산성을 높이기 위해 현재 베타 버전으로 제공되는 개발 모드를 프로젝트에 적극적으로 도입하고, 기존 디자인 시스템을 변수(Variables) 기반으로 전환하여 다국어나 테마 대응 효율을 높여보시길 권장합니다.