Skip to content
KHemanthRaju edited this page Nov 18, 2025 · 1 revision

User Guide

This guide will walk you through using the RAG Process Visualizer to understand the RAG pipeline.

Getting Started

1. Document Input

The first step is to input your document:

  1. Enter Text Manually: Type or paste your document text into the text area
  2. Use Sample Documents: Click on any of the sample documents to load them instantly
  3. Configure Chunk Size:
    • Use the slider or number input to set chunk size (50-500 characters)
    • Smaller chunks = more granular, larger chunks = more context
    • Default is 200 characters
  4. Process Document: Click "Process Document" to begin

2. Chunking Stage

After processing, you'll see:

  • Chunk Count: Number of chunks created
  • Chunk Size: The configured chunk size
  • Chunk Preview: Visual cards showing each chunk with its content

The chunks are created by splitting the document at sentence boundaries while respecting the chunk size limit.

3. Embedding Generation

This is a manual step - you control when embeddings are generated:

  1. Review the chunks created
  2. Click "Generate Embeddings" button
  3. Watch as chunks are converted to vector embeddings
  4. View embedding statistics:
    • Total vectors created
    • Vector dimensions (384)
    • Sample vector preview

4. Vector Database Storage

Before querying, you must store embeddings:

  1. Click "Store in Vector Database" button
  2. Wait for the storage process to complete
  3. You'll see a success message confirming storage
  4. The query stage will now be enabled

5. Query Processing

Once embeddings are stored:

  1. Enter your query in the search box
  2. Or click a sample query to load it
  3. Click "Search & Generate"
  4. The system will:
    • Embed your query
    • Search for similar chunks
    • Retrieve top matches

6. Retrieval Results

You'll see:

  • Query Display: Your original query
  • Relevant Chunks: Top 3 most relevant chunks
  • Similarity Scores: Percentage match for each chunk
  • Ranking: Chunks ordered by relevance

7. Generation

The final stage shows:

  • Generated Response: AI-generated answer based on retrieved context
  • Context Used: The chunks that informed the response
  • Source Tracking: See which chunks contributed to the answer

Pipeline Tracker

At the top of the page, you'll see a Pipeline Progress Tracker that shows:

  • Green: Completed stages
  • 🔵 Blue (Pulsing): Currently active stage
  • Gray: Pending stages

This gives you a real-time view of where you are in the pipeline.

Tips for Best Results

Chunk Size Selection

  • Small chunks (50-150): Better for precise, specific queries
  • Medium chunks (150-300): Good balance for most use cases
  • Large chunks (300-500): Better for queries requiring more context

Query Formulation

  • Be specific and clear
  • Use keywords from your documents
  • Ask complete questions rather than fragments

Multiple Documents

You can process multiple documents:

  1. Process first document
  2. Generate embeddings
  3. Store in Vector DB
  4. Process additional documents
  5. Generate and store their embeddings
  6. All documents will be searchable together

Resetting the Pipeline

Click the "Reset Pipeline" button to:

  • Clear all documents
  • Remove all chunks and embeddings
  • Start fresh with a new pipeline

Understanding the Visualizations

Color Coding

  • 🔵 Blue: Document input stage
  • 🟡 Yellow: Chunking stage
  • 🟣 Purple: Embedding generation
  • 🟢 Teal: Vector DB storage
  • 🟢 Green: Query processing
  • 🟠 Orange: Retrieval stage
  • 🟣 Indigo: Generation stage

Animations

  • Pulsing borders: Indicate active processing
  • Fade-in effects: Show new content appearing
  • Progress bars: Display similarity scores
  • Flow connectors: Show pipeline progression

Next Steps

Clone this wiki locally