11장. 정리와 검색의 AI — Rename layers, Smart search, Add interactions

반복 작업을 줄이면 판단이 선명해진다

디자이너의 시간을 가장 많이 잡아먹는 일은 늘 거대한 결정만은 아니다. 오히려 사소하고 반복적인 일이 하루를 잘게 부순다. Frame 184를 상품 카드로 바꾸고, 어디 있었는지 기억 안 나는 버튼 컴포넌트를 뒤지고, 프로토타입 연결선을 하나씩 이어 붙이는 일 말이다. 이런 일은 어렵지는 않지만, 이상하게 집중력을 갉아먹는다.

Figma AI가 이 장에서 다루는 세 가지 기능, 즉 Rename layers, Smart search, Add interactions는 바로 그 지점을 건드린다. 새 아이디어를 대신 내주는 도구라기보다, 손목과 인내심을 아껴 주는 도구에 가깝다. 공통점도 분명하다. 세 기능 모두 디자이너의 판단을 대체하지는 않지만, 판단하기 전에 치러야 했던 잡무를 크게 줄여 준다.¹

다만 먼저 기억할 점이 있다. 이 기능들은 계정 상태, 팀 관리자 설정, 플랜, 좌석 유형, 파일 권한, 점진 배포 여부에 따라 보이기도 하고 안 보이기도 한다. 어떤 팀에서는 툴바에 바로 나타나고, 어떤 팀에서는 아직 메뉴에 보이지 않을 수 있다. 그러니 기능이 안 뜬다고 해서 내가 뭘 잘못 눌렀다고 생각할 필요는 없다.¹²

Rename layers: 이름 짓기 노동을 한 번에 줄이기

레이어 이름 정리는 누구나 중요하다고는 알지만, 누구나 미루는 일이다. 초안 만들 때는 일단 빨리 그리고 싶고, 수정이 몰릴 때는 이름보다 화면이 먼저다. 그러다 파일이 커지면 Rectangle 53, Group 12, Frame 807이 눈덩이처럼 늘어난다. 이때 Rename layers는 아주 현실적인 구원투수가 된다.³

이 기능은 선택한 레이어의 내용, 위치, 주변 레이어와의 관계를 보고 맥락 있는 이름을 제안한다. 예를 들어 버튼처럼 보이면 버튼 이름으로, 카드 구조처럼 보이면 카드 관련 이름으로, 텍스트가 있으면 그 역할에 맞는 이름으로 바꿔 준다. 중요한 점은 그냥 글자만 읽는 것이 아니라, 그 레이어가 어디에 놓였고 무엇과 함께 있는지도 본다는 것이다.³

실무에서는 특히 네 가지 상황에서 체감 효과가 크다.

• 외부에서 가져온 지저분한 시안을 처음 정리할 때

• First Draft로 만든 초안을 사람 손으로 다듬기 전에

• 프로토타입을 만들기 직전 레이어 패널을 읽을 수 있게 만들 때

• 라이브러리 게시 전, 최소한의 위생 상태를 맞출 때

이 기능이 반가운 이유는 단순히 보기 좋게 만들어서가 아니다. 이름이 정리되면 다음 단계가 쉬워진다. 내가 다시 열어도 안 헤매고, 동료가 수정해도 덜 불안하고, 이후에 AI가 검색하거나 상호작용을 추론할 때도 힌트가 많아진다.

Rename layers가 잘하는 일과 못하는 일

여기서 기대치를 정확히 잡는 것이 중요하다. Rename layers는 파일 구조를 설계해 주는 도구가 아니라, 이미 있는 구조를 읽기 좋게 청소하는 도구다. 그래서 잘하는 일과 못하는 일이 꽤 분명하다.

잘하는 쪽부터 보자. 기본 이름이 남아 있는 프레임, 그룹, 텍스트 레이어, 이미지가 들어간 사각형, 기본 이름을 유지 중인 인스턴스 컨테이너는 꽤 잘 정리한다. 이미 최상위 프레임 여러 개에 같은 이름 없는 레이어가 반복돼 있다면, 그 레이어들을 함께 바꿔서 프로토타입 연결이나 Smart Animate, 스크롤 위치 같은 설정이 덜 깨지게 도와주기도 한다.³

반대로 못하는 일도 있다. 이미 사람이 이름을 바꾼 레이어는 기본적으로 건드리지 않고, 숨겨진 레이어나 잠긴 레이어도 건드리지 않는다. 인스턴스 내부의 서브레이어, 개별 벡터 도형, 의미 없이 복잡한 중첩 구조도 마법처럼 고쳐 주지는 못한다.³

