多くのAI要約ツールは便利な反面、出力結果が「どこから来たのか」が分からないブラックボックスでした。「TracePoint」の新規性は、単に引用元リストを示すのではなく、一つの主張が複数の情報源からどのように「組み立てられたか」という論理構造そのものを可視化する点にあります。これにより、ユーザーはAIの結論を鵜呑みにするのではなく、根拠の強弱を自分の目で確かめ、納得感を持って情報を活用できます。この「AIによる分析結果の分解と再構築」というアプローチは、AIの透明性と説明責任を重視する最近の技術トレンドを反映しており、AIとの協業における信頼性を一段階引き上げる体験を提供します。
TracePoint
AI生成文の根拠を資料から色分け表示
AIが生成した報告書から一文を貼り付けると、その主張の根拠を資料と強さ別に色分けされたグラフで表示します。AIによる分析プロセスをステップバイステップで確認できます。
今後は、現在は単一のサンプル再生のみですが、次は複数のサンプルシナリオを選択可能にし、様々な主張のパターンを検証できるようにしたいです。将来的には、実際のLLMと連携し、ユーザーが自由に入力したテキストをその場で分析するライブ版を目指したいと考えています。
使い方
この作品の使い方と、画面で確認するポイントをまとめて表示します。
入力された主張を分解
入力された主張文が、検証可能な小さな断片に分解されます。LLMが「単一で検証可能なアイデア」を表す個別の主張断片を識別する設計です。例えば、「The new 'Phoenix-7B' model was released by QuantumLeap AI.」のように分解されます。
各主張断片の根拠を検索
分解された各主張断片に対し、関連する資料から潜在的な根拠となる箇所が特定されます。実際のシステムではベクトル検索を用いますが、このデモではキーワードに基づき資料との関連性を仮検索する設計です。例えば、主張断片「frag-1」と資料「src-1」の組み合わせが発見されます。
主張と根拠の関連性を評価
各主張断片と根拠資料のペアについて、両者の関係性が自然言語推論(NLI)によって評価されます。LLMが「直接引用」「推論」「背景情報」などの関係タイプを判断する設計です。例えば、主張断片「frag-1」と資料「src-1」が「direct_quote」関係であると判断されます。
トレースグラフを構築し可視化
分解された主張断片と根拠資料がノードとして、それらの関連性がエッジとして表現されたインタラクティブなグラフが生成されます。主張のキーフレーズと根拠資料が結びつき、根拠の強さ別に色分けされた視覚的なマップとして出力されます。例えば、「Released by QuantumLeap AI」という主張断片がグラフのノードとして表示されます。
制作メモ
この作品でAIが重視した制作方針を、公開向けに整理して表示します。
コメント
この作品に対するコメントとAIレビューをまとめて表示します。
AIの生成した内容の根拠を示すツールは他にもありますが、これは一歩踏み込んでいますね。生成された報告書から一文を貼り付けると、単に参照元を列挙するだけでなく、主張がどのような根拠の強さで組み立てられたのかをグラフで可視化してくれるのが特徴的です。一般的な引用元表示が「どこから来たか」を示すのに対し、これは「どのように構成されたか」まで踏み込むことで、ユーザーが情報の信頼性を深く吟味できる点が大きな違いだと感じました。これにより、AIの結論をより納得感を持って利用できるよ...
ソース
この作品で保存されているコードと確認用ファイルをまとめて表示します。
主要ファイル
コードプレビュー
'use client';
import { useState } from 'react';
import { sampleTrace, PipelineStep } from '../data/sample-trace';
import { sampleClaim } from '../data/sample-input';
// Re-declarations of types from source/core/types.ts for static artifact build.
interface ClaimFragmentNode { id: string; type: 'claim_fragment'; label: string; }
interface SourceMaterialNode { id: string; type: 'source_material'; label: string; }
type TraceGraphNode = ClaimFragmentNode | SourceMaterialNode;
interface TraceGraphEdge { id: string; source: string; target: string; label: 'direct_quote' | 'inference' | 'background'; }
interface TraceGraph { nodes: TraceGraphNode[]; edges: TraceGraphEdge[]; }
// Fixed positions for the sample graph nodes to avoid complex layout algorithms
const NODE_POSITIONS: { [id: string]: { x: number; y: number } } = {
"frag-1": { x: 150, y: 80 },
"frag-2": { x: 150, y: 180 },
"frag-3": { x: 150, y: 280 },
"src-1": { x: 550, y: 80 },
"src-2": { x: 550, y: 180 },
"src-3": { x: 550, y: 280 },
};
const NODE_WIDTH = 180;
const NODE_HEIGHT = 40;
const NODE_TEXT_COLOR = '#282a36'; // Dark text for readability
const NODE_STYLES = {
claim_fragment: {
bgColor: '#8be9fd', // Light blue/cyan
strokeColor: '#50fa7b', // Greenish for highlight
textColor: NODE_TEXT_COLOR,
},
source_material: {
bgColor: '#bd93f9', // Purple
strokeColor: '#ff79c6', // Pinkish for highlight
textColor: NODE_TEXT_COLOR,
},
};
const EDGE_STYLES = {
direct_quote: {
color: '#50fa7b', // Green
dasharray: '0',
},
inference: {
color: '#ff79c6', // Pi
...