1. Inicio
  2. Proyectos
  3. Top Note
Con IA

Top Note

Un buscador de perfumes que entiende lo que le pides con tus palabras. Escribes «algo amaderado y cálido para el invierno, parecido a Baccarat Rouge» y te devuelve una selección razonada: qué notas tiene cada uno y por qué encaja contigo.

Qué es
Recomendador en lenguaje natural
Mi papel
Datos, búsqueda, IA, interfaz y despliegue
Tecnología
React · Gemini · Python · Vercel
Estado
Demo pública con 5.000 perfumes
Top Note: búsqueda en lenguaje natural y resultados con las notas de cada perfume

01 El problema

Los buscadores de tienda funcionan con filtros: marca, precio, familia olfativa. Pero nadie piensa así en un perfume. Piensas en «algo fresco para la oficina que no sea el típico», o en «uno como el que llevaba mi padre, pero más dulce».

Top Note traduce esa frase a una búsqueda de verdad. Y la idea sirve para cualquier catálogo difícil de filtrar: vinos, muebles, libros o repuestos.

02 En números

+30.000fragancias en el catálogo completo, unidas desde dos fuentes
80candidatos que el buscador elige antes de preguntar a la IA
−2,8 MBque dejó de descargar cada visitante al compilar la interfaz

03 Cómo funciona

Mandar treinta mil perfumes a una IA en cada búsqueda sería lento y caro. Así que la búsqueda va en dos tiempos: primero el propio navegador reduce el catálogo a unos pocos candidatos buenos, y solo esos viajan al modelo, que elige y explica.

1 · Entender

Lee tu frase

  • Aplica los filtros que marques: familia, género, temporada
  • Detecta perfumes que nombras («como Sauvage») y usa sus notas como referencia
  • Traduce palabras cotidianas a acordes: «oficina» es fresco y limpio; «dulce», vainilla y gourmand
2 · Preseleccionar

Se queda con los mejores

  • Puntúa cada perfume por coincidencias y por calidad (valoración y número de votos)
  • Máximo tres por marca, para que no te devuelva ocho de la misma casa
  • Los 80 mejores pasan a la siguiente fase
3 · Recomendar

La IA elige y explica

  • Google Gemini actúa como perfumista y reordena los candidatos
  • Responde con un formato fijo, así que la interfaz nunca recibe texto roto
  • Cada recomendación llega con sus notas y el porqué

04 Por dentro

Datos
Python · funde los catálogos de Parfumo y Fragrantica, traduce las notas y calcula perfumes parecidos
Interfaz
React + Framer Motion · scroll infinito, favoritos e historial
3D
Three.js · un frasco estilizado cuando no hay foto oficial
IA
Google Gemini · salida con esquema fijo
Servidor
Función serverless en Vercel · guarda la clave y limita el uso
Cuentas
NestJS + JWT · preparado, apagado en la demo pública

05 Decisiones que tomé

La clave de la IA nunca toca el navegador

Las búsquedas pasan por una función en el servidor que guarda la clave de Gemini. Además limita cada visitante a cinco búsquedas cada diez minutos y solo acepta peticiones de la propia web.

A cambio: un salto más en cada búsqueda. Merece la pena: una clave expuesta es una factura sin techo.

Filtrar antes de preguntar

El modelo solo ve 80 candidatos, no el catálogo entero. Así responde antes, cuesta menos por búsqueda y no puede recomendar un perfume que no existe.

A cambio: si el filtro previo descarta algo bueno, la IA no llega a verlo. Por eso el prefiltro está afinado con sinónimos y perfumes de referencia.

Compilar la interfaz en vez de hacerlo en cada visita

La primera versión traducía el código de la interfaz en el propio navegador de cada visitante: 2,8 MB de herramienta que se descargaban y ejecutaban en cada visita. Ahora se compila una vez, antes de publicar, y lo que se sirve son 136 KB.

Medir antes de dar algo por arreglado

Algunas recomendaciones desaparecían sin error. La causa: los identificadores largos se recortaban al enviarlos al modelo y luego no casaban con el catálogo. Antes del arreglo sobrevivían 0 de 8; después, 8 de 8.

La demo pública corre sobre 5.000 de los perfumes y sin cuentas de usuario: tus favoritos e historial se guardan solo en tu navegador. No escribas datos personales en la búsqueda, que se envía a Google Gemini.

Siguiente proyecto
Mi TFG · Proyecto principal

Brasa y Ascuas

Pedidos por QR, cocina en tiempo real y pagos, para un restaurante de buffet.