채팅을 넘어선 LLM UI 패턴: 비교 테이블과 트리 구조

섹션별 상세

채팅 인터페이스는 반복적인 질문이나 복잡한 비교 작업에서 정보가 파편화되고 컨텍스트가 오염되는 문제가 발생한다.

근거

채팅 인터페이스는 복잡한 작업에서 정보가 파편화되고 컨텍스트가 오염된다. — Comparison 섹션 첫 문단

비교 테이블 패턴은 항목을 행으로, 질문을 열로 배치하여 LLM이 각 셀을 채우도록 유도하며, 채팅과 스프레드시트의 장점을 결합한다.

초경량 1인용 텐트 비교 테이블 예시 — Screenshot항목(텐트 모델)을 행으로, 속성(무게, 가격, 벽 유형)을 열로 구성하여 LLM이 구조화된 데이터를 생성하는 방식을 보여준다.

등산용 여름 모자 비교 테이블 예시 — Screenshot비교 테이블이 단순 스펙뿐만 아니라 긴 판매 문구와 같은 비정형 텍스트 생성에도 활용될 수 있음을 나타낸다.

비교 테이블에서 질문은 새로운 열을 생성하고, 모델은 각 행에 대한 답변을 도구 호출 형태로 반환하여 구조화된 데이터를 유지한다.

json

{
  "name": "fill_column",
  "description": "Answer a comparison question for each item in the table.",
  "input_schema": {
    "type": "object",
    "properties": {
      "answers": {
        "type": "array",
        "items": {
          "type": "object",
          "properties": {
            "row_id": { "type": "string" },
            "value": { "type": "string" }
          },
          "required": ["row_id", "value"]
        }
      }
    },
    "required": ["answers"]
  }
}

비교 테이블의 각 행에 대한 답변을 채우기 위해 모델이 호출하는 도구 정의 예시

트리 기반 분해 패턴은 작업을 노드 단위로 확장하며, 각 분기는 부모 컨텍스트를 상속받되 독립적인 탐색 경로를 형성한다.

아기 낮잠 재우기 작업을 위한 트리 구조 분해 — Screenshot작업 목표를 상위 노드로 설정하고, 구체적인 실행 방안을 하위 노드로 확장하는 트리 기반 작업 계획 인터페이스를 보여준다.

근거

트리 구조는 각 분기가 부모 컨텍스트를 상속받되 독립적인 탐색 경로를 형성한다. — Decomposition 섹션

트리 노드는 세 가지 형태로 확장되는데, 구체적인 하위 항목을 나열하는 분해, 추가 정보가 필요한 질문, 상호 배타적인 선택지를 제공하는 옵션으로 나뉜다.

모델 호스팅 선택을 위한 의사결정 트리 — Screenshot사용자의 요구사항(파라미터 크기, 예산 등)에 따라 모델이 질문을 던지거나 선택지를 제공하여 작업을 구체화하는 과정을 나타낸다.

용어 해설

비교 테이블(Comparison Table): — LLM의 응답을 행과 열로 구조화하여 보여주는 인터페이스 패턴이다. 항목을 행으로, 사용자의 질문을 열로 배치하여 정보 파편화를 방지하고 체계적인 데이터 비교를 지원한다.
트리 기반 분해(Tree Decomposition): — 복잡한 작업을 계층적인 트리 구조로 나누어 탐색하는 방식이다. 각 노드는 독립적인 컨텍스트를 가지며, 하위 분기에서 깊이 있는 추론을 수행할 수 있어 선형적인 채팅의 한계를 극복한다.
도구 사용(Tool Use): — LLM이 외부 API나 함수를 호출하여 특정 작업을 수행하는 기능이다. 구조화된 출력(JSON 등)을 강제하여 UI 컴포넌트와 모델 응답을 긴밀하게 결합하는 데 사용된다.

기술

Kagi
gptel

활용 사례

제품 비교 테이블
작업 계획 및 분해
데이터 분석

채팅을 넘어선 LLM UI 패턴: 비교 테이블과 트리 구조

섹션별 상세

용어 해설

기술

활용 사례

관련 토론

댓글

관련 기사

Generative UI: LLM 파이프라인의 핵심 렌더링 계층

iMessage 전용 비서 'dexi' 설계에서 얻은 프롬프트·응답 흐름 교훈

LLM 성능을 극대화하는 컨텍스트 엔지니어링의 핵심 원리와 실전 가이드.

메타 프롬프팅이란 무엇이며 어떻게 작동하는가