Web App de Búsqueda Multimodal de Baja Latencia con Arquitectura MCP

Introducción

Este proyecto tiene como objetivo construir una aplicación web de búsqueda multimodal utilizando una Arquitectura MCP. La solución permite al usuario realizar consultas por voz, texto o imagen sobre una base de datos de imágenes de calzado y sus metadatos.

A continuación os enseño algunos ejemplos de cómo funciona la app.

Image Query

Text Query : Can you recommend some footwear for going to the beach?

Audio Query: Show me the most expensive shoes from the collection

Objetivos del Proyecto

El objetivo principal de este proyecto es demostrar cómo un sistema de búsqueda multimodal puede beneficiarse de una arquitectura MCP y cómo el uso de librerías como faster-whisper mejoran la latencia de la conversión de audio a texto frente a los modelos de Whisper de OpenAI.

Stack Tecnológico

• Python: Para la implementación de toda la lógica del proyecto.
• FastMCP: Para la implementación del MCP Server.
• Strands Agents SDK: Para la implementación del MCP Client.
• Faster-Whisper: Librería que proporciona los modelos de Whisper de OpenAI optimizados para CPU y GPU para la transcripción de voz a texto.
• ChromaDB: Base de datos vectorial para búsqueda de imagenes y metadatos.
• Gradio: Para la implementación de la interfaz gráfica de usuario.

Diseño e Implementación de la solución

1. Diagrama de arquitectura de alto nivel

Una diagrama de arquitectura de alto nivel permite mostrar una visión general del sistema completo antes de programarlo.

High-Level Architecture Diagram

Los componentes principales de este proyecto son:

• Frontend : La Interfaz Web permite al usuario realizar búsquedas multimodales (texto, image y audio) invocando las tools del MCP Server a través de un MPC Client . Incluye un panel para visualizar las latencias y una galería de imágenes con los resultados de la búsqueda. Cuando se realiza un búsqueda mediante voz, se visualiza la transcripción generada por el modelo de speech to text. Se incluye un componente para que el usuario seleccione el número de resultados que desea visualizar.
• Base de Datos Vectorial : Almacena colecciones de incrustaciones de imágenes (image embeddings) y sus metadatos. Mediante la búsqueda por similitud se recuperan las incrustaciones más relevantes dada una consulta del usuario. La base de datos vectorial utilizada es ChromaDB.
• Servidor MCP: Servidor que expone varias herramientas mediante el protocolo MCP. La tool text_to_image_search_tool permite la búsqueda de imágenes a partir de una consulta de texto dada por el usuario indicando una palabra clave o descripción sobre el tipo de calzado que quiere encontrar. La tool image_to_image_search_tool permite la búsqueda de imágenes a partir de una imagen proporcionada por el usuario.

2. Diagrama de Flujo de la aplicación

Un diagrama de flujo permite mostrar detalladamente como funcionan los procesos internos.

Flow Diagram

Este diagrama describe, a grandes rasgos, cómo funciona el sistema. El usuario realiza una consulta (de texto, imagen o audio), que se envía al MCP Client. Este, a su vez, invoca la herramienta correspondiente expuesta en el MCP Server. Las herramientas del servidor realizan búsquedas semánticas en una base de datos vectorial, recuperando las imágenes relevantes para la consulta del usuario.

3. Diagrama de Secuencia

Un diagrama de secuencia muestra cómo los distintos componentes se comunican e interactúan entre sí de manera secuencial o en diferentes momentos dentro de un proceso o flujo temporal.

Sequence Diagram

4. Estructura del Proyecto

El proyecto está organizado en una arquitectura modular para garantizar una clara separación de preocupaciones:

Project Structure

Búsqueda Multimodal y Multilingüe

El modelo de Whisper Base es multilingüe y permite al usuario realizar búsquedas tanto en Español como Inglés.

Spanish Audio Query: Estoy buscando zapatos rojos.

English Audio Query: I’m looking for red shoes

Conclusiones

1. Optimización de la Latencia en Modelos STT: Utilizar bibliotecas como Faster-Whisper, que optimizan los modelos de transcripción de voz mediante técnicas de cuantización, mejora significativamente la velocidad de procesamiento tanto en la unidad central de procesamiento (CPU) como en la unidad de procesamiento gráfico (GPU). La reducción de latencia a 2 segundos en promedio, en lugar de los 50 segundos que requiere el modelo original de Whisper de OpenAI, mejora la experiencia del usuario y hace que el sistema sea viable para entornos de producción.
2. Base de Datos Multimodal con ChromaDB: ChromaDB permite realizar búsquedas eficientes y escalables sobre grandes volúmenes de datos multimodales, como texto, imágenes y audio. Además, facilita el almacenamiento y la recuperación de metadatos asociados a cada imagen, lo que mejora la capacidad de búsqueda y el manejo de información relevante dentro del sistema.
3. MCP Server con Herramientas de Búsqueda en Base de Datos Vectorial: Una lección clave es que un servidor MCP puede exponer herramientas de búsqueda directamente conectadas a una base de datos vectorial.

Referencias

[embed]faster-whisper Faster Whisper transcription with CTranslate2pypi.org

[embed]GitHub - SYSTRAN/faster-whisper: Faster Whisper transcription with CTranslate2 Faster Whisper transcription with CTranslate2. Contribute to SYSTRAN/faster-whisper development by creating an account…github.com

[embed]Model Context Protocol (MCP) - Strands Agents AI-powered agents for modern workflowsstrandsagents.com

[embed]Chroma Docs Documentation for ChromaDBdocs.trychroma.com