AI 기반 코드 편집기인 커서 AI는 개발자가 대화를 주고받는 과정에서 데이터 시각화 결과를 즉각 확인하도록 기능을 확장하고 있다. 기존의 텍스트 중심 답변을 넘어, 에이전트 창에서 분석된 데이터를 차트와 다이어그램 형태로 직접 시각화하는 방식이다. 개발자는 코딩 작업 중 데이터 흐름을 직관적으로 파악하고, 복잡한 아키텍처를 빠르게 시각적 자산으로 전환할 수 있다. 이번 글에서는 커서 AI의 시각화 기능과 지원 환경, 활용 방안을 상세히 다룬다.
커서 AI와 시각화 기능의 등장
Visual Studio Code를 기반으로 제작된 커서 AI는 프롬프트 입력을 통해 코드를 작성하고 수정하는 데서 더 나아가 데이터 시각화 영역으로 기능을 넓혔다. 개발자는 AI와 대화하며 차트나 다이어그램을 즉석에서 생성할 수 있다.
특히 에이전트 창 내에서 시각화 명령을 활용하면, AI가 데이터셋을 직접 분석한 뒤 그 결과를 채팅 창 안에서 그래프로 렌더링한다. 데이터 흐름을 다이어그램으로 정리하거나 데이터셋 분석 결과를 직관적으로 살피는 작업이 인라인 인터페이스 내에서 한 번에 이루어진다.
에이전트 창과 시각화 지원 버전
커서 AI의 에이전트 창은 커서 3 버전에서 새로 도입된 AI 전용 인터페이스다. 텍스트 위주의 정보를 제공하던 이전 방식과 달리, 캔버스 형태를 채택하여 시각적 정보를 손쉽게 탐색하도록 설계했다. React 기반 UI 라이브러리를 통해 테이블, 상자, 차트를 캔버스 위에서 렌더링한다.
시각화 명령인 /visualize 기능은 커서 3.1 버전부터 정식 지원된다. 이에 앞서 커서 2.2 버전부터는 머메이드 다이어그램의 실시간 렌더링이 적용되었다. 이처럼 버전 업그레이드에 따라 시각적 피드백 기능이 지속적으로 강화되고 있다.

지원되는 모델과 라이브러리
개발자는 작업 목적에 맞춰 다양한 최신 AI 모델을 선택해 시각화 작업을 진행할 수 있다. 대표적으로 오픈에이아이의 GPT-4, 클로드, 구글 제미나이 등의 주요 모델을 커서 AI 환경 내에서 자유롭게 선택하여 활용한다.
시각화 코드 생성 능력도 다채롭다. 데이터 분석에 자주 쓰이는 맷플롯립, 플롯리, 시본 등 주요 데이터 시각화 라이브러리 코드를 자동으로 작성한다. 생성된 라이브러리 코드는 표준 데이터 시각화 모범 사례를 따르도록 지시되어 있어 완성도 높은 결과물을 얻을 수 있다.

다이어그램 언어와 프로젝트 활용
시각화 기능은 단순 그래프에 그치지 않고 머메이드와 D2 다이어그램 언어를 통한 흐름도 및 아키텍처 설계까지 지원한다. 프롬프트나 기존 코드베이스, 제품 요구사항 문서(PRD)에서 다이어그램을 바로 추출할 수 있다.
생성한 다이어그램은 마크다운 파일 형태로 프로젝트에 저장할 수 있으며, 개발자는 @ 심볼을 이용해 해당 문서를 참조하는 방식으로 작업 효율을 높인다. 다만 생성되는 차트의 구체적인 정확도 수치나 데이터 변경 시 자동 재렌더링 여부는 아직 확인되지 않았다. 개발자는 자동 생성된 다이어그램을 마크다운으로 체계적으로 관리하며 코드베이스 이해도를 높이는 도구로 활용하는 것이 바람직하다.
참고
댓글 0개
아직 댓글이 없습니다. 첫 댓글을 남겨보세요.