¿Qué es MCP?
MCP es un protocolo abierto que permite a los asistentes de IA conectarse a herramientas externas. Cuando conectas Claude al server MCP de Faces, Claude puede:- Crear un proyecto en blanco para iniciar una nueva presentación (en tu equipo personal o en cualquier equipo al que pertenezcas)
- Listar los equipos a los que perteneces para que el asistente elija el correcto
- Listar y explorar tus proyectos existentes (incluyendo proyectos compartidos en equipo)
- Leer y editar diapositivas individuales: inspecciona los archivos fuente de una diapositiva y escribe otros nuevos. Funciona para cualquier proyecto del que seas propietario, miembro de equipo (en proyectos compartidos del equipo) o editor invitado
- Definir el sistema de diseño del proyecto: la paleta y las fuentes compartidas en todas las diapositivas
- Adjuntar plugins a una diapositiva, como un formulario de contacto o un presentador de video con IA en vivo
- Capturar una diapositiva para verificar visualmente el diseño, el espaciado y la tipografía después de editar
- Publicar o despublicar un proyecto y leer su URL en vivo
Herramientas disponibles
Sesión y modo agente
| Herramienta | Descripción |
|---|---|
get_user_state | Lee tu estado en vivo del editor en las pestañas abiertas del navegador: el proyecto que estás viendo, la diapositiva seleccionada y si el modo agente está activado. El asistente lo llama primero para saber en qué proyecto estás trabajando. |
start_agent_mode | Activa el “modo agente” para un proyecto en tu navegador: oculta la barra lateral derecha y muestra una barra flotante que indica que un agente está dirigiendo la sesión. Pasa enabled: false para desactivarlo. Siempre puedes desactivarlo manualmente. |
Equipos
| Herramienta | Descripción |
|---|---|
list_teams | Lista los equipos a los que perteneces. Devuelve id, slug, name, role e isPersonal. Usa el id del equipo al llamar a create_project. |
Proyectos
| Herramienta | Descripción |
|---|---|
create_project | Crea un nuevo proyecto en blanco. Devuelve el projectSlug y la editorUrl. Acepta un teamId opcional, omítelo para usar tu equipo personal, o pasa un id de list_teams para crear el proyecto bajo un equipo específico. |
list_projects | Lista los proyectos a los que tienes acceso (propios, compartidos en equipo o compartidos contigo) con paginación (cursor, limit, published). |
get_project | Obtiene los detalles y las URLs de un proyecto a partir de un slug. |
rename_project | Renombra un proyecto. El slug y las URLs se mantienen iguales. |
duplicate_project | Crea una copia completa de un proyecto, incluyendo todas las diapositivas. Devuelve un nuevo projectSlug y una nueva editorUrl. |
Sistema de diseño
| Herramienta | Descripción |
|---|---|
get_project_config | Lee project.config.json, incluidas las opciones de diseño y los tokens del sistema de diseño compartidos (colores de la paleta y fuentes) usados en todas las diapositivas. |
update_project_config | Actualiza project.config.json, por ejemplo para definir la paleta y las fuentes del proyecto antes de estilizar las diapositivas. Solo se modifican las claves que pasas. |
Publicación
| Herramienta | Descripción |
|---|---|
publish_project | Publica la última versión de un proyecto, haciéndolo accesible públicamente. Devuelve la publishedUrl. |
unpublish_project | Saca de línea un proyecto publicado. El proyecto y sus diapositivas se conservan. |
get_project_url | Obtiene la URL en vivo actual de un proyecto (subdominio o dominio personalizado más ruta) y los subdominios y dominios disponibles para cambiar. |
Diapositivas
| Herramienta | Descripción |
|---|---|
list_slides | Lista todas las diapositivas de un proyecto. Devuelve los IDs y nombres de las diapositivas. |
get_slide | Lee los archivos fuente de una diapositiva (face.tsx, face.content.json, face.controls.json). |
create_slides | Crea una o más diapositivas vacías en orden en una sola llamada atómica. Devuelve los nuevos slideIds en el mismo orden. Pasa editing: true para mostrar el gradiente de carga en cada nueva diapositiva inmediatamente. |
reorder_slides | Reordena todas las diapositivas de un proyecto en una sola llamada atómica. Pasa la lista completa de slideIds existentes en el orden final deseado. Úsalo para reestructurar un deck existente; nunca elimines y recrees diapositivas solo para reordenarlas. |
update_slide | Actualiza los archivos fuente de una diapositiva. Valida y compila antes de guardar; devuelve errores si el código no compila. |
start_slide_editing | Muestra el gradiente de carga en el editor antes de hacer ediciones. |
finish_slide_editing | Limpia el gradiente de carga después de editar (llámalo siempre, incluso si falla). |
view_slide | Toma una captura de pantalla de una diapositiva y la devuelve como imagen para que el asistente pueda verificar visualmente el diseño, el espaciado y la tipografía. Pasa isMobile: true para el diseño móvil. |
get_slide_guide | Obtiene la referencia completa de autoría de diapositivas (formatos de archivo, tipos de bloque, controles, tipografía, ejemplos). Llámalo antes de escribir código de diapositivas por primera vez. |
Plugins
| Herramienta | Descripción |
|---|---|
list_plugins | Lista los plugins disponibles para adjuntar a una diapositiva: comportamientos en tiempo de ejecución que el código de una diapositiva no puede expresar por sí solo, como recopilar envíos de formularios o incrustar un presentador de video con IA en vivo. |
get_plugin_docs | Obtiene el esquema de configuración de un plugin, las funciones que expone y ejemplos de código que muestran cómo una diapositiva lo llama. Léelo antes de setup_plugin. |
setup_plugin | Configura una instancia de plugin en una diapositiva. La configuración se valida contra el esquema del plugin y se escribe en el face.plugins.json de la diapositiva; las demás instancias se conservan. |
Construir una nueva presentación
get_slide_guide: lee la referencia de autoría (solo la primera vez)- (Opcional)
list_teams: si el usuario podría querer el proyecto en un equipo específico, lístalos y pregunta. Si no, omite este paso y se usará el equipo personal. create_project({ name, teamId? }): devuelveprojectSlugyeditorUrl- (Recomendado)
update_project_config({ projectSlug, config }): define el sistema de diseño compartido (paleta y fuentes) antes de estilizar las diapositivas, para que todas se mantengan consistentes. create_slides({ projectSlug, slides: [{ name }, ...], editing: true }): UNA sola llamada con todas las diapositivas que planeas añadir, en orden. Devuelve los nuevosslideIds. Nunca llames a esta herramienta en bucle o en paralelo para el mismo proyecto.- Por cada
slideIddevuelto (en paralelo o secuencialmente):update_slide({ projectSlug, slideId, files }): escribeface.tsx,face.content.json,face.controls.jsonview_slide({ projectSlug, slideId }): captura la diapositiva para verificar que se renderiza como se pretendefinish_slide_editing({ projectSlug, slideId }): limpia el gradiente de carga
- Comparte la
editorUrlcon el usuario.
Editar una diapositiva existente
- (Opcional)
get_user_state: descubre qué proyecto y diapositiva tiene abiertos actualmente el usuario get_slide_guide: si aún no la has leídostart_slide_editing(slideId)get_slide(slideId): lee los archivos actualesupdate_slide(slideId, files)view_slide(slideId): verifica el resultado visualmentefinish_slide_editing(slideId)
Autenticación
El server MCP usa OAuth para la autenticación. Cuando te conectes por primera vez, se te pedirá iniciar sesión en tu cuenta de Faces a través del navegador. No necesitas gestionar API keys, el flujo OAuth se encarga de todo automáticamente. Como MCP se autentica por cuenta (no por equipo), los nuevos proyectos se crean por defecto en tu equipo personal a menos que el asistente pase unteamId explícito desde list_teams. Esto es diferente a la REST API y al CLI, que se autentican con API keys asociadas a un equipo y siempre crean proyectos bajo el equipo de la key. (Para el CLI, el equipo se elige con faces login --team <slug-or-id>; para las API keys REST, en Settings > Developers del panel.)
Control de acceso
Las herramientas MCP respetan el mismo modelo de permisos que el resto de Faces:- Propietario del proyecto: acceso completo de lectura/escritura.
- Proyectos compartidos en equipo: cualquier miembro del equipo propietario puede leer y editar.
- Colaboradores invitados: pueden leer; solo los colaboradores con permiso de edición pueden actualizar diapositivas.