이 말은 곧 이런 뜻이다. Rename layers를 누르면 파일이 자동으로 디자인 시스템급 구조를 갖추는 것은 아니다. 하지만 적어도 "지금 무슨 일이 벌어지고 있는 파일인지"를 레이어 패널이 말하기 시작한다. 그 차이는 생각보다 크다.

실전에서는 이렇게 쓰면 좋다. 먼저 정리하고 싶은 화면 범위를 선택한다. 너무 넓게 잡으면 결과가 퍼지고, 너무 좁게 잡으면 문맥이 부족해진다. 보통 섹션 단위나 화면 단위가 적당하다. 한 번 돌린 뒤에는 결과를 훑어보며 세 가지만 손으로 고치면 된다. 역할이 틀린 이름, 팀 규칙과 맞지 않는 표현, 컴포넌트 체계와 충돌하는 이름이다. 이미 이름이 붙은 레이어가 많다면 Rename anyway를 써서 다시 돌릴 수 있지만, 이때는 사람이 더 꼼꼼하게 검수해야 한다.³

한마디로, 이 기능은 "이름 짓기"를 없애 주는 것이 아니라 "이름 짓기의 첫 80%"를 줄여 준다.

Smart search: 기억이 아니라 맥락으로 찾기

두 번째 가속기는 검색이다. 예전의 검색은 기억력 시험에 가까웠다. 정확한 컴포넌트 이름을 알아야 했고, 어느 파일에 있었는지도 떠올려야 했다. 그런데 실제 업무는 그렇게 친절하지 않다. 우리는 종종 이렇게 기억한다. "지난달에 누가 만든 카드인데, 왼쪽에 썸네일 있고 오른쪽에 메타 정보 두 줄 있던 그거."

Figma의 AI 검색은 바로 이런 흐릿한 기억을 다루기 위해 만들어졌다. 설명으로 찾을 수 있고, 선택한 오브젝트로 비슷한 것을 찾을 수 있고, 이미지를 올려서 비슷한 디자인을 찾을 수도 있다. 또한 Assets 탭에서는 정확한 이름을 몰라도 형태나 기능이 비슷한 컴포넌트를 더 똑똑하게 찾아준다.⁴

실제로는 검색 방식이 세 갈래로 나뉜다고 생각하면 편하다.

• 키워드나 설명으로 찾기

• 캔버스 선택이나 이미지로 비슷한 것 찾기

• Assets 탭에서 컴포넌트 찾기

첫 번째는 가장 무난하다. pricing card with monthly toggle, empty state with illustration, mobile bottom nav처럼 설명형 문장으로도 찾을 수 있다. 두 번째는 더 재미있다. 캔버스에서 어떤 요소를 하나 선택하고 Find more like를 쓰면, 그 요소와 닮은 디자인을 팀 파일이나 Community에서 찾아준다. 이미지가 있는 레이어를 기준으로 검색하거나 외부 이미지를 업로드해서 찾는 것도 가능하다. 심지어 거친 스케치나 러프한 형태를 단서로 삼는 검색도 가능하다.⁴⁵

세 번째, 즉 Assets 탭 검색은 업무 속도에 가장 직접적이다. 예전에는 컴포넌트 이름을 정확히 알아야 했다면, 이제는 관련된 형태와 기능까지 넓게 찾아준다. 예를 들어 arrow를 검색했을 때 이름에 arrow가 들어간 것만 찾는 데서 그치지 않고, 화살표 역할을 하는 비슷한 컴포넌트까지 결과에 섞어 보여줄 수 있다.⁴

검색 결과를 다루는 방식도 중요하다. 결과는 현재 탭에서 미리 볼 수도 있고, 원본 파일을 새 탭으로 열 수도 있고, 지금 작업 중인 파일에 바로 삽입할 수도 있다. 즉, 검색이 단순한 "찾기"가 아니라 "찾고, 확인하고, 가져오는" 흐름으로 이어진다.⁴

Smart search를 잘 쓰는 팀의 검색 습관

여기서 중요한 사실이 하나 있다. AI 검색이 좋아졌다고 해도, 아무렇게나 만든 파일을 완벽하게 구조화해 주는 것은 아니다. 검색 품질은 결국 팀의 파일 품질을 따라간다. 이름이 일관되고, 라이브러리가 정리돼 있고, 파일 소유와 공간 구분이 명확할수록 결과도 좋아진다.⁴

