2025년 디자이너를 위한 13가지 피그마 팁 | 매거진에 참여하세요

UI/UX 디자이너나 웹 디자이너라면 아마 Figma와 그것이 제공하는 기능에 대해 잘 알고 있을 것입니다.

하지만 Figma를 사용하면서 더 쉽게 작업을 할 수 있는 간단한 팁과 요령이 있다는 사실을 알고 계셨나요?

Figma는 디자인 및 프로토타입 세계에서 꽤 새로운 앱이지만, 2016년 출시 이후로 많은 발전을 이루었습니다.

이 클라우드 기반의 사용하기 쉬운 애플리케이션은 앱, 웹사이트, 다른 프로젝트에 통합될 수 있는 UI 컴포넌트를 디자인하는 데 유용합니다.

Figma를 꽤 오랫동안 사용해 온 저는, 종종 "이걸 좀 더 빨리 알았더라면 좋았을 것"하는 놀라운 기능들을 발견하게 됩니다.

그럼에도 불구하고 이 Figma 팁들은 작업을 훨씬 더 간단하고 빠르게 만

들어주며, 생산성도 증가시켜줍니다.

Figma가 얼마나 좋은지 알지만, 이러한 팁과 요령은 Figma로 작업을 더욱 향상시킬 수 있게 해줍니다. 그럼 이제 시작해봅시다.

Figma 팁과 요령으로 작업을 더 쉽게 만들기

Figma를 매일처럼 사용하면서 그 기능과 팀의 생산성에 대해 열정적으로 고민하는 저는 Figma가 어떻게 워크플로우를 더 빠르게 만들 수 있는지에 대해 정말 좋아합니다!

이제 Figma에서 효율적으로 작업하는 비법을 알고 싶나요? 더 이상 궁금증을 자아내지 않고, 제가 절대로 없으면 안 되는 Figma 팁과 요령을 소개합니다.

1. 자동 레이아웃 업데이트

디자인의 동적 크기 조정을 위한 새 자동 레이아웃 기능을 업데이트하거나 추가하세요.

자동 레이아웃을 사용하면 버튼, 목록, 모델 등을 쉽게 만들 수 있으며, 여러 여백과 크기 조정 규칙을 사용하여 더 복잡한 컴포넌트를 다룰 수 있습니다.

2. Nudge를 8px로 업데이트

8px의 기본 단위를 사용하는 것이 여러 가지 이유로 추천되며, 크기 조정과 간격 작업에서 일관되게 사용해야 합니다.

Figma에서 "Nudge"을 10px에서 8px으로 설정하면, 객체를 이동하거나 크기를 조정할 때 8px 단위로 조정할 수 있습니다.
이 설정은 메뉴 > 환경설정 > Nudge > 8에서 할 수 있습니다.

3. 바 그래프 아크 도구 사용

Figma 블로그에서 이 도구에 대해 읽고 나서 바 그래프 아크 도구를 처음 사용해봤는데,

최소한의 바 그래프 아크를 쉽게 만들 수 있어 예전 방식처럼 아크를 만드는 데 드는 시간을 절약할 수 있었습니다.

4. 기본 컴포넌트 관리

기본 컴포넌트를 여러 가지 변형을 사용하여 더 효율적으로 만들고 관리하세요.

각 변형은 고유의 기본 컴포넌트를 포함하여 새로운 상태를 생성합니다. 이를 통해 대규모 업데이트가 용이하고, 100% 일관성을 유지할 수 있습니다.

5. 참/거짓 논리 사용

“참/거짓” 또는 “켜기/끄기” 레이블을 사용하여 두 가지 속성 간 전환을 빠르게 할 수 있습니다.

이 작은 팁은 변형을 더 빠르게 전환하고 코드에서 다른 컴포넌트가 작동하는 방식과 유사하게 만듭니다.

6. 그리드 정리 또는 위치 변경

여러 개의 객체를 선택한 후 테이블에서 그리드 아이콘을 클릭하여 디자인을 정리할 수 있습니다.

이렇게 하면 객체들 간의 거리가 균등하게 맞춰지고, 객체를 드래그하여 재배치하고 간격을 조정할 수 있습니다.

7. 간격 일괄 편집

여러 개의 객체를 정렬하고 올바른 간격을 조정하는 것은 지루하고 시간이 많이 걸릴 수 있습니다.

하지만 Figma의 “스마트 선택” 및 “정리” 기능을 사용하면 이 작업을 대량으로 처리할 수 있습니다.

유사한 객체들을 자동으로 정렬하여 깔끔한 목록이나 그리드로 만들고, 일괄적으로 간격을 조정하거나 순서를 변경할 수 있습니다.

8. 여러 레이어 일괄 이름 변경

파일을 정리하고 모든 레이어에 대한 명명 규칙과 계층 구조를 정의하는 것이 중요합니다.

Figma의 “레이어 이름 바꾸기” 기능을 사용하면 레이어를 일괄적으로 더 빠르게 이름을 변경할 수 있습니다.

각 레이어를 동일하게 이름을 지정하거나 숫자 접미사를 추가하거나 접두어를 추가하는 등의 작업을 할 수 있습니다.

9. 파일 페이지 정리

특정 디자인이나 주요 컴포넌트를 찾는 데 시간이 많이 걸릴 수 있으며, 이는 의사소통이나 중복을 유발할 수 있습니다.

따라서 파일 페이지를 정리하여 빠르고 쉽게 탐색할 수 있게 만들고, 각 페이지는 다양한 디자인 및 문서화 목적을 위해 잘 정의된 이름을 사용하세요.

10. 키보드 단축키 사용

키보드 단축키를 사용하면 마우스를 사용하는 것보다 훨씬 빠릅니다. 사실, 거의 모든 작업은 키보드 단축키로 더 빠르게 수행할 수 있습니다.

마우스를 사용하여 고군분투하는 디자이너를 보는 것보다, 단축키를 사용하는 것이 훨씬 효율적입니다.

위의내용은 원문을 번역 및 재가공한 글입니다. 원문은 아래에서 확인하실 수 있습니다.

https://www.webdew.com/blog/figma-tips-and-tricks?utm_source=chatgpt.com

새로운 단축키를 매일 배우는 데 도전해보세요! 키보드 단축키를 보려면 화면 오른쪽 하단에서 “?”를 클릭하세요.

11. 스케일 도구 사용

스케일 도구를 사용하여 디자인을 픽셀 단위로 완벽하게 유지하려면, 크기를 조정할 객체를 모두 선택하고 키보드에서 K를 눌러 드래그하세요.

이제 모든 작업물이 완벽하게 크기 조정되며 비율을 유지하고, 다시 작업할 필요가 없습니다.

12. CMD (CTRL) +를 사용하여 잠금 해제

CMD (CTRL) + /는 워크플로우에서 시간을 절약할 수 있는 다양한 실용적인 빠른 작업을 제공합니다.

이 기능을 사용하여 모든 항목을 잠금 해제하고 글꼴을 변경할 수 있습니다.

13. 스페이스바로 더 많은 시간 절약

선택 상자를 드래그한 후 스페이스바를 누르고 있으면 커서 선택의 크기가 커집니다.

또한 도형을 그릴 때, 그리면서 객체를 이동할 수 있습니다.

이것이 충분하지 않으면 스페이스바를 누르면 Figma가 자동으로 객체를 자동 프레임이나 레이아웃 안으로 이동시킵니다.

스페이스바는 정말 유용합니다!