Sobre esta plantilla
Axion About es la referencia de página sobre nosotros para un producto de IA o SaaS, y el brief que hay detrás es una especificación de construcción completa, no un moodboard. “Through research, creative thinking and iteration we help growing brands realize their digital full potential” es la línea que la maquetación está pensada para sostener. Toda la página se construye sobre blanco #EDEDEE de base, rojo intenso #3E3133 para la tipografía y naranja brillante #F26522 para los acentos. La referencia está construida con React y Tailwind CSS, y las decisiones de maquetación se documentan aparte. La página reduce el movimiento a cubic-bezier(0.25,0.1,0.25,1). Sirve de referencia cuando construyas este tipo de página sobre nosotros para un producto de IA o SaaS y quieras una composición terminada en lugar de un punto de partida.
Pensado para
- Llévate el marco de 640x468 y tipografía de 12px a 18px y pasos de espaciado de 12px de este diseño de página sobre nosotros antes que cualquier otra cosa.
- Los responsables de estudio que llevan varios proyectos a la vez usarán este diseño de página sobre nosotros como patrón que copian las demás páginas.
- Equipos de producto que escriben los textos de Página sobre nosotros y necesitan que cada línea respete la longitud para la que se dimensionó la tipografía de display.
Qué incluye
- Los tamaños están en el brief, no en una escala. Los tamaños se leyeron del render en 640x468: tipografía de 12px a 18px, pasos de espaciado de 12px y easing cubic-bezier(0.25,0.1,0.25,1). Cada valor responde a una función: un paso de tipo, un hueco, un radio o una transición.
- La píldora de anuncio. El anuncio es una píldora en #F26522 sobre el titular, con un tamaño menor que el texto de apoyo para que se lea como etiqueta y no como un segundo título. La insignia lleva #F26522 mientras el titular se queda en el color del texto.
- Aquí nada se hereda. El espaciado se cita igual (tipografía de 12px a 18px, pasos de espaciado de 12px y easing cubic-bezier(0.25,0.1,0.25,1)), no como una escala que crece sola.
- El comportamiento se define por ancho. Los cambios de ancho se resuelven en el propio tipo: un clamp entre 12px y 18px lleva el titular del móvil al escritorio sin una composición móvil aparte. El menú móvil forma parte del mismo brief, así que el estado plegado también está diseñado.
Movimiento e interacción
Cambios de estado medidos
Cada cambio de estado de la especificación lleva una duración: las transiciones se resuelven en torno a 0 usando cubic-bezier(0.25,0.1,0.25,1). Nada queda en el valor por defecto del navegador, y por eso la página se siente diseñada y no animada. Como los valores son cortos, una reconstrucción que los alargue se nota de inmediato.
Movimiento que no estorba
Aquí no hay librería de scroll: la composición de 640x468 se queda quieta y solo se mueven los elementos que responden a ti. La composición se queda quieta, así que la jerarquía tiene que sostener la página, y lo hace. La quietud es una opción válida.
El orden detrás de página sobre nosotros
Comprometerse con un solo recorrido de lectura cierra los demás. El brief lo acepta, fija la insignia de anuncio y la fila de cifras en su sitio y gasta tipografía de 12px a 18px y pasos de espaciado de 12px en hacer obvio el camino. Quien busca SaaS recibe la oferta antes que las opciones.
El acierto de página sobre nosotros
La mayoría de las páginas de SaaS fallan por acumulación: más secciones, más degradados, más promesas. Axion About va en la dirección contraria. “Through research, creative thinking and iteration we help growing brands realize their digital full potential” hace ese trabajo desde el primer fotograma. La composición se queda en blanco #EDEDEE y deja naranja brillante #F26522 para las acciones, que es suficiente para parecer deliberada. Da a quien lee páginas de SaaS el camino más corto y honesto hasta la oferta.
Hacer tuyo este tipo de página sobre nosotros
La composición es la parte reutilizable; el tema es tuyo. Cambia el titular, mantén la escala tipográfica (tipografía de 12px a 18px) y vuelve a probar el acento #F26522 sobre tu propio material. Si un elemento nuevo no ayuda a explicar la oferta ni el siguiente paso, su sitio está por debajo del pliegue. Conserva el recorte del material: hace tanto trabajo como la tipografía.
Preguntas frecuentes
¿Qué me llevo cuando copio el brief de Axion About?
El brief capturado ocupa 4.393 caracteres y describe la maqueta, la escala tipográfica, la paleta y las transiciones. Copiarlo te da ese texto; si lo mandas a Studio, la misma petición queda preparada con la página ya descrita.
¿Qué puedo hacer con el brief de Axion About una vez lo tengo?
Todo lo que se cita en la página procede del brief capturado de 4.393 caracteres y no de un texto redactado a posteriori. Por eso los números y la prosa concuerdan.
¿Necesito React y Tailwind CSS para recrear Axion About?
Axion About se construyó en React y Tailwind CSS, y la ficha lo dice por procedencia. El brief describe posiciones, tamaños y tiempos, así que se puede reconstruir en cualquier framework capaz de componer tipografía y colocar elementos.