실무에서 특히 유용한 검색 패턴은 세 가지다.

첫째, "새로 만들지 말고 먼저 찾아보기"다. 버튼, 모달, 토스트, 빈 상태, 표 행 같은 것은 이미 누군가 잘 만들어 놓았을 가능성이 높다. AI 검색은 이 재사용 확률을 높여 준다. 결과적으로 중복 컴포넌트가 줄고, 팀 안에서 비슷하지만 다른 버튼이 우후죽순 생기는 일도 줄어든다.

둘째, "최신 진실의 원본"을 찾는 데 쓰는 것이다. 같은 카드 컴포넌트가 여러 파일에 흩어져 있을 때, 사람은 종종 가장 먼저 눈에 띈 것을 가져다 쓴다. 하지만 AI 검색 결과에서 라이브러리 필터와 파일 맥락을 함께 보면, 지금 살아 있는 기준 컴포넌트에 더 빨리 도달할 수 있다.⁴

셋째, "예전 탐색안을 다시 살리는 도구"로 쓰는 것이다. 과거에 버렸던 시안은 버려진 것이 아니라 잠깐 쉬고 있는 경우가 많다. 설명형 검색이나 유사 디자인 검색은 이런 잊힌 자산을 다시 끌어올리는 데 특히 강하다. 팀의 집단 기억을 검색창이 대신 꺼내 준다고 생각하면 쉽다.

다만 검색 결과가 많을수록 판단은 더 중요해진다. Community 결과는 빠른 영감에는 좋지만, 바로 제품 기준으로 삼기에는 위험할 수 있다. 반대로 조직 내부 결과는 품질 기준에는 유리하지만, 낡은 파일이 섞여 있을 수 있다. 그러니 비슷하다와 지금 써도 된다는 다른 판단이라는 점을 잊지 말자.

Add interactions: 선 연결 노동에서 빨리 벗어나기

세 번째 기능은 프로토타이핑에 있다. Add interactions는 여러 프레임 사이의 기본 상호작용을 한 번에 만들어 주는 기능이다. 말 그대로 연결선을 대신 그려 준다.⁶

이 기능이 가장 빛나는 순간은 "기본 흐름만 빨리 확인하고 싶을 때"다. 회원가입 플로우, 온보딩 다음/이전, 탭 전환, 내비게이션 메뉴 연결처럼 비교적 단순한 경로는 사람이 하나씩 선을 잇지 않아도 AI가 꽤 그럴듯하게 연결해 준다. 특히 다음 버튼, 뒤로 가기 버튼, 메뉴 링크처럼 흔한 패턴에서 시간을 많이 아껴 준다.⁶

사용 흐름도 단순하다. 연결하고 싶은 최상위 프레임들을 선택한 뒤, 오른쪽 사이드바의 Prototype 탭에서 Add interactions를 실행하면 된다. 작업이 끝나면 바로 미리보기로 확인할 수 있고, 괜찮다면 Keep it으로 유지하면 된다.⁶

중요한 것은 이 기능이 "완성된 프로토타입 생성기"가 아니라 "초기 연결 초안 생성기"라는 점이다. 잘 쓰면 30분짜리 단순 연결 작업이 5분으로 줄어든다. 그리고 그 25분을 디자이너가 더 중요한 곳, 이를테면 화면 전환의 맥락, 복귀 지점, 오류 상태, 사용자 기대와의 정합성에 쓸 수 있다.

Add interactions의 정확도를 올리는 의외의 조건

재미있는 점은 상호작용 생성이 검색이나 명명과 따로 노는 기능이 아니라는 것이다. 공식 문서도 일관된 레이어 이름이 결과 개선에 도움이 된다고 말한다.⁶ 왜 그럴까. AI는 결국 프레임 안의 구조와 요소 역할을 읽고 "이건 다음 버튼 같다", "이건 뒤로 가기다", "이 메뉴는 각 화면으로 이동해야겠다"라고 추론하기 때문이다.

그래서 이 장의 세 기능은 사실 연결돼 있다. 레이어 이름이 엉망이면 검색도 흐려지고, 상호작용 추론도 약해진다. 반대로 이름이 정리돼 있고, 화면 구조가 분명하면 Add interactions는 훨씬 덜 엉뚱해진다.

