서비스 기획자의 피그마 꿀팁
간단한 사용법부터 능률을 올리는 꿀팁까지
이 글은 피그마를 접한 지 얼마 되지 않은 피그마꿈나무 분들을 위한 글이다.
나는 디자이너 시절에 adobe illustrator, photoshop 툴을 메인으로 사용했었고
피그마 툴의 형태가 adobe와 크게 다르지 않아서 빠르게 배울 수 있었다.
허나, 대부분의 IT 종사자들은 디자인 툴을 다뤄본 적이 없을 테니
피그마 툴을 익히는 게 쉽지 않았을 거 같다는 생각이 문득 들었다.
그런 이들을 위해 나도 헤맸던 쉽지만 누가 알려주지 않았던 사용법과
알면 기획 능률이 올라가는 꿀팁 몇 가지를 소개해볼까 한다.
누가 알려주지 않는 사용법
정말 단순한 사용법이기에 검색해도 잘 안 나오고 누구한테 물어보기도 민망한 그런 소소한 공유...
1. 배경색이 너무 밝아서 조금 어둡게 하고 싶다면?
아무것도 클릭하지 않고 우측 상단을 보면 Design 탭에 page 컬러 값을 확인 가능합니다.
인풋박스에 컬러 값을 입력하거나 컬러칩을 클릭해 원하는 색상으로 조정할 수 있습니다.
저는 흰색 frame을 올렸을 때 잘 보이지 않아서 기본적으로 [CFCFCF]로 조정하는 편입니다.
2. 원하는 항목 하나만 잡고 싶다면?
원하는 도형이나 텍스트 하나만 클릭하고 싶은데 그룹 해놔서 더블클릭 해서 클릭할 때가 있으시죠?
[Ctrl] 키를 누른 상태로 클릭하시면 하나의 항목만 클릭이 가능합니다.
3. Frame 크기 조절을 하려는데 내부 항목이 같이 조절된다면?
현상을 재현해 보려고 노력했는데 안 되는 걸 보면... 업데이트되면서 고쳐지기라도 했나 싶기는 한데 어쨌든 비슷하게 보여드리자면
이렇게 여러 항목이 얽혀있는 Frame의 경우 Frame 크기 조절을 하려고 하면
이렇게 내부 항목이 함께 조절돼서 골치 아픈 경우가 종종 있습니다.
위와 동일하게 [Ctrl] 키를 누른 상태로 Frame 크기를 조정하시면 다른 방해 없이 조정이 가능합니다.
4. 모서리가 둥근 사각형을 만들고 싶다면?
Rectangle을 그려주시고 모서리를 보시면 이렇게 둥근 원이 있는 걸 확인할 수 있습니다.
클릭하고 Rectangle 안쪽으로 마우스를 당겨주시면 이렇게 모서리가 둥글게 변하는 걸 볼 수 있습니다.
끝까지 당기시면 원형으로 만들 수도 있습니다.
한쪽 모서리만 조절하고 싶다면 [alt] 키를 누른 상태로 조절할 모서리의 원을 조정해 주시면 됩니다.
우측 Design 탭의 해당 인풋박스를 통해 숫자를 입력해 세세한 조정도 가능합니다.
능률이 올라가는 꿀팁
별 거 아닌데 업무를 쪼끔 편안하게 해주는...
1. 변경하고 싶은 텍스트가 많다면?
저는 '김엠마'인데 여기저기 '김앰마'로 잘못 입력이 되었습니다.
하나하나 찾아서 일일이 바꿔줘야 할까요?
좌측 상단 검색 필드 우측의 설정 버튼을 클릭하면 드롭다운 리스트에서 [Replace] 항목을 확인 가능합니다.
해당 항목을 클릭하시면
찾을 단어와 변경할 단어를 입력할 수 있는 필드가 생성됩니다.
여기에 찾을 단어를 임력 해주시고 '김앰마'
변경할 단어를 입력해 주시면 '김엠마'
잘못 입력된 단어를 한 번에 변경이 가능합니다.
Replace를 클릭하면 현재 선택된 단어만 변경되고
Replace all을 클릭하면 검색된 모든 단어가 한 번에 변경됩니다.
2. 원하는 레이어를 쉽게 찾고 싶다면?
너무 많은 설계서가 쌓여서 원하는 레이어를 찾기 힘들다면?
레이어 리스트에서 레이어 아이콘을 더블클릭하시면 해당 레이어로 화면이 이동됩니다.
3. Frame 크기를 조정하면서 텍스트와 선 굵기까지 함께 조절하고 싶다면?
크기를 조절하고 싶은데 그냥 조절하면 선은 두꺼워지고 글씨 크기는 그대로죠?
그럴 땐 좌측 상단 [Move] 버튼을 클릭하면 드롭다운 리스트에 [Scale] 버튼을 확인 가능합니다.
해당 버튼을 사용하셔도 되고
[K]를 입력하셔도 해당 기능이 실행됩니다.
다음에 또 플러그인이나 꿀팀을 가지고 오겠습니다.
