CodeKitHub¿Qué es esta herramienta?
El Generador de chats personalizado es una herramienta de maquetación basada en el navegador para crear una captura de chat que no está anclada a la identidad de marca de una única app real. En lugar de un color de marca fijo, obtienes un selector de color para la burbuja «enviado» y otro para la burbuja «recibido», así puedes igualar una app ficticia, un concepto de interfaz hipotético, o simplemente los colores que necesite tu meme o presentación.
Esto es útil cuando quieres una maqueta de chat para una historia, un wireframe, o una broma sobre una app inventada, y no quieres que la identidad reconocible de un mensajero real específico distraiga del punto.
Solo para entretenimiento y diseño: esta herramienta está pensada para bromas, memes, sketches, diapositivas de presentaciones, prototipos de UI/UX y contenido para redes sociales. Nunca debe usarse para fabricar pruebas fraudulentas, acosar o difamar a alguien, ni suplantar mensajes reales de una persona real — hacerlo puede ser ilegal según tu jurisdicción y va estrictamente en contra del uso previsto de esta herramienta.
Nada de lo que escribas sale nunca de tu dispositivo — toda la conversación se dibuja con la API de Canvas de HTML directamente en tu navegador, y el PNG se genera y descarga de forma local. No hay subida a ningún servidor, ni cuenta, ni seguimiento del contenido de tus mensajes.
¿Por qué utilizarlo?
- Estás armando el pitch deck de una app de mensajería que todavía no existe y necesitas una captura de pantalla realista para la diapositiva, sin que nadie confunda tu maqueta con WhatsApp o Telegram.
- Eres guionista o creador de contenido y necesitas una conversación falsa con estética propia para un sketch de humor, sin que la marca de una app real distraiga del chiste.
- Estás prototipando el diseño de una app de chat en Figma o como wireframe y quieres probar rápidamente cómo se ven distintas combinaciones de color de burbuja antes de definirlas en tu sistema de diseño.
- Un profesor te pidió una maqueta de conversación para ilustrar un caso de estudio de UX en clase, y necesitas que los colores coincidan con la paleta del resto de tu presentación académica.
- Quieres crear un meme de una conversación absurda para compartir en un grupo de amigos, pero prefieres colores neutros en vez de que se vea como capturado de una app específica.
- Necesitas mantener privacidad total al crear la maqueta —quizás incluye datos sensibles de un caso ficticio de trabajo— y quieres la garantía de que nada se sube a un servidor externo.
Cómo utilizarlo
- Define el nombre del contacto, el texto de estado y elige tema claro u oscuro para el resto de la interfaz.
- Elige un color para la burbuja de enviados y otro para la de recibidos usando los dos selectores de color.
- Sube una foto para el avatar, o déjalo como un círculo de color con iniciales.
- Añade filas de mensajes: escribe el texto, elige un lado (ellos/yo) y una marca de tiempo.
- Ajusta la barra de estado (hora, batería, señal) a tu gusto.
- Observa cómo se actualiza la vista previa con forma de teléfono en tiempo real y haz clic en «Descargar PNG» para guardar la imagen.
Ejemplo
Entrada
Contacto: «Alex» · Burbuja enviada: morado · Burbuja recibida: gris claro · Mensaje 1 (ellos): «¿Seguimos en pie para esta noche?» · Mensaje 2 (yo): «¡Sí! Nos vemos a las 8 😊»Resultado
Una imagen PNG de 375×812 que muestra una pantalla de chat con una burbuja gris claro a la izquierda con el primer mensaje, y una burbuja morada a la derecha con la respuesta — usando exactamente los colores que elegiste.La imagen se genera al instante en el lienzo de vista previa en vivo y se descarga con un solo clic — sin esperas, sin subidas.
Qué puedes personalizar
- Nombre del contacto, texto de estado y tema claro/oscuro para el resto de la interfaz.
- Colores de la burbuja enviada y la burbuja recibida, elegidos de forma independiente.
- Avatar: sube una foto real (recortada en círculo) o elige un color por defecto.
- Filas de mensajes ilimitadas, cada una con su propio texto, lado (ellos/yo) y marca de tiempo.
- Barra de estado del teléfono: hora, porcentaje de batería e intensidad de la señal.
Uso responsable
Este generador existe para facilitar la creación de imágenes de chat claramente ficticias con fines de humor, narrativa y diseño. No es una herramienta para fabricar pruebas, organizar acoso ni engañar a nadie haciéndole creer que una conversación falsa es real. Si piensas compartir una imagen creada con esta herramienta, considera añadir contexto (como «falso» o «maqueta») para que quien la vea entienda que no es una conversación real.
Cuándo usar este generador en vez de uno específico de app
CodeKitHub también ofrece generadores dedicados que imitan el estilo visual exacto de apps reales. Esta tabla resume cuándo conviene cada enfoque.
| Situación | Herramienta recomendada |
|---|---|
| Necesitas que se vea exactamente como WhatsApp, Telegram o Messenger | Generador dedicado de esa app específica |
| Estás diseñando una app ficticia o un concepto de UI propio | Generador de chats personalizado (esta herramienta) |
| Quieres que los colores coincidan con tu marca o presentación | Generador de chats personalizado (esta herramienta) |
| Haces un meme que depende de que se reconozca una app real | Generador dedicado de esa app específica |
| Prototipas un wireframe sin comprometerte aún a una identidad visual | Generador de chats personalizado (esta herramienta) |
Preguntas frecuentes
¿Es legal o ético usar esta herramienta?
La herramienta en sí es legal de usar para entretenimiento, maquetas, presentaciones y trabajo de diseño. Lo que no es legal ni ético es usar la imagen generada para engañar a alguien — por ejemplo presentarla como una conversación real para cometer fraude, acosar o difamar a una persona, o suplantar los mensajes reales de alguien. Úsala solo con fines claramente ficticios o ilustrativos.
¿La herramienta sube mis mensajes o mi foto a algún sitio?
No. Cada mensaje, nombre, foto y ajuste que introduces permanece en la memoria de tu navegador y se dibuja directamente en un elemento canvas mediante JavaScript. El archivo PNG se genera y descarga en tu dispositivo — nada se envía nunca a ningún servidor.
¿Debería usar este generador o uno de los generadores específicos de plataforma?
Si tu maqueta necesita parecerse a una app real específica — WhatsApp, Telegram, Messenger, Signal, WeChat o LINE — usa el generador dedicado de esa app para que los colores, tics y estilo de cabecera coincidan con lo que esperan los espectadores. Usa este Generador de chats personalizado en su lugar cuando quieras una maqueta de chat para una app ficticia, un wireframe, o contenido donde no quieras el aspecto de ninguna marca real en particular, y prefieras elegir tú mismo los colores exactos de las burbujas.
¿Puedo subir una foto real como avatar?
Sí. Haz clic en «Subir foto» para usar cualquier imagen de tu dispositivo como avatar del contacto — se recorta automáticamente en forma de círculo. Si omites este paso, el avatar vuelve a ser un círculo de color con las iniciales del contacto. La foto solo se usa localmente en tu navegador y nunca se sube a ningún sitio.
¿Qué tamaño de imagen exporta?
La vista previa y el PNG exportado usan una proporción de pantalla de teléfono (375×812 por defecto), que se ve natural al compartirla en redes sociales o al incrustarla en una presentación.
¿Puedo tener más de dos participantes en la conversación?
La herramienta está diseñada para una conversación de dos lados —«yo» y «ellos»— igual que un chat individual real. No admite un chat grupal con varios remitentes distintos en la misma burbuja de color.
¿Cómo elijo colores de burbuja que se vean bien juntos?
Un contraste claro entre ambas burbujas ayuda a distinguir quién dijo qué de un vistazo — evita elegir dos tonos muy similares de la misma familia de color. La vista previa en vivo se actualiza al instante, así que puedes probar varias combinaciones antes de decidir.
¿Puedo editar un mensaje después de haberlo agregado a la conversación?
Sí — cada fila de mensaje es editable de forma independiente: puedes cambiar el texto, el lado (yo/ellos) o la marca de tiempo en cualquier momento antes de descargar el PNG final.
¿Necesito instalar algo o crear una cuenta para usar esta herramienta?
No. No hay registro, instalación ni cuenta de ningún tipo — abres la página, personalizas tu chat y descargas el PNG directamente desde el navegador.