# Personalizar la experiencia de Soporte de chat del usuario

### Productos

* Zoom centro de contacto
* Zoom Virtual Agent

### Requisitos previos

[Incorpore el SDK de Campaign en su sitio web o aplicación móvil](https://developers.zoom.us/docs/contact-center/web/chat/#embed-the-chat-client-with-a-campaign-id)

### Descripción general

Su ventana de chat suele ser la primera interacción real que un cliente tiene con su empresa, ya sea que esté chateando con un agente virtual o en vivo. Con Zoom centro de contacto y Zoom Virtual Agent, tiene control total sobre cómo se ve y funciona esa experiencia en su sitio web.

Esta guía le mostrará todas las herramientas disponibles para ayudarle a diseñar una experiencia de chat que coincida con su marca, mejore la usabilidad y mantenga a los clientes comprometidos.

### Crear un plan

Su interfaz de usuario de chat debe sentirse como una extensión natural de su sitio web o aplicación. Al planificar el diseño de su interfaz de usuario de chat, considere lo siguiente:

* **Colores:** ¿Cuáles son los colores primarios y de acento de su empresa? Use estos colores para distintos elementos de su experiencia de chat, como los globos de chat, iconos, botones y colores de fondo. Seleccione los colores usando códigos hexadecimales (por ejemplo, #FFFFFF), así que es útil tener a mano los códigos de su marca.
* **Fuentes:** Haga coincidir la tipografía de su sitio para mantener la coherencia. Puede seleccionar entre varias fuentes comunes o cargar su propio archivo TTF para añadir una fuente personalizada.
* **Logotipo:** Considere agregar su logotipo o imagen de empresa a su experiencia de chat. Puede cargar un archivo JPG/JPEG, PNG, SVG o GIF de hasta 10 MB. Según el diseño de chat que Seleccione, hay dimensiones de imagen recomendadas; más sobre eso a continuación.
* **Avatar:** Un avatar es la representación en imagen del bot o agente. Para mensajes del bot o del sistema, use su logotipo o un personaje/avatar que represente su marca. Similar a los favicons en los navegadores web, estos íconos son pequeños, pero marcan la diferencia en la experiencia cuando están bien alineados con la marca de la empresa. Los avatares tienen un tamaño de 40 x 40 píxeles, y puede cargar un archivo JPG/JPEG, PNG, SVG o GIF de hasta 2 MB.

### Las partes

[El generador de campañas de Zoom](https://zoom.us/cci/index/admin#/admin-campaign-management) se utiliza para personalizar tanto el diseño de su chat como su disponibilidad en su sitio web o aplicación.

En Campañas, configurará:

* **Ventana de interacción de chat:** Utilizada por los consumidores para chatear con su bot o agente. Puede Seleccione el diseño de todos los globos, botones, íconos y el diseño del encabezado. La ventana de chat tiene un gran impacto en el aspecto general de su experiencia de Soporte digital.
* **Ubicación:** Te permite controlar dónde debe estar disponible tu soporte en tu sitio (asegúrate de incrustar primero el Campaign SDK). Puedes ofrecer soporte en todo tu sitio o especificar qué páginas deben incluirse o excluirse según la URL.
* **Invitaciones:** Cómo tus usuarios inician o abren tu centro de contacto en el sitio web o la aplicación de tu Comercial. Hay dos tipos de invitación: Fija e Incrustada.
  * **Fija:** Una forma sencilla de invitar a las personas a usar tu soporte digital. Los usuarios ven un ícono o widget en la pantalla que, al hacer clic, abre la experiencia de soporte. Puedes controlar el color, la forma y el ícono, e incluso añadir texto.
  * **Incrustada:** Con las invitaciones incrustadas, puedes convertir cualquier botón o enlace en tu sitio web en un enlace en el que se puede hacer clic y que abre el soporte.
* **Mensajes proactivos:** Saludo que puedes usar para enviar un mensaje después de que tus usuarios visiten una página específica durante una cantidad específica de tiempo. Los mensajes proactivos se pueden añadir a cualquier Campaign usando un tipo de Invitación Fija.

  **Por ejemplo:** "¿Necesita ayuda para seleccionar un plan?"

Además, también configurará un **avatar**, que es la representación en imagen del bot o agente. Sus consumidores verán estos avatares del bot o agente que representan su marca.

### Cree su experiencia de chat

Más información sobre cómo crear su experiencia de chat, incluido el tamaño, las imágenes, los diseños, la mensajería y la Configuración adicional.

{% content-ref url="/pages/5a8d93769a0b9eae65d6f845cb2418bee8c733ae" %}
[Construye tu experiencia de chat](/technical-library/es/servicios-comercial/zoom-contact-center/expert-insights/customize-user-chat-support-experience/build-your-chat-experience.md)
{% endcontent-ref %}

### Resumen

Zoom centro de contacto y Zoom Virtual Agent le ayudan a crear un chat de Soporte que tenga la apariencia de su marca y sea fácil de usar. Puede personalizar completamente el diseño, Seleccione dónde y cuándo aparece el chat, y Añadir mensajes proactivos para atraer a los usuarios en el momento adecuado. Una vez que el Campaign SDK esté integrado, puede controlar todo desde la UI de administrador o con código. Es flexible, limpio y está diseñado para adaptarse a su sitio.

Está listo para lanzar una experiencia de chat que ayude a sus Clientes y represente su marca.

### Recursos relacionados

* [Configurar una campaña digital de Zoom centro de contacto](https://zoom.us/cci/index/admin#/admin-campaign-management)
* [Integre las funciones de Zoom centro de contacto en su sitio web](/technical-library/es/servicios-comercial/zoom-contact-center/expert-insights/integrate-zoom-contact-center-features-into-your-website.md)
* [Incorpore el SDK de Campaign en su sitio web o aplicación móvil](https://developers.zoom.us/docs/contact-center/web/chat/#embed-the-chat-client-with-a-campaign-id)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://library.zoom.com/technical-library/es/servicios-comercial/zoom-contact-center/expert-insights/customize-user-chat-support-experience.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
