피그마
협업을 위한 인터페이스 디자인 제품을 찾는다면
매일 같은 기능만 쓰는 당신에게, 피그마가 준비한 놀라운 업데이트 3가지
새로운 기능으로 업무 속도 높이기!
5년차 인하우스 디자이너 킴에게 피그마는 공기 같은 존재예요.
평소 동료들에게 일잘러, 알잘딱깔센으로 불리는 킴은 늘 더 효율적인 방법이 무엇일지 고민하는 사람이에요.
익숙한 것에 머무르지 않고 늘 새로운 기능을 가장 먼저 살펴보고 적용하며 활용하는 게 그녀의 비법이죠.
최근 피그마 컨퍼런스에 다녀온 후 이전과는 다른 신세계를 맛보고 있는 킴은 여전히 매일 같은 기능만 쓰고 있는 동료들을 위해
핵심 업데이트 기능 꿀팁을 알려주려 해요. “도와줘 일잘러 킴!!”
🙋🏻♀️
안녕하세요, 킴이에요! 오늘은 피그마 컨퍼런스에서 얻은 신선한 소식들을 들고 왔어요.
동료 여러분들이 더 빠르고 효율적으로 일할 수 있도록 제가 직접 써보고 엄선한 기능들만 모아서 소개할게요.
1. 생성형 AI
당신의 작업 속도를 10배로
피그마의 생성형 AI 기능은 디자이너뿐만 아니라 개발자, 기획자, 마케터까지 모두가 반길 만한 도구예요. 반복되는 작업을 자동화해 주는 기능들로 작업 속도를 눈에 띄게 빠르게 만들어주죠. 특히, 이미지 서칭부터 자동 레이어 이름 변경, 자동 프로토타입 설정까지 다양한 자동화 기능이 포함되어 있어요.
이미지 서칭: 필요한 이미지를 인터넷에서 검색하느라 시간을 낭비할 필요가 없어요. AI가 피그마 내에서 바로 이미지 추천을 해주니까, 클릭 몇 번만으로 작업이 끝나죠. 예를 들어, 클라이언트가 '자연스러운 느낌의 배경'을 요청했을 때, AI 검색을 통해 즉시 적합한 이미지를 찾아 적용할 수 있어요. 게다가 특정 이미지로 이전 작업물 중에 비슷하거나 동일한 이미지를 손쉽게 찾을 수 있고, 펜 툴로 그린 간단한 손그림으로 원하는 에셋을 검색할 수 있답니다.
이미지 서칭 기능 버튼 모습
자동 레이어 이름 변경: 레이어가 많아질수록 이름을 일일이 정리하는 게 스트레스였죠? 이제 AI가 적절한 이름을 자동으로 부여해줘요. 복잡한 파일을 정리하고, 레이어 구조를 명확하게 만들어 주어 프로젝트의 복잡도가 높을수록 이 기능은 더욱 유용해질 거예요.
자동 레이어 이름 변경 기능 모습
자동 프로토타입 설정 기능 모습
💡Tip
실무에서 자주 발생하는 '긴급 수정' 상황에서 특히 유용해요.
AI가 작업 흐름을 파악하고 제안하기 때문에, 짧은 시간 안에 대안을 제시하거나 시안을 정리할 때도 속도가 나죠.
팀 프로젝트에서 여러 명이 동시에 작업하는 경우에도 일관성 있는 레이어 정리로 협업이 훨씬 매끄러워질 거예요.
2. 피그마 슬라이드 기능
디자인과 발표 자료를 한 번에!
피그마에서 프레젠테이션 자료를 만들어오셨던 분들, 주목하세요! 이제 디자인 작업부터 발표 자료까지 한 번에 해결할 수 있는 슬라이드 기능을 무료 오픈 베타로 사용할 수 있어요. 따로 디자인 파일을 복사해 슬라이드로 옮기는 번거로운 과정은 더 이상 필요하지 않죠. 피그마 안에서 모든 작업을 효율적으로 처리할 수 있답니다.
슬라이드 작성: 디자인한 요소를 그대로 슬라이드에 삽입할 수 있어요. 예를 들어, 마케터나 기획자분들은 피그마에서 작업한 디자인과 데이터를 바로 슬라이드로 끌어와 발표 자료를 만들 수 있어요. 별도로 PPT로 옮기지 않아도 된다는 점이 정말 큰 장점이에요.
디자인 일관성 유지: 발표 자료에서도 디자인의 일관성을 유지하는 것이 중요하죠? 피그마 슬라이드에서는 템플릿 스타일 기능을 통해 글꼴과 색을 한 번에 모두 정돈할 수 있어요. 배경색을 어둡게 바꾸면 자동으로 글씨가 흰색으로 변하고, 밝은 배경색에서는 검은 글씨로 바뀌는 기능도 일일이 수정하는 수고를 덜어주어 유용해요.
프로토타입 삽입 기능: 피그마 슬라이드에서 제가 제일 좋아하는 기능 중 하나는 인터랙티브 프로토타입을 바로 삽입할 수 있다는 점이에요. 프로토타입 영상을 따로 제작하거나 다운로드받을 필요 없이 피그마에서 작업한 프로토타입을 바로 슬라이드에 연결해 발표 중에도 실시간으로 시연할 수 있거든요. 따로 파일을 관리하지 않아도 되고, 작업한 그대로를 보여줄 수 있어 효율적이에요.
💡Tip
슬라이드 작업 시 무한 캔버스인 그리드 뷰를 활용하면, 한 눈에 전체 프레젠테이션 구성을 확인하고, 쉽게 구성과 내용을 수정할 수 있어요.
파워포인트나 구글 슬라이드에서 위아래로 끊임없이 스크롤해야 했던 번거로움이 사라졌죠.
3. Dev Mode
디자이너와 개발자의 간극을 좁혀줘요!
피그마 Dev 모드는 디자이너와 개발자의 협업 프로세스를 혁신적으로 바꿔줄 기능이에요. 디자인 파일을 개발자에게 넘겨주고 나면, 수정 사항을 일일이 설명하거나 피드백을 기다리는 데 많은 시간을 쏟곤 했죠. 이제 Dev 모드를 사용하면 개발자가 디자인 사양을 빠르게 파악하고, 바로 작업에 착수할 수 있어요.
자동 코드 생성: 디자인을 코드로 변환하는 과정이 훨씬 간소화되었어요. CSS, Swift, Android 코드 등을 피그마 내에서 바로 확인할 수 있어, 개발자는 디자이너의 의도를 정확히 이해하고 즉시 적용할 수 있답니다. 디자이너가 의도한 인터랙션이나 레이아웃이 그대로 구현되니, 커뮤니케이션에서 발생하는 불필요한 수정 요청도 줄어들어요.
디자인 사양 자동 확인: 개발자는 여백, 색상, 크기와 같은 세세한 사양을 따로 요청할 필요 없이, 피그마 내에서 직접 확인할 수 있어요. 덕분에 디자이너는 개발자가 자주 묻는 질문에 일일이 답할 필요가 없어졌죠. 빠른 피드백을 받을 수 있는 것은 물론이고, 불필요한 커뮤니케이션을 최소화할 수 있어요.
실시간 업데이트: 디자인이 수정될 때마다 별도의 파일을 넘겨줄 필요 없이, 개발자는 실시간으로 변경 사항을 바로 확인할 수 있어요. 이 기능은 디자인 수정이 잦은 프로젝트나 빠른 피드백이 필요한 상황에서 특히 유용하죠.
💡Tip
Dev Mode를 잘 활용하려면, 디자인 시스템과 함께 사용해 공통 컴포넌트나 색상 팔레트를 미리 설정해 두세요!
실시간 피드백 기능을 활용해 수정 사항이 있을 때 빠르게 반영할 수 있습니다. 디자인 스펙은 가능한 한 명확하게 정리해 두어야 자동 생성된 코드가 의도에 맞게 구현된답니다. 코드 확인 시 필요한 레이아웃도 미리 설정해 개발팀의 추가 요청을 줄일 수 있어요.
이제 피그마의 새로운 기능들을 활용해 여러분의 업무 속도를 더욱 높여보세요.
디자인부터 협업, 발표 자료 준비까지 모든 걸 한 번에 처리할 수 있는 기능들로, 더 효율적이고 체계적으로 작업할 수 있을 거예요.
킴의 꿀팁을 참고해 실무에서 바로 적용해 보세요!