Hugging Face · LLM Course · Capítulo 9

Demos con Gradio: de una función de Python a una UI compartible

Todo lo anterior asumía que interactuás con tu modelo desde código. Este capítulo es la capa que le pone una interfaz — sin escribir HTML, CSS ni JS.

1. Por qué armar una demo

Una demo no es solo para mostrar — es una herramienta de trabajo: le permite a gente no técnica probar tu modelo sin tocar código, a vos encontrar fallos de forma interactiva mucho más rápido que revisando logs, y a cualquiera notar sesgos del modelo con inputs que vos nunca hubieras pensado probar.

2. Tu primera demo con `Interface`

Tres argumentos alcanzan para envolver cualquier función de Python en una UI web:

import gradio as gr

def saludar(nombre):
    return f"Hola {nombre}!"

gr.Interface(fn=saludar, inputs="text", outputs="text").launch()

fn es tu función de predicción; inputs/outputs declaran qué tipo de componente usar — texto, imagen, audio (como un array de NumPy), varios inputs o outputs a la vez. Enchufar un modelo real es la misma idea, con fn llamando a un pipeline() del Capítulo 1 en vez de a un saludo:

generator = pipeline("text-generation", model="HuggingFaceTB/SmolLM2-360M")

def predict(prompt):
    return generator(prompt)[0]["generated_text"]

gr.Interface(fn=predict, inputs="text", outputs="text").launch()

3. Compartir: link temporal o Spaces

	Link temporal	Hugging Face Spaces
Cómo	`launch(share=True)`	Repo dedicado en huggingface.co/spaces
Dura	72 horas	Permanente
Para	Mandarle un link a alguien ya	Publicar algo que la gente vaya a volver a usar

Antes de compartir, vale la pena pulir la demo: título, descripción, ejemplos precargados de input — todos argumentos directos de Interface, sin trabajo extra.

4. Cargar directo desde el Hub

Interface.load("modelo/nombre") arma la demo completa a partir de un modelo del Hub sin que escribas la función de predicción vos — Gradio infiere la tarea y el tipo de input/output. Lo mismo funciona apuntando a un Space existente, que podés cargar y hasta modificar.

🟢 Actualización 2026

Cargar el modelo directamente en el mismo proceso que la demo (lo que hace Interface.load por default) funciona bien para modelos chicos. Para un LLM de verdad, el patrón de hoy es separar las dos cosas — la demo de Gradio solo hace requests HTTP a un servidor de inferencia ya corriendo (vLLM, TGI, Capítulo 2), en vez de cargar el modelo dentro del propio proceso de la UI. Mismo resultado para quien usa la demo, pero el modelo pesado vive en su propio proceso, reiniciable y escalable aparte.

5. State e interpretación

Por default, cada llamada a fn es independiente — no recuerda nada de la anterior. gr.State le da persistencia entre interacciones dentro de la misma sesión: el ingrediente mínimo para armar un chatbot, que necesita recordar los turnos anteriores de la conversación.

interpretation="default" (o basada en Shapley) le agrega a la demo una vista de qué parte del input pesó más en la predicción — útil para no tratar al modelo como una caja negra ni siquiera en la etapa de demo.

6. Blocks: la API de bajo nivel

Interface alcanza para "una función, unos inputs, unos outputs". Para layouts custom, demos de varios pasos, o actualizar un componente en respuesta a otro, gr.Blocks da control total sobre filas, columnas y qué evento dispara qué función — es, literalmente, la capa sobre la que está construido cualquier componente de más alto nivel de Gradio, incluido el ChatInterface moderno para chatbots.

🔧 Por qué tu propio proyecto no usa Gradio

La UI de interpretante-lacaniano está hecha en Streamlit, no Gradio — y la razón encaja con la distinción de esta sección. Gradio brilla envolviendo una función de predicción aislada rápido; tu proyecto necesita múltiples paneles con estado propio (rating 👍/👎 persistente, historial de diálogos, disparar el daemon generativo), más cerca de una aplicación completa que de una demo de un modelo. Ambos frameworks resuelven "UI en Python sin escribir JS" — la diferencia es cuánta estructura de app necesitás por encima de "mostrame la salida del modelo".

7. Resumen

Interface(fn, inputs, outputs) envuelve cualquier función de Python en una UI web en minutos.
Compartir es un link de 72 horas para algo rápido, o un Space permanente para publicar en serio.
Interface.load() arma la demo sola a partir de un modelo o Space del Hub — hoy, para LLMs, mejor apuntando a un servidor de inferencia separado que cargando el modelo en el proceso de la UI.
State es lo mínimo que necesitás para un chatbot; Blocks es lo que necesitás para cualquier cosa más compleja que una función aislada.