(05) Apuntes de campoTodas las publicaciones

Presupuesto de rendimiento vs. ambición de diseño — cómo decidimos

Cada proyecto de Mentes tiene un presupuesto de rendimiento y una ambición de diseño. Cuando entran en conflicto, aquí está el marco honesto que usamos para decidir.

Presupuesto de rendimiento vs. ambición de diseño — cómo decidimos

El conflicto entre rendimiento web y diseño es real. Quien te diga lo contrario te está vendiendo algo — ya sea un sitio hermoso que carga lentamente en celular, o un sitio rápido que nadie recuerda.

Nosotros mantenemos ambos. Esa es nuestra posición. Y crea una tensión genuina en cada proyecto que asumimos.

Aquí está cómo esa tensión se resuelve realmente — no en teoría, sino en la sala, con clientes, bajo presión de plazo.


El presupuesto es innegociable. La ambición no es opcional.

Cada proyecto de Mentes comienza con dos documentos sobre la mesa: un brief de ambición de diseño y un presupuesto de rendimiento.

El presupuesto de rendimiento es un techo duro, no una guía flexible. Apuntamos a LCP menor a 2 segundos, CLS menor a 0.1, e INP menor a 200 milisegundos. Estos no son números arbitrarios. Reflejan cómo los visitantes reales — en dispositivos reales, en redes reales — experimentan un sitio. La investigación de Core Web Vitals de Google ha demostrado consistentemente que los sitios que cruzan estos umbrales pierden visitantes antes de que se lea una sola palabra. Un sitio lento no es un sitio premium. Punto.

El brief de ambición de diseño es igualmente innegociable en la otra dirección. Mentes no trabaja con plantillas. No hacemos drag-and-drop. Cada proyecto se construye desde cero — concepto, copy, diseño, código, y el motor de crecimiento debajo. Si el brief de ambición es vago, nos oponemos antes de que se diseñe un solo frame. Un brief creativo débil es solo un camino hacia un sitio mediocre que además resulta ser rápido.

Así que cuando estos dos documentos entran en conflicto — y lo hacen, regularmente — no elegimos un ganador. Encontramos una resolución.


Cuatro decisiones que realmente hemos tenido que hacer

1. El hero pesado en una marca de hospitalidad

Un grupo de restaurantes vino a nosotros con una visión clara: un hero inmersivo en pantalla completa que llenara el primer scroll con movimiento, atmósfera y textura. En una conexión rápida con un dispositivo flagship, era exactamente lo correcto — imponente, distintivo, imposible de pasar por alto.

En un celular Android de gama media en 4G, el LCP estaba por encima de 4 segundos. Eso no es un error de redondeo. Eso es la ventana de rebote.

La resolución no fue eliminar el tratamiento. Fue separar la experiencia en capas. Los visitantes en conexiones rápidas obtienen el visual completo. Los visitantes por debajo de un umbral de red obtienen un fotograma fijo — igualmente considerado, igualmente marcado — que carga en menos de un segundo. El hero se siente igual desde afuera. La arquitectura debajo es adaptativa.

El cliente nunca tuvo que elegir entre rápido y hermoso. Hicimos esa elección invisible.

2. La intro inmersiva que estaba reventando el presupuesto en 3G

Un fundador de marca quería una secuencia de intro inmersiva — el tipo de entrada que señala "esto no es una plantilla." La secuencia era impresionante en producción. También estaba, en una conexión 3G, cargando durante 7 segundos antes de que apareciera una sola palabra de la marca.

Este requería una conversación más difícil. Una intro que pide a un visitante que espere 7 segundos no es confianza — es fricción. Llevamos al cliente a través de datos 3G del mundo real para su mercado objetivo. Una vez que vieron los números, la pregunta cambió de "cómo mantenemos la intro" a "cómo mantenemos la sensación de la intro."

La reconstruimos. La nueva versión llega en menos de 2 segundos. La impresión de marca aterriza igual de deliberadamente. La secuencia es más corta, más apretada, y — esto es la parte que los clientes no siempre esperan — más impactante porque no se excede.

La restricción no es enemiga del drama. A veces es la fuente de él.

3. Tipografía a escala vs. cambio de layout

Una firma de servicios profesionales quería una página de inicio dominada por tipo grande y expresivo — el tipo de confianza tipográfica que se lee como autoridad. El desafío era CLS: tipo grande que se desplaza durante la carga es desagradable y arruina la puntuación.

La mayoría de las agencias habrían comprometido el tipo. Nosotros comprometimos la secuencia de carga en su lugar.

