Caso de estudio 02
Bordados Yussi
Dotación y bordado industrial · Manizales
Un taller textil con planta propia desde 1999. El sitio ordena cinco líneas de producto, explica cómo se aprueba una muestra y lleva cada visita a una cotización.
Visitar sitio
- Servicios
- Dirección · Diseño · Desarrollo · SEO
- Construido con
- Vite · TypeScript · Canvas · Vercel
- Estado
- En producción · ES / EN
Contexto
Un oficio que se compra viéndolo.
Bordados Yussi confecciona y borda en Manizales desde 1999, con planta propia: digitalización del logo, telas, confección y bordado bajo el mismo techo. Sus clientes son empresas, clínicas, colegios, marcas y talleres.
Ese tipo de compra no se decide leyendo una lista de servicios. Se decide viendo el material, entendiendo qué se puede pedir y sabiendo qué pasa antes de que la máquina arranque. El sitio tenía que enseñar el taller, no describirlo.
Arquitectura
Cómo se ordena el sitio.
Una sola página con anclas nombradas, en el orden en que un comprador se hace las preguntas: qué fabrican, cómo se ve, cómo se trabaja, hasta dónde llegan, quiénes son, qué falta por resolver y cómo pedirlo.
Productos
Cinco líneas: dotación empresarial, uniformes médicos, ropa industrial, uniformes escolares y servicio de bordado. Cada una con su público, su descripción y su propio botón de cotizar.
Nuestro trabajo
La planta por dentro: bordado en proceso, digitalización, materiales y confección. Es la prueba de que la producción es propia.
Cómo trabajamos
Cuatro pasos —definir, cotizar, aprobar muestra, producir y revisar— que responden la duda real: qué se aprueba y cuándo.
Cobertura
Caldas, Colombia e internacional en tres pestañas sobre un mapa. Resuelve “¿me llega a mi ciudad?” sin escribir a nadie.
Nosotros y respaldo
El origen en 1999, el argumento de no tercerizar y la tecnología e insumos que sostienen el trabajo.
Preguntas y cotización
Cinco preguntas que quitan fricción —mínimo, tiempos, envíos, prendas propias, logo— y el formulario que abre la conversación.
La planta
La prueba es el material.
El argumento comercial de Yussi es que nada se terceriza. En el sitio eso no se escribe: se enseña. Cuatro planos del taller —máquina, digitalización, hilos, confección— sostienen una sola frase.
- Dotación empresarial
- Uniformes médicos
- Ropa industrial
- Uniformes escolares
- Servicio de bordado
Dirección visual
Materia, no catálogo.
Fotografía de planta, no de banco de imágenes
El bloque de trabajo muestra la puntada, el hilo y la tela reales, etiquetados por lo que son: bordado en proceso, digitalización, materiales, confección. Es lo que sustituye a un argumento de calidad escrito.
Azul industrial sobre papel frío
Un azul profundo de marca sobre superficies claras. El contraste alto deja que el color de las prendas y los hilos sea lo único saturado en pantalla.
Titulares cortos, etiquetas en versalitas
Archivo para los titulares, Manrope para el texto y etiquetas en mayúsculas con tracking abierto sobre cada bloque. La retícula numerada —01 a 05 en las líneas de producto— da orden de lectura sin necesidad de decorar.
Cada bloque termina en una acción
No hay sección sin salida: cada línea de producto, el proceso, la cobertura y el bloque de equipo llevan a cotizar. La conversación es el objetivo, no la permanencia.
La experiencia
El taller, en pantalla.
Las cinco líneas se leen de un vistazo con su público al lado; el bloque de planta pone la producción propia delante del argumento; el mapa de cobertura contesta el alcance en tres pestañas.
Móvil
Lo que cambia en 390 px.
La navegación pasa a un panel completo en vez de comprimirse; las líneas de producto se apilan conservando la numeración; el mapa de cobertura cambia de arrastre a pestañas con lista. Nada se esconde: se reordena.
Construcción
Cómo está hecho.
Una sola página compilada con Vite y servida desde Vercel: un bundle, sin CMS y sin framework de UI arrastrando peso. Lo que sí pesa —el video del hero y el mapa— se difiere o tiene alternativa estática.
-
Vite + TypeScript
Un único bundle para toda la página.
-
Canvas + fallback
El mapa de cobertura se dibuja en canvas y cae a imagen si no puede.
-
ES / EN
Un conmutador de idioma sobre el mismo marcado.
-
WhatsApp
El formulario de cotización termina en la conversación real.
Resultado
Un taller de 1999 con una presencia digital que enseña el material, explica el proceso y termina en cotización.
No publicamos cifras: no las hemos medido. Lo entregado es verificable en el sitio — cinco líneas de producto ordenadas, el proceso de aprobación explicado, la cobertura resuelta, las preguntas frecuentes contestadas y una vía de cotización en dos idiomas.
Visitar sitio