실무에서는 이런 순서가 안정적이다. 먼저 Rename layers로 기본 위생을 맞추고, Smart search로 빠진 컴포넌트나 유사 패턴을 찾아 구조를 정리한 다음, 마지막에 Add interactions로 흐름을 얹는다. 이 순서를 지키면 "정리되지 않은 화면에 성급하게 연결선부터 다는 사고"를 크게 줄일 수 있다.

사람이 반드시 손봐야 하는 부분

세 기능 모두 훌륭하지만, 공통된 한계도 분명하다. AI는 반복 작업을 줄여 주지, 제품 논리를 책임져 주지는 않는다.¹

Rename layers는 팀의 네이밍 규칙까지 학습한 편집장이 아니다. Smart search는 가장 비슷한 것을 보여 줄 뿐, 가장 올바른 것을 고르지는 못한다. Add interactions는 흔한 흐름을 연결해 줄 뿐, 예외 상황과 서비스 규칙까지 이해하지는 못한다.

특히 아래 항목은 사람이 반드시 확인해야 한다.

• 컴포넌트 이름이 팀 규칙과 충돌하지 않는지

• 검색으로 가져온 자산이 최신 라이브러리 기준인지

• 프로토타입 연결이 실제 사용자 흐름과 맞는지

• 뒤로 가기, 모달 닫기, 분기 처리처럼 예외 흐름이 빠지지 않았는지

• 접근성이나 상태 전환 의도가 화면에 충분히 반영됐는지

이 검수 단계를 건너뛰면, AI는 시간을 아껴 주는 도구가 아니라 실수를 빨리 퍼뜨리는 도구가 된다. 속도는 언제나 검수와 짝을 이뤄야 한다.

20분 실전 루틴: 지저분한 파일을 발표 가능한 프로토타입으로

이 세 기능은 따로 써도 좋지만, 묶어서 쓰면 훨씬 강하다. 예를 들어 오후 회의 전, 어젯밤 급히 만든 파일을 빠르게 정리한다고 해 보자.

먼저 화면별로 범위를 잡아 Rename layers를 돌린다. 레이어 패널이 이제야 사람 말처럼 보이기 시작한다. 다음으로 Assets 탭과 유사 검색을 이용해 빠진 컴포넌트나 어색한 임시 요소를 정식 자산으로 교체한다. 여기서 이미 디자인 일관성이 꽤 올라간다. 마지막으로 주요 프레임을 선택해 Add interactions를 실행한다. 온보딩, 다음 버튼, 내비게이션 이동 같은 기본 흐름이 순식간에 연결된다.

그러고 나서 사람이 보는 것은 딱 세 가지다. 이름이 팀 언어와 맞는지, 가져온 자산이 최신 기준인지, 클릭 흐름이 제품 논리와 맞는지다. 이 20분 루틴만 익혀도 파일은 "그냥 화면 모음"에서 "설명 가능한 초안"으로 바뀐다.

이 변화가 중요한 이유는 단순히 빨라져서가 아니다. 더 이상 디자이너의 시간을 사소한 정리 노동에 다 쓰지 않기 때문이다. 우리는 그 시간으로 더 어려운 질문을 볼 수 있다. 이 흐름이 정말 이해되는가, 사용자가 여기서 망설이지 않는가, 이 컴포넌트가 팀 기준에 맞는가 같은 질문 말이다.

기억해야 할 한 문장

AI 정리 도구의 목적은 파일을 예쁘게 만드는 것이 아니라, 디자이너의 판단이 필요한 곳에 시간을 다시 돌려주는 것이다.

Rename layers는 이름 짓는 피로를 줄여 주고, Smart search는 기억력의 부담을 줄여 주고, Add interactions는 선 잇기의 지루함을 줄여 준다. 셋 다 작아 보이지만, 하루를 쪼개 먹던 작은 마찰을 줄여 준다는 점에서 아주 실용적이다.

좋은 디자이너는 모든 것을 손으로 하는 사람이 아니다. 무엇을 직접 판단하고, 무엇을 도구에게 맡길지 구분할 줄 아는 사람이다. 이 세 기능은 그 구분을 가장 빨리 체감하게 해 주는, Figma AI의 생활형 도구들이다.

참고

¹Use AI tools in Figma Design

²UI3 and AI  Figma Forum

³Rename layers with AI – Figma Learn - Help Center

⁴Find assets and designs using AI

⁵Making the move to UI3: A guide to Figma's next chapter

⁶Make interactions with AI – Figma Learn - Help Center