Demo · 17 Signature · $25K
El logo se traza línea por línea, como si una mano lo dibujara en vivo. Después aparecen las coordenadas y el wordmark. Es el efecto editorial que usan revistas tipo Monocle, Kinfolk y Apartamento — y se hace con CSS puro y un truco viejo: stroke-dashoffset.
JS lee cada path con getTotalLength() y aplica stroke-dasharray y stroke-dashoffset iguales al largo total — eso oculta la línea. Una animación CSS lleva el offset a 0, lo que "destapa" la línea progresivamente. Cada elemento tiene su propio delay, así el dibujo se siente coreografiado, no automático.
La secuencia importa: aros exteriores primero (contexto), luego ticks compás (estructura), después el ancla pieza por pieza (forma), por último coordenadas y wordmark (información). Total: 3 segundos. Funciona como hero principal en sitios de marca, intro a sección "nosotros", o splash de carga.
Lo monto con la ilustración de tu marca o un dibujo nuevo a medida. Cuesta lo mismo, suma muchísimo a la primera impresión.
Cotízalo por WhatsApp