brunch

You can make anything
by writing

C.S.Lewis

by bom Feb 09. 2023

삶의 질이 달라지는 피그마 숨겨진 기능과 단축키

수정하고자 하는 글자 한 번에 바꾸기, 선택한 레이어만 확대 보기 등



들어가며 


UX 디자인 시 없어서는 안 될 존재가 되어버린 피그마.

익숙함에 젖어 더 이상 피그마의 새로운 기능을 

찾지 않게 될 때쯤 이슈가 터졌다.


기존에 있던 특정 텍스트를  다른 텍스트로 수정해야 한다는 것(예를 들어 dog를 cat으로 수정..�)

처음에는 하나하나 찾아가며 텍스트를 수정했지만 우리의 피그마가 한 번에 텍스트를 변환시키는 기능을 넣지 않았을 리 없다는생각이 들어 검색을 해보았다


역시나 특정 텍스트를 한 번에 수정해 주는 기능을 디폴트로 제공하고 있었고 이 기능을 통해 몇 초 만에 모든 텍스트를 수정하였다.


나만 알기에는 너무 좋은 기능이라 이 기능을 소개하면서 추가로 정말 유용하게 사용하고 있는 피그마 단축키를 공유해보려 한다.







1. 특정 텍스트를 한 번에 모-두 교체하기



UX 디자인을 하다 보면 용어가 바뀌는 경우가 많다. 예를 들어 원래는 Close를 Cancel 바꾼다던가, OK를 Confirm으로 바꾼다는 식으로 말이다

만약 컴포넌트로 저장되어 있는 버튼이라면 하나의 컴포넌트만 바꾸면 일괄 적용이 되지만 설명 문구나, 툴팁 내에 문구, 컴포넌트로 지정되어 있지 않지만 여러 곳에서 공통적으로 사용되는 단어들은 이러한 수정요청이 왔을 때 한숨이 나오기 마련이다


하지만 이를 한 번에 해결해 주는 피그마의 기능이 있다�


예를 들어 Cancel이라는 문구를 Close로 바꾼다고 했을 때


피그마로 텍스트 한 번에 바꾸기- 1




왼쪽 상단의 돋보기 모양 아이콘을 누르면



피그마로 텍스트 한 번에 바꾸기- 2



검색할 수 있는 필드가 나온다.

이 검색창에 내가 바꾸자 하는 텍스트를 쓰면 피그마는 자동으로 해당 텍스트들을 찾아준다.



피그마로 텍스트 한 번에 바꾸기- 3



아래에 있는 화살표를 눌러서 현재 페이지에서만 찾을 수도 있고 파일내의 모든 페이지에서 해당 텍스트를 찾을 수도 있다





피그마로 텍스트 한 번에 바꾸기- 4



이렇게 텍스트를 찾고 나면 오른쪽의 필터모양의 아이콘을 누른다.

이 아콘을 누르면 Replace라는 버튼이 있는데 이 버튼을 누르고





피그마로 텍스트 한 번에 바꾸기- 5


교체하고자 하는 텍스트를 쓰면 끝!

이렇게 쉽게 모든 텍스트를 한 번에 바꿀 수 있다.




피그마로 텍스트 한 번에 바꾸기 영상







2. 내가 원하는 레이어 한 번에 찾아가기


프로덕트 하나에도 정말 수십 아니 수백 개의 레이어들과 프레임이 나온다

이러다 보면 내가 보고자 하는, 수정하고자 하는 레이어를 찾아가기가 거의 숨은 그림 찾기인데

만약 각 레이어, 프레임마다 이름을 잘 설정해 두었다면 찾기가 쉬워진다.



Shift + 2를 누르고 해당 레이어를 클릭하면 자동으로 내가 클릭한 레이어로 이동된다

Shift + 1을 누르면 다시 전체화면으로 돌아온다




레이어창 한 번에 닫기


+ 나같이 정리가 안되면 스트레스를 받는 사람들은 레이어가 모두 열려있어도 스트레스인데;;

펼쳐져 있는 레이어를 모두 닫게 하는 단축키도 있다

Option(Alt) + L을 누르면 열려있는 모든 레이어들이 깔끔하게 닫힌다







3. 작업화면만 보면서 집중하기


디자인을 할 때 워크스페이스만 보고 싶다면 Command(Ctrl)+\ 을 누르자

다시 돌아갈 때에도 동일하게 누르면 끝!


워크스페이스만 보기





마치며


피그마에는 유용하게 쓰이는 단축키들도 많고, 기능들도 많다

그 중에서 오늘 소개한 텍스트 변환 기능은 알아두면 은-근 용이하게 쓰일 수 있고, 단축키는 정말 작업의 질을 높여준다


앞으로 또 습관처럼 사용하게 되는 단축키나

새롭게 알게 되는 기능이 있다면 공유하기로!! �



❤️여러분의 댓글은 큰 힘이 됩니다❤️

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari