visual-search

2 개의 포스트

figma

Figma에서 AI 기반 검색을 (새 탭에서 열림)

디자이너들은 새로 작업하기보다 기존 디자인을 찾아 재활용하는 경우가 많지만, 스크린샷만 가지고 원본 파일을 찾기는 어려웠습니다. Figma는 이 문제를 해결하기 위해 시각 검색과 의미 검색을 결합한 AI 검색을 출시했고, 검색 결과를 디자인 작업에 바로 활용할 수 있도록 했습니다. 초기에는 다음 컴포넌트를 추천하는 ‘디자인 자동완성’을 개발했지만, 사용자 연구를 통해 기존 작업을 찾고 변형하는 일이 더 근본적인 문제라는 결론에 도달했습니다. ## 기존 디자인을 찾기 어려운 문제 - 디자이너들은 원하는 디자인의 원본 파일을 찾기 위해 Slack에 동료에게 질문하거나 여러 파일을 직접 확인해야 했습니다. - 특히 파일명이나 컴포넌트 이름을 모른 채 스크린샷만 가지고 검색해야 하는 상황이 큰 문제였습니다. - Figma 내부에서도 디자인 요소를 찾는 데 상당한 시간이 소요되고 있다는 사실을 수백 건의 Slack 메시지를 통해 확인했습니다. - 이러한 문제를 해결하기 위해 Figma는 Config 2024에서 AI 기반 검색 기능을 공개했습니다. ## 시각 검색과 의미 검색 - **시각 검색(Visual search)** - 스크린샷, 선택한 프레임, 간단한 스케치 등을 입력해 유사한 디자인과 컴포넌트를 찾습니다. - 정확한 파일명이나 텍스트를 몰라도 이미지의 시각적 특징을 기반으로 검색할 수 있습니다. - **의미 검색(Semantic search)** - 사용자의 텍스트 질의를 AI가 이해하고 관련 디자인을 검색합니다. - 컴포넌트의 정확한 이름이나 설명을 몰라도 의도와 문맥에 맞는 결과를 찾을 수 있습니다. - 검색 결과는 단순히 파일을 여는 데 그치지 않고, 디자인을 미리 보거나 현재 프로젝트에 삽입하는 방식으로 활용할 수 있습니다. ## 디자인 자동완성에서 AI 검색으로 전환 - Figma는 2023년 6월 3일간의 AI 해커톤을 열었고, 20개의 프로젝트가 완성됐습니다. - 그중 하나가 작업 중인 화면을 분석해 다음에 필요할 컴포넌트를 추천하는 **디자인 자동완성** 프로토타입이었습니다. - 예를 들어 온보딩 화면을 만들 때 “Get started” 버튼을 추천하는 방식입니다. - 이 기능은 디자이너가 반복적인 작업에서 벗어나 사용자 문제와 같은 고차원적인 사고에 집중하도록 돕는 것을 목표로 했습니다. - 프로토타입의 가능성이 확인되면서 제품 로드맵에 포함됐고, 실제 제품화를 위한 개발이 시작됐습니다. ## RAG를 활용한 검색 기반 AI - Figma는 디자인 자동완성의 품질을 높이기 위해 검색 인프라를 함께 구축했습니다. - **Retrieval-Augmented Generation(RAG)**은 LLM이 답변을 생성하기 전에 관련 사례를 검색해 참고하도록 하는 방식입니다. - 자동완성 기능이 사용자가 작업 중인 화면과 유사한 기존 디자인을 찾으면, 그 사례를 바탕으로 더 적절한 다음 컴포넌트를 추천할 수 있다고 판단했습니다. - 즉, AI가 무작정 새로운 디자인을 생성하는 것이 아니라 Figma에 축적된 실제 디자인 사례를 검색하고 이를 추천의 근거로 활용하는 구조입니다. ## 사용자 연구가 바꾼 제품 방향 - Figma는 내부 팀에 프로토타입을 공유하고 디자이너들을 대상으로 사용성 연구를 진행했습니다. - 반복적인 테스트 과정에서 디자이너들이 작업을 완전히 새로 시작하지 않는다는 패턴을 발견했습니다. - 디자이너들은 과거의 탐색 결과와 기존 작업을 다시 찾아보고, 이를 변형하거나 조합해 새로운 결과물을 만듭니다. - 이 때문에 “다음에 무엇을 추천할까?”보다 “이미 존재하는 작업 중 무엇이 유용한가?”를 찾는 일이 더 근본적인 요구로 드러났습니다. - 이러한 관찰이 디자인 자동완성 중심의 방향을 AI 검색 중심으로 전환하는 계기가 됐습니다. Figma의 사례는 AI 기능을 먼저 만들고 사용자를 설득하기보다, 실제 업무에서 반복되는 불편을 관찰한 뒤 제품 방향을 조정해야 한다는 점을 보여줍니다. 특히 검색과 생성 AI를 결합하면 기존 자산을 재활용하면서도 더 정확한 추천을 제공할 수 있으므로, 조직 내 디자인 자산이 많을수록 시각·의미 검색과 RAG 기반 활용을 함께 고려할 만합니다.

figma

Figma AI를 소개 (새 탭에서 열림)

Figma는 디자이너의 창작 정체를 해소하고 반복 작업을 줄이기 위해 Figma AI를 출시했다. 주요 기능은 이미지·영역·텍스트 기반의 Visual Search와 의미를 이해하는 AI Asset Search이며, 디자인 탐색과 재사용을 더 쉽게 만드는 것이 목표다. 베타 기간에는 무료로 제공되지만, 향후 사용량 제한과 정식 출시 후 가격 정책이 적용될 수 있다. ## Figma AI의 목표와 제공 방식 - AI를 단순한 유행이 아니라 실제 사용자 문제를 해결하는 도구로 활용한다. - 영감 탐색, 여러 디자인 방향의 실험, 반복적이고 번거로운 작업 자동화를 지원한다. - 디자인 프로세스의 어느 단계에서든 사용자가 작업을 계속 진행하도록 돕는 것을 목표로 한다. - Figma AI와 UI3는 2024년 당시 제한적 베타로 제공되며, 사용자는 Figma 화면 하단의 `?` 메뉴에서 대기자 명단에 등록할 수 있다. - 베타 기간에는 모든 사용자에게 무료로 제공되지만, 운영 비용과 사용 패턴에 따라 사용량 제한이 도입될 수 있다. - 정식 출시 시 가격 정책을 별도로 안내할 예정이다. ## 이미지와 디자인을 찾는 Visual Search - 사용자가 이미지를 업로드하거나, 캔버스의 특정 영역을 선택하거나, 텍스트 검색어를 입력하면 시각적으로 유사한 디자인을 찾아준다. - 사용자가 접근 권한을 가진 팀 내 모든 파일에서 관련 디자인을 검색한다. - 검색 결과에서 적절한 프레임을 현재 작업 중인 파일에 바로 삽입할 수 있다. - 기존 제작물이나 제품 스크린샷을 출발점으로 삼는 디자이너가 필요한 디자인을 빠르게 재사용할 수 있다. - 향후에는 Figma Community 파일까지 검색 범위를 확대할 계획이다. - 커뮤니티 리소스 검색 결과에는 원작자 표기를 제공하고, 원본 파일이나 제작자의 다른 작업으로 이동할 수 있도록 할 예정이다. ## 의미를 이해하는 AI Asset Search - Assets 패널의 기존 검색 기능을 AI 기반으로 개선했다. - 단순히 컴포넌트 이름에 검색어가 포함되는지 확인하는 대신, 검색어의 의미와 디자인 요소가 사용되는 맥락을 분석한다. - 예를 들어 `primary button`을 검색하면 실제 컴포넌트 이름이 `btn_large`처럼 되어 있어도 관련 버튼을 찾아준다. - 디자인 시스템의 명명 규칙이 일관되지 않거나 조직 규모가 커서 컴포넌트를 찾기 어려운 상황에서 유용하다. - 키워드를 정확히 기억하지 않아도 자연어에 가까운 방식으로 적절한 컴포넌트와 에셋을 탐색할 수 있게 한다. ## 디자이너의 작업 흐름을 돕는 방향 - Figma AI는 처음부터 새로 만드는 작업뿐 아니라 기존 디자인을 찾고 발전시키는 과정도 지원한다. - Visual Search는 시각적 유사성을 기반으로 영감과 재사용 가능한 결과물을 제공한다. - Asset Search는 디자인 시스템 내부의 컴포넌트를 더 직관적으로 찾도록 돕는다. - 결과적으로 탐색에 소요되는 시간을 줄이고, 디자이너가 실제 문제 해결과 창의적 의사결정에 더 집중하도록 하는 것이 제품의 방향이다. 실무에서는 팀의 디자인 시스템에 일관된 이름을 적용하는 것이 여전히 중요하지만, Figma AI의 검색 기능을 활용하면 기존 자산의 명칭이 제각각인 조직에서도 컴포넌트 탐색과 재사용 효율을 높일 수 있다.