Precarga de fuentes, tamaño de fallback cuidadoso, y un estado de placeholder considerado significaba que el layout nunca se desplazaba visiblemente. El tipo llegaba ya en su lugar — no después. La puntuación de CLS se mantuvo por debajo de 0.05. La tipografía no se redujo.

Este requería más tiempo de ingeniería del que el cliente vio. Ese es el resultado correcto. El oficio debe ser invisible; el resultado no debe serlo.

4. La página de portfolio con muchas imágenes

Un cliente de agencia creativa necesitaba una página de trabajo que mostrara docenas de proyectos — alta resolución, borde a borde, cada uno una declaración visual completa. Cargada ingenuamente, esa página sería un desastre de LCP y una pesadilla de ancho de banda en celular.

La solución fue revelación progresiva: los proyectos cargan cuando el visitante llega a ellos, no todos a la vez. Lo anterior al fold carga rápido. Todo lo que está debajo carga justo a tiempo, sin saltos de layout. El INP se mantuvo por debajo de 150ms en todo — incluso con docenas de assets en vuelo.

El cliente nos preguntó, después del lanzamiento, por qué la página se sentía tan suave. Le dijimos que era el resultado de decisiones tomadas antes de que viera el primer mockup de diseño. Que es cierto.


Los dos malos defaults — y por qué rechazamos ambos

Hay un modo de fallo común en el lado "diseño sobre todo": agencias que tratan el rendimiento como problema de otro. Entregan un archivo Figma impresionante y dejan los tiempos de carga al desarrollador, quien hereda restricciones en las que no tuvo voz. El resultado es un sitio hermoso que falla en el dispositivo que usan los clientes reales de su cliente.

Hay un modo de fallo igualmente común en el lado "rendimiento sobre todo": desarrolladores que tratan cualquier ambición visual como riesgo y silenciosamente la liman hasta que el sitio es rápido e inolvidable. Estos sitios obtienen 100 en Lighthouse. También obtienen 0 en recuerdo.

Ninguno de los dos es aceptable para nosotros.

La respuesta honesta es que rendimiento y diseño no son enemigos — son colaboradores bajo presión. La presión es lo que produce buenas decisiones. Un proyecto sin restricciones de rendimiento siempre derivará hacia el exceso. Un proyecto sin ambición de diseño siempre derivará hacia la utilidad. Necesitas ambos tirando en direcciones opuestas.

Esa tensión no es un problema a resolver. Es un proceso a gestionar.


Cómo sacamos a la luz el conflicto temprano

La peor versión de esta conversación sucede en la semana final antes del lanzamiento, cuando algo es demasiado lento o demasiado despojado y no hay espacio para maniobrar. Hemos aprendido a sacar a la luz el conflicto temprano — durante concepto, no durante QA.

Cuando estamos diseñando un tratamiento que podría afectar el rendimiento, lo decimos. Traemos estimaciones de carga aproximadas a la conversación de diseño. Le preguntamos al cliente: ¿quién es tu visitante, en qué dispositivo, en qué red? Un sitio de bienes raíces de lujo dirigido a compradores de Miami Brickell en desktop puede sostener más peso visual que un negocio de servicios dirigido a familias trabajadoras en el centro de Florida en celular.

La respuesta a "cuál es el presupuesto de rendimiento correcto" depende de quién está cargando la página. No de una hoja de especificaciones.

Hacemos esto porque creemos que los clientes merecen tomar decisiones informadas — no porque pensemos que quieren escuchar sobre milisegundos. El encuadre siempre está en resultados: este tratamiento agrega aproximadamente un segundo de tiempo de carga para un tercio de tus visitantes. Aquí está lo que podemos hacer para reducir eso sin cambiar lo que ves.

Esa es la conversación. No es dramática. Solo es honesta.


Ambos, en tensión, en cada proyecto

No hay fórmula que resuelva el conflicto entre rendimiento web y diseño de una vez por todas. Cada proyecto es diferente. La audiencia de cada cliente es diferente. Cada tratamiento creativo tiene su propio perfil de costo.

Lo que podemos ofrecer es un compromiso consistente: nunca enviaremos algo lento y lo llamaremos premium, y nunca enviaremos algo rápido y lo llamaremos terminado si no mantiene la atención de un visitante más allá del primer scroll.

Ambos estándares se aplican en cada proyecto. No alternativamente — simultáneamente.

Esa es la posición de Mentes. Es más difícil que elegir un lado. También es la única que realmente funciona.


Si estás considerando una reconstrucción de sitio y te preguntас si tendrás que elegir entre un sitio que se vea como tu marca y uno que funcione — no deberías tener que hacerlo. Mira cómo lo abordamos, o revisa el trabajo y decide por ti mismo. Cuando estés listo para hablar, estamos aquí.