CotizaGuate: identidad de marca, mascota 3D y desarrollo en WooCommerce
Project Gallery
El encargo
CotizaGuate compara lo que cobran las tiendas guatemaltecas por el mismo producto electrónico. El problema comercial no era el motor de comparación, era el reconocimiento: en esta categoría toda la competencia parece una hoja de cálculo con un logo encima, y nadie recuerda una hoja de cálculo.
Por eso el trabajo empezó por la identidad y no por la interfaz. Tres piezas que normalmente se reparten entre tres proveedores: la marca, un personaje y la tienda donde todo el sistema iba a vivir.
Construir la marca desde una letra
El punto de partida fue el quetzal, ave nacional de Guatemala y, convenientemente, nombre de la moneda. Los dos significados están en juego aquí, y esa clase de coincidencia se aprovecha.
En lugar de poner el ave junto al nombre, la integré dentro de la C de Cotiza, con trazado de circuito formando la letra. Se lee primero como monograma y entrega el ave después.
Esa decisión salió de dónde tiene que sobrevivir la marca de verdad. Una plataforma de comparación vive a 16 píxeles, en favicons, iconos de aplicación y listados de socios. Un ave ilustrada se deshace a ese tamaño. Una letra con una silueta dentro, no.
La sostienen tres colores: un teal tomado del plumaje del quetzal, un azul de circuito y un verde lima para todo lo que hay que pulsar. La moneda dorada en el pico cumple doble función, referencia a la divisa y única nota cálida en una paleta fría, de modo que la vista aterriza ahí.
Quetzo, la mascota
El personaje vino después, y necesitaba una razón de ser más allá de decorar. Comparar precios es un trámite árido. La gente llega ligeramente molesta por tener que revisar ocho pestañas. Un guía cambia el registro de esa visita.
Los bocetos fueron antes que el modelado. Silueta, proporción y pose se resuelven en papel en una tarde; las mismas correcciones cuestan días cuando ya existe una malla. La hoja de arriba recoge el paso del ave anatómica a una forma lo bastante simple para funcionar como recurso de marca.
Se llama Quetzo, contracción de quetzal y Cotizo. Corto, fonético en español y suena a software. Su ficha es deliberadamente estrecha: analítico, rápido, no le hace perder el tiempo a nadie, y su único trabajo es encontrar un precio más bajo. El plumaje se modeló en Blender, con el motivo de circuito del logo trasladado a las alas para que ambos recursos se lean como un mismo sistema.
El turnaround y el set de poses existen para que el cliente nunca se quede sin recurso. Un solo render heroico es un callejón sin salida la primera vez que alguien necesita al personaje en un banner, un estado vacío o una notificación. Ocho poses y tres vistas permiten desplegar la mascota sin volver a encargar ilustración.
Aplicar el sistema
Los mockups son la manera de descubrir si una identidad funciona de verdad. Grabada en la tapa de un portátil la marca pierde el color y tiene que sostenerse solo con la silueta; en la esfera de un reloj baja a unos milímetros; en una funda recibe la paleta completa. Probarla en esos extremos revela los fallos que un tablero de presentación esconde.
La tienda
El sitio corre sobre WordPress con WooCommerce, construido como plantilla escrita desde cero en vez de un tema comprado y forzado.
Eso salió de un requisito explícito: el cliente añade y edita productos por su cuenta, de forma permanente, sin desarrollo de por medio. Un tema comprado cumple el encargo visual más rápido y luego opone resistencia a cada cambio posterior al lanzamiento. Escribir la plantilla contra las reglas propias de tipografía, color y espaciado hace que la pantalla de edición produzca páginas coherentes por defecto, sin depender de que nadie recuerde las reglas.
El flujo de arriba quedó cerrado antes de diseñar ninguna página. Es corto a propósito: buscar, comparar, salir hacia la tienda. Cada pantalla o reduce opciones o entrega al visitante, y lo que no hacía ninguna de las dos cosas se eliminó.
Se entregaron los dos temas, claro y oscuro, con la paleta verificada en ambos para que los precios se lean bien en cualquiera. En una plataforma de comparación, una cifra difícil de leer es una página fallida.
Stack
- Blender para Quetzo, del bloqueo inicial al pelaje, los materiales y los renders finales
- Illustrator para el monograma, el wordmark y el sistema de color
- Photoshop para los mockups de merchandising y packaging
- WordPress con plantilla hecha a mano, sin tema comprado
- WooCommerce para la estructura de productos y los datos de precios de las tiendas
- Elementor para los maquetados de catálogo que mantiene el cliente
Resultado
Una plataforma joven que parece asentada, una mascota que el cliente puede desplegar sin encargar ilustración cada vez, y un catálogo que gestiona por su cuenta.
¿Necesitas la identidad y el desarrollo en un mismo sitio?
Repartir branding y desarrollo entre dos proveedores es donde suele romperse la coherencia. Hacer ambos significa que las decisiones tomadas en el logo siguen en pie cuando llegan al gestor de contenidos.