Yordy Serna

La cadena sin filo obliga a forzar, forzar recalienta, y el calor termina en el embrague o en el pistón. La mayoría de las reparaciones caras empiezan como un mantenimiento barato que se fue postergando. La página explica qué revisar antes de la temporada y qué señales avisan que algo va a fallar. Detalle de criterio: se descartaron las fotos donde se leía la marca en la barra — el taller es independiente, no distribuidor, y una portada con un logo ajeno le atribuye una representación que no tiene.

• Qué revisar antes de la temporada
• Las señales que avisan la falla
• Sin logos de marca ajena en la portada

Ver sitio ↗Código

Un presupuesto que no dice qué incluye no es un presupuesto: es una cifra. La diferencia aparece siempre en el mismo punto —terminaciones, instalaciones, el retiro de escombros— cuando la obra ya está avanzada y cambiar sale caro. Dejarlo por escrito antes de empezar no es desconfianza: es lo que evita la única discusión que arruina un trabajo bien hecho.

• Los cinco pasos con su hito de pago
• Qué incluye y qué no, antes de firmar
• Lote de imágenes distinto al de Pozas, a propósito

Ver sitio ↗Código

Un gimnasio chico se llena a la misma hora todos los días, y quien sale del trabajo a las seis quiere saber si va a esperar turno por la banca. Publicar cuántos puestos hay de cada cosa y a qué hora está más vacío es más útil que cualquier promoción, y es un dato que el dueño sabe de memoria. Las imágenes son de equipamiento y no de cuerpos a propósito: la página argumenta sobre máquinas y horarios, no sobre resultados que el negocio no puede firmar.

• Qué hay de cada máquina
• A qué hora se llena
• Imágenes de equipamiento, no de cuerpos

Ver sitio ↗Código

Rehabilitar en el box es cómodo para el kinesiólogo; rehabilitar en la casa es útil para el paciente. La escalera que sube todos los días, la cama de la que le cuesta levantarse: los ejercicios se arman con lo que hay ahí, y por eso se siguen haciendo cuando el kinesiólogo se va. Esta demo es de una persona y no de un local, y eso cambia todo: sin su foto y su registro no hay identidad posible, y ambos campos están puestos y vacíos a la espera.

• Rehabilitar con lo que hay en la casa
• El registro profesional, campo vacío a propósito
• Serie de imágenes coherente, no fotos sueltas

Ver sitio ↗Código

Quien llama con dolor no pregunta cuánto cuesta: pregunta cuándo. Y la respuesta que necesita no es «lo antes posible» sino un día y una hora. Una clínica que publica su semana resuelve la mitad de las llamadas antes de que ocurran. Es también la única demo de la tanda sin una sola foto propia — su Facebook tiene doce publicaciones y las doce son afiches, así que la página va con fondos genéricos y lo dice por escrito.

• La semana con los días de urgencia
• Las cuatro preguntas del dolor
• Cinco tratamientos de imagen por la página

Ver sitio ↗Código

Un dolor de muela no espera a que alguien revise un formulario. Por eso el número va primero y grande, y al lado va lo único que sirve mientras tanto: qué hacer las horas que faltan hasta la consulta. La portada es su propio edificio de Francisco Bilbao fotografiado de noche — justo la hora en que alguien busca una urgencia dental. El nombre se escribe «Geo Salud», separado, y por eso cuesta encontrarlos: es exactamente el problema que esta página viene a resolver.

• El teléfono como titular, no como pie
• Qué hacer mientras consigue hora
• El edificio de noche, que es la hora en que uno busca

Ver sitio ↗Código

Antes de llamar, el vecino ya decidió algo: si sale de la casa o si toma la carretera a Temuco. Una veterinaria de pueblo que contesta eso por escrito —lo que hace acá y lo que no— gana más confianza que una que promete de todo. La página separa las dos listas sin adornos, porque decir «esto se deriva» es exactamente lo que hace creíble el resto. Hoy lo único que hay de ellos en internet son afiches de horario: ni una imagen del lugar por dentro.

• Qué se resuelve acá y qué no
• Cuándo sí hay que derivar
• El mostrador, foto suya

Ver sitio ↗Código

La planta de revisión técnica mira siempre lo mismo, y eso se sabe de antemano. Revisarlo antes es la diferencia entre pasar de una o perder la mañana y pagar de nuevo. La página lo deja por escrito punto por punto, que es justo lo que casi ningún taller contesta. Y las fotos no son de catálogo: es el piso de tierra, el techo de zinc, un capó abierto y una caja de cambios en el suelo. En un rubro donde nadie confía, eso vale más que un galpón de vidrio.

• Qué mira la planta, punto por punto
• El apellido que responde
• El taller de verdad, sin galpón de catálogo

Ver sitio ↗Código

El nombre lo dice y nadie lo está aprovechando: son dos salones adentro de una misma casa, el de barbería y el de color y peinado. Se puede venir por uno solo, como siempre — pero también se puede tomar la misma hora para dos y resolver en una salida lo que normalmente son dos tardes distintas. Eso no está escrito en ninguna parte, y es exactamente lo que separa a esta barbería de las otras cuarenta de Temuco.

• La hora compartida, explicada
• Los dos salones y qué hace cada uno
• El logo en el vidrio, foto suya

Ver sitio ↗Código

Casi nadie pide hora para una limpieza: se pide hora cuando ya duele, y para entonces lo que había que hacer se convirtió en otra cosa más larga y más cara. La página explica qué es la limpieza, cada cuánto corresponde y qué se siente de verdad — que es la parte que frena a la gente. Las fotos son de su propio Facebook: el edificio desde la calle y el box con el logo pintado en la pared.

• Qué es una limpieza y cada cuánto
• Las preguntas del sillón
• El edificio y el box, fotos suyas

Ver sitio ↗Código

Es la consulta que más se pide y la que más mitos arrastra: si le cambia el carácter, si engorda, si conviene esperar una camada. Casi todo se resuelve conversando cinco minutos, y el problema es que esos cinco minutos hoy hay que ir a buscarlos al mesón. La página los deja escritos con calma, sin exagerar en ninguna dirección, y explica el día de la cirugía y la recuperación en casa. La portada lleva su fachada real, con el letrero legible.

• Los cuatro mitos contestados
• El día de la cirugía, hora por hora
• La firma que se traza sola

Ver sitio ↗Código

El dueño de un mastín de sesenta kilos hace siempre la misma llamada, y no es por el precio: es para saber si la mesa lo aguanta, si van a poder subirlo y cuántas personas se necesitan. Es una pregunta de logística y se contesta una sola vez, por escrito. La demo también rescata algo que ellos ya publican y se pierde: el aviso del cardiólogo que viene un viernes, hoy metido en una historia que caduca en veinticuatro horas.

• La logística del perro de sesenta kilos
• Qué cabe por la puerta y qué no
• El aviso del cardiólogo, con día y hora

Ver sitio ↗Código

Una peluquería canina recibe veinte veces al día la misma llamada: «¿a qué hora lo paso a buscar?». Y la contesta quien está trabajando con las manos mojadas. La propuesta convierte esa pregunta en un tablero: cuánto toma cada servicio según el tamaño del animal, y a qué hora queda listo si se deja a tal hora. La portada lleva una foto suya de verdad —un paciente en la camilla, con el logo de la clínica pegado en la pared detrás— disolviéndose hacia el titular.

• El tablero de horas de hoy
• Cuánto toma cada servicio, por tamaño
• El paciente en la camilla, foto suya

Ver sitio ↗Código

Loncoche es comuna de cuadrillas —forestales, obras, faenas— y todas comen colación todos los días. Un supermercado con panadería propia puede armar quince para mañana a las siete, y eso no está escrito en ninguna parte. La propuesta convierte esa capacidad en un servicio con cinco respuestas: hasta qué hora se encarga, mínimo, hora de retiro, si dejan en faena y cómo se paga. El argumento es que un pedido de colaciones no es una venta sino una rutina: la misma faena encarga de lunes a viernes mientras dure la obra.

• El pedido por encargo, con las cinco preguntas que lo cierran
• El día del local en cuatro láminas
• La harina que cae y se acumula, en CSS

Ver sitio ↗Código

matekila.cl funciona y hasta tiene carrito de compras, pero el título de la página es literalmente «Inicio»: así aparece en Google, sin el nombre del negocio. Y el menú no menciona en ninguna parte el lado mayorista, que es la mitad del negocio. La propuesta separa los dos mostradores —el almacén que compra por jaba y el vecino que viene al local— y deja escritas las seis condiciones que un almacenero necesita antes de cambiar de proveedor. Habla de logística, no de consumo: reparto, jabas, días de pedido y envase retornable.

• El comparador mayor/detalle con la retícula de jaba
• El envase retornable explicado por escrito
• Las jabas que encajan sin rebote

Ver sitio ↗Código

Loncoche es mitad pueblo y mitad campo, y la salida a terreno no se agenda por formulario: se pide por teléfono, casi siempre con el animal echado al lado. Por eso el número es la página. La propuesta deja armados —y deliberadamente vacíos— los tres bloques que deciden la llamada: qué animales atienden, hasta qué sectores salen y cómo se cobra la salida. El único bloque lleno es el general del oficio: qué tiene que tener listo el campesino cuando llega el veterinario. El botiquín no incluye ni un medicamento ni una dosis, a propósito.

• El número como página entera, formato aviso de poste
• Tres bloques vacíos y rotulados
• El botiquín del campo, sin un solo fármaco

Ver sitio ↗Código

Aparece como «Patrocinado» al buscar «veterinaria Pucón»: está pagando Google Ads. Y la ficha no tiene sitio web, así que cada clic que paga cae en un mapa con un teléfono. Le falta dónde aterrizar lo que ya compró. Tiene además 24 reseñas con 4,8 y las responde todas, una por una: hay alguien cuidando esa reputación, y hoy vive entera dentro de Google, prestada. La paleta salió de su propio logo —un perro, un gato y el Villarrica dentro de un círculo turquesa—: ese cuadrado de color se recortó pixel a pixel para dejar las siluetas sueltas y repintarlas en la tinta de la página, blanco puro de superficie y petróleo de fondo, con un solo coral gastado entero en urgencias. La pieza que sostiene la página es «el plan de tu mascota»: una línea de vida de cachorro a senior con los controles, vacunas y desparasitaciones que tocan a cada edad, y en cada hito un botón que baja al formulario con ese control ya elegido. Educa al tutor, demuestra que la clínica piensa a diez años y ninguna veterinaria de la zona lo tiene. Las urgencias no se buscan: hay una barra fija abajo en el celular con llamar y WhatsApp, porque una mascota que no respira no espera a que alguien navegue un sitio. El contraste del texto sobre las fotos se midió dibujándolas en un canvas y calculando el velo píxel a píxel: encontró un titular en 2,33:1 que ninguna revisión a ojo iba a ver.

• Línea de vida con los controles por edad
• Urgencia fija en el celular
• Su logo recortado y repintado

Ver sitio ↗Código

Una cadena con marca registrada, dos locales y 390 opiniones en Google que no tiene una casa con su nombre: hoy su marca vive repartida entre un Instagram y una página de AgendaPro con diseño de AgendaPro. Lo que hace que la propuesta se defienda sola es que ya usan AgendaPro, así que los catorce botones de reserva del sitio apuntan a su agenda real y funcionan hoy — la demo no simula la reserva, la hace, y al dueño no se le pide cambiar de sistema ni mantener un segundo calendario. La pieza central es la carta de precios dibujada como un tablero de barbería, con el tiempo de sillón de cada servicio y su propio botón al pie. En la portada el faro gira en dos capas: debajo uno dibujado en CSS que pesa cero y arranca en el primer fotograma, encima el modelo 3D que toma el relevo al terminar de cargar; si WebGL falla o el archivo no llega, el de CSS se queda puesto y no se nota el cambio. Gira sólo el cilindro interior, no el faro entero, con la animación que el propio modelo trae adentro. Sus fotos llegaron comprimidas a 1000 px por WhatsApp, así que van reescaladas con máscara de enfoque y servidas en dos tamaños: el celular baja 1,9 MB donde antes bajaban 4,5.

• Reserva real en AgendaPro
• Tablero de precios
• Faro 3D con respaldo en CSS

Ver sitio ↗Código

Propuesta preparada antes de la llamada, no un encargo: 4,9 en Google con 271 opiniones y su dominio sigue apareciendo en los resultados sin llevar a ninguna parte, así que la venta se les va por Trivago, Tripadvisor y Hotels. La pieza central son dos boletas dibujadas en SVG que ponen la misma cabaña y la misma noche una al lado de la otra —por un portal y directo por WhatsApp— para mostrar la comisión que se queda en el camino; vende el sitio y de paso le explica al dueño por qué la reserva directa importa. Mirando las fotos que me pasaron apareció lo mejor: su propio logo dice aguas calientes & spa y tienen piscina temperada techada y sauna de barril, algo que no estaba escrito en ninguna parte de internet. Eso pasó a ser el titular. El sitio es de papel —blanco cálido y crema, con la barra de arriba negra de borde a borde— y los fondos son sus mismas fotos desenfocadas, con un piso de luminancia horneado en el archivo y no puesto con un filtro CSS: así lo que se puede medir en el archivo es exactamente lo que se ve en pantalla. Ese piso es lo que separa un texto en 3,6:1 de uno en 5:1, y no hay manera de saberlo mirando.

• Cero librerías
• La cuenta clara en SVG
• Reserva → WhatsApp

Ver sitio ↗Código

Vende el repuesto en un local y lo instala en el otro, y hasta ahora existía sólo en Facebook. El sitio se ordena como una ficha técnica de taller: dos estaciones espejadas —ventas y servicios—, la dirección, el WhatsApp y la lista de trabajos sacados de su propia publicidad, y todo lo que no me consta marcado como EJEMPLO con borde punteado. La pieza central es una lámina de geometría dibujada a mano en SVG —convergencia, caída y avance— con la frase de lo que siente el conductor cuando cada ángulo está corrido: es la forma de explicarle a un cliente por qué paga una alineación. Los fondos fotográficos se desenfocan al hacer scroll cruzando la opacidad de dos capas, nunca animando filter:blur(), que obliga a repintar en cada cuadro; y el video del galpón es el del taller.

• Cero librerías
• Lámina de alineación en SVG
• Hora → WhatsApp

Ver sitio ↗Código

La mejor picada de La Araucanía 2014 según Sernatur, cocinando desde 1998, y su única presencia en internet era la página de Facebook. La regla fue la misma que en Majoaal: todo lo que el sitio afirma está publicado en alguna parte — el premio, el 4,6 de Google, la historia del fundador —, y lo que no, queda marcado como EJEMPLO con borde punteado. El cartel de abierto o cerrado se calcula con la hora real de Chile, la carta se lee con una mano en el celular con precios en numerales a la antigua, y el fondo es cocina pura: vahos de vapor, especias en suspensión y chispas de leña, todo en CSS sin una librería.

• Cero librerías
• Abierto/cerrado en vivo
• Reserva → WhatsApp

Ver sitio ↗Código

Cuatro alojamientos sobre el bosque nativo con vista al lago Calafquén. Tienen veintiún mil seguidores en Instagram mandando gente a un subdominio ajeno hecho con plantilla, que reusa las mismas fotos de Booking: no hay dominio propio ni manera de aparecer en Google por su nombre. Esta propuesta se armó para presentársela. La regla acá fue no mentir: capacidad, tarifas, horarios y distancias salen de publicaciones del propio complejo, y todo lo que no está confirmado queda marcado como EJEMPLO a la vista, con borde punteado, para reemplazarlo con sus datos. El fondo son cuatro capas de CSS y nada más — manchas de niebla que derivan, jirones que cruzan la pantalla, ceniza en suspensión y brasas dentro de las zonas oscuras, resueltas con degradados en un solo pseudoelemento en vez de sumar decenas de nodos.

• Cero librerías
• Fondo animado en cuatro capas
• Cotizador → WhatsApp

Ver sitio ↗Código

Cosecha de pino y eucalipto en pendiente sobre 30%: torre de madereo, skidder, excavadora con garra y Bell trineumático. La primera versión fue un expediente de faena, con folios numerados y papel color crema, y la boté entera: leía como panfleto de los ochenta, y una empresa que levanta torres en laderas de treinta grados tiene que hablar de acero y de cable, no de papeleo. Ahora es una ficha técnica de máquina — superficie de acero, condensada de señalética, cifras grandes con la unidad chica y fotos de faena a sangre. La pieza central es un plano de ingeniería dibujado en SVG: la torre en la cancha, el cable tendido hasta el anclaje, el carro subiendo un fuste suspendido y la pendiente acotada. La caída del terreno está calculada para dar sobre 30%, el mismo umbral que el texto declara, y el relieve sale de un generador con semilla fija: es siempre el mismo cerro. Nada afirma lo que no está confirmado — lo que la familia todavía no entrega sale como POR CONFIRMAR — y el formulario arma la solicitud y la abre directo en WhatsApp.

• Plano de ingeniería en SVG
• Cero librerías
• Pendiente acotada de verdad

Ver sitio ↗Código

Un recinto con piscina grande, cabañas y camping en el kilómetro 1 del camino a Calafquén. No tenía sitio: existía un flyer y diez fotos sueltas en el teléfono. De ese flyer salió la identidad — el sol en espiral se rehízo en SVG y su naranja quedó como único acento sobre verde bosque y madera. Las ocho fotos del recinto entraron comprimidas de 11,9 MB a 1,6 MB, porque el visitante que importa aquí navega con señal rural. El calendario de reservas es propio: se marcan llegada y salida sobre dos meses, se elige el tipo de estadía y cuántos son, y la consulta sale a WhatsApp ya redactada. Las capas del hero se mueven a velocidades distintas al hacer scroll y las tarjetas de instalaciones encienden un halo que sigue al cursor.

• Next.js + Framer Motion
• Calendario propio → WhatsApp
• Fotos: 11,9 MB → 1,6 MB

Ver sitio ↗Código

Una cabaña y un vivero en un campo que sigue funcionando, con gallinas sueltas y un letrero pintado a mano en la entrada. Va entero sobre un solo verde de bosque: la profundidad no la da cambiar de color, la dan una foto del campo muy desenfocada que deriva detrás del contenido y una niebla dibujada en un canvas de 200×120 px reales, estirado recién después a pantalla completa. Con las fotos la regla es una sola: si es una pieza que se mira va encapsulada, y entra cayendo de arriba o de un costado, pasándose unos píxeles antes de acomodarse; si la foto es la página, va a sangre con el texto montado encima. El calendario de reservas es propio, arma el mensaje y lo abre directo en WhatsApp.

• Cero librerías
• Niebla en canvas, sin WebGL
• Calendario propio → WhatsApp

Ver sitio ↗Código

Un gimnasio que se llama Templo pedía dejar de parecer un gimnasio. Fuera las tarjetas: los tres planes son columnas separadas por hilos finos, con el precio grande para compararlos de un vistazo. El botón de contratar abre un formulario corto y sale a WhatsApp con el plan, el nombre y el teléfono ya redactados; si el JavaScript no carga, ese mismo botón sigue siendo un enlace que llega al chat igual. El titular mezcla una grotesca de peso 900 con una itálica de alto contraste, y se arma letra por letra detrás de una máscara. El cartel de abierto o cerrado no está escrito a mano: se calcula con la hora real de Chile.

• Planes → WhatsApp
• Horario en vivo
• Lenis + GSAP ScrollTrigger

Ver sitio ↗Código

Especialistas en sistema eléctrico y de arranque en Villarrica. El local perdía tiempo respondiendo la misma pregunta de a uno: "¿tienes esta pieza?". El cotizador pregunta marca, modelo y año, y el WhatsApp llega con la ficha escrita.

• Cotizador en 3 pasos
• 15 marcas · 100 modelos
• Fondo animado sin librerías

Ver sitio ↗Código

Importador con quince años en Chile y diez marcas europeas en catálogo. Aquí el problema no era vender: era ordenar mucha ficha técnica para que un agricultor encuentre su máquina rápido.

• Catálogo · 10 marcas
• Ficha por modelo
• Galería técnica

Ver sitio ↗Código

Ambiente western, karaoke los viernes y música en vivo. El diseño tenía que sonar fuerte sin volverse ilegible: madera oscura, ámbar y una carta que se lee bien con el bar lleno.

• Parallax
• Carta grabada
• SEO local

Ver sitio ↗Código

Un local que funciona como tres cosas distintas según la hora. La página lee el reloj del visitante y muestra si está abierto ahora mismo, con la carta y los horarios reales del local.

• Horario en vivo
• Video propio
• Carta real

Ver sitio ↗Código