메인 콘텐츠로 건너뛰기

개발 모드

개발 모드를 만나보세요. 가장 빠르게 아이디어를 현실로 구현하세요. 이제 Figma에서 모든 조직의 디자이너와 개발자는 더욱 긴밀하게 협업할 수 있습니다.

Figma를 신뢰하는 주요 고객

atlassian 로고atlassian 로고decathlon 로고decathlon 로고github 로고github 로고kayak 로고kayak 로고razorpay 로고razorpay 로고volkswagen group services 로고volkswagen group services 로고

디자인과 엔지니어링 간의 작업 주고 받기 간소화

개발 모드는 Figma에 체계를 더해주어 디자인과 엔지니어링이 더욱 원활하게 협업할 수 있게 합니다.

주석 및 측정값 추가

주석과 측정값으로 핸드오프 준비 시간을 단축하세요. 디자인이 변경되면 업데이트되므로 반복 작업을 계속할 수 있습니다.

프로세스에 명확성 부여

개발 모드를 사용하면 팀이 작업을 진행하는 데 집중할 수 있습니다. 만들 준비가 된 사항, 변경 사항, 완료 사항을 정확히 찾고 추적하세요.

작업의 연결성 유지

인기 있는 개발 도구의 워크플로우 플러그인을 사용하면 디자인 라이브러리, 코드베이스, 프로젝트 관리 도구 사이를 오갈 필요가 없습니다.

Figma의 개발 모드는 개발자와 디자이너 간의 협업을 간소화하여 둘 사이의 마찰을 줄여주는 데, 그게 정말 마음에 들어요.

Sandra Schaus
Volkswagen Group Services 비즈니스 개발 서비스, 리드 UX 전문가

volkswagen 로고

디자인 시스템 채택 촉진을 통한 제품 디자인 및 엔지니어링 품질 강화

디자인 및 개발 전반에서 일관성을 유지하여 디자인 시스템을 팀이 선택할 수 있는 가장 간단한 방법으로 만드세요.

컴포넌트 정보 받기

캔버스의 개체에 직접 연결된 컴포넌트 속성 및 문서를 살펴보세요.

디자인 시스템과 코드베이스 연결

Code Connect를 사용하면 코드의 컴포넌트를 Figma의 디자인 시스템과 연결할 수 있으므로 코드 스니펫을 항상 프로덕션에 바로 사용할 수 있습니다.

HP가 개발 모드를 사용하여 디자인 시스템 채택률을 높이는 방법 알아보기

Figma에서 개발자가 더 효율적이고 효과적으로 작업할 수 있도록 지원

개발 모드를 사용하면 디자인 관련 지식이 없어도 빌드를 시작하는 데 필요한 세부 정보를 쉽게 찾을 수 있습니다.

Visual Studio Code를 위한 Figma

VS Code용 확장 프로그램으로 디자인 파일을 텍스트 에디터로 가져올 수 있습니다. Figma 파일 검사, 디자이너와의 협업, 알림 받기, 코드 제안 받기 등의 모든 작업을 더 빨리 빌드할 수 있습니다.

관련 코드 복사

디자인에서 CSS, iOS, Android 코드 스니펫을 생성하거나 플러그인으로 사용 중인 프레임워크나 라이브러리에 맞게 코드를 맞춤화하세요.

Figma를 사용하는 팀의 개발 효율성은 30% 향상했습니다

더 많은 디자인 및 개발 리소스 살펴보기

Figma가 개발 모드를 구축한 이유

개발 모드의 비하인드 스토리와 Figma에서 워크플로우를 더욱 효율적으로 만드는 방법을 살펴보세요.

기사 보기

개발자 핸드오프 가이드

Figma의 기능을 최대한 활용하고 디자인 전환을 개선하는 방법을 알아보세요.

기사 보기

커뮤니티 플러그인

커뮤니티에서 만든 플러그인을 살펴보고 Figma에서 작업하는 방식을 확장하세요.

플러그인 살펴보기