--- title: "The Grid: marca y sitio web en Webflow | Mattriz Studio" description: "Identidad de marca, sistema visual y sitio web en Webflow para The Grid, consultora de gemelos digitales y BIM. Un lenguaje de diseño audaz y flexible." lang: es url: https://mattriz.com/es/project/the-grid/ --- > Identidad de marca, sistema visual y sitio web en Webflow para The Grid, consultora de gemelos digitales y BIM. Un lenguaje de diseño audaz y flexible. Caso de estudio 2025 # The Grid Identidad visual y sitio web para una consultora de gemelos digitales para la construcción. [Visitar el sitio](https://thegrid.es/) ## En resumen - **Cliente**: The Grid - **Industria**: Construcción · Tecnología de gemelos digitales · B2B - **Qué hicimos**: Identidad de marca, Diseño UI/UX, Desarrollo web, SEO El sitio en vivo, de la portada en video al equipo. El reto Crear una identidad moderna, clara y cercana que posicione a The Grid como líder en la digitalización del sector de la construcción, uniendo el mundo físico y el digital. La marca debe transmitir precisión, innovación y confianza, en línea con su manifiesto (los datos transforman el entorno construido), y funcionar en la web, las presentaciones, las redes y los documentos técnicos. Palabras clave: BIM, gemelos digitales, automatización de flujos de trabajo, IoT, datos en tiempo real, colaboración entre múltiples actores, investigación aplicada. [Ver sitio web](https://thegrid.es/) ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/banner-1600.webp) ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/iphone-14-pro-psd-1600.webp) ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/app-icon-1600.webp) Enfoque Construimos un sistema de marca modular (tipografías Centra No.2 y Neue Haas Grotesk, azul eléctrico con acentos en menta, negro, blanco y gris claro), con reglas claras de área de protección y variantes del logo (logotipo horizontal, isotipo e imagotipo) para darle flexibilidad. Llevamos la identidad a un sitio web rápido e intuitivo (navegación clara, imágenes a gran escala, microinteracciones sutiles, accesibilidad AA) que refuerza la conexión con las soluciones digitales para la construcción. ![Seis servicios en una cuadrícula limpia de tarjetas](https://mattriz.com/media/projects/the-grid/tg-site-services-1600.webp) ![Herramientas: la plataforma de gemelo digital y O-SAM](https://mattriz.com/media/projects/the-grid/tg-site-tools1-1600.webp) Cada herramienta con su captura, un “Learn more” y una forma de probarla. ![MatchFEM, el plug-in para Grasshopper](https://mattriz.com/media/projects/the-grid/tg-site-tools2-1600.webp) ![Proyecto: gemelo digital de una prueba de carga en un puente de alta velocidad](https://mattriz.com/media/projects/the-grid/tg-site-project1-1600.webp) Los proyectos contados como casos, cada uno con su página. ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/captura-de-pantalla-2025-12-04-a-las-11-15-36-p-m-1600.webp) ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/captura-de-pantalla-2025-12-04-a-las-11-15-47-p-m-1600.webp) ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/captura-de-pantalla-2025-12-05-a-las-5-21-14-p-m-1600.webp) ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/captura-de-pantalla-2025-12-05-a-las-5-21-32-p-m-1600.webp) ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/captura-de-pantalla-2025-12-04-a-las-11-15-59-p-m-1600.webp) Lo que hacemos 1. **Estrategia de marca y mensajes clave**: posicionamiento, promesa y un tono profesional y cercano. 2. **Guías de marca**: reglas de uso, qué hacer y qué no, áreas de protección, escalas. 3. **Sistema de identidad**: logotipo e imagotipo/isotipo en positivo, negativo y monocromo. 4. **Sistema de color**: azul eléctrico como principal con menta, negro, blanco y gris claro; contraste AA documentado. 5. **Tipografía**: Centra No.2 y Neue Haas Grotesk; jerarquía, escalas y guía de espaciado. 6. **Sistema de layout y componentes de UI**: grilla responsive, botones, tarjetas, navegación, estados y animación sutil. 7. **Sitio web (Webflow)**: estructura clara; páginas clave (inicio, servicios, casos, contacto); CMS para casos de estudio y servicios. 8. **Accesibilidad y rendimiento**: criterios AA y buenas prácticas; metas de LCP y estabilidad visual. 9. **SEO técnico on-page**: metadatos, encabezados, schema básico, sitemap y robots; guía para los textos. 10. **Analítica y medición**: GA4 y Google Search Console con eventos y objetivos clave. ![Portada de The Grid en el celular](https://mattriz.com/media/projects/the-grid/tg-m-hero-900.webp) ![Servicios en el celular](https://mattriz.com/media/projects/the-grid/tg-m-services-900.webp) ![Un proyecto en el celular](https://mattriz.com/media/projects/the-grid/tg-m-projects-900.webp) ![Research driven: el vínculo con el laboratorio LMDEC](https://mattriz.com/media/projects/the-grid/tg-site-research-1600.webp) ![El equipo fundador](https://mattriz.com/media/projects/the-grid/tg-site-team-1600.webp) ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/captura-de-pantalla-2025-12-05-a-las-5-22-35-p-m-1600.webp) Impacto Una marca y un sitio coherentes, listos para casos de uso técnicos, métricas y captación de clientes B2B. ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/captura-de-pantalla-2025-12-04-a-las-11-16-22-p-m-1600.webp) ![The Grid: pieza del proyecto](https://mattriz.com/media/projects/the-grid/free-l-mockups-macbook-air2-1200.webp) ## Servicios - Sistema de marca - Guías de marca - UI kit - Desarrollo en Webflow - Motion - Accesibilidad AA. ## Herramientas - Figma - Adobe Illustrator - Webflow - Lottie/JSON opcional - GSAP ligero. ## Entregables - Manual de marca (PDF) - Librería de UI - Página de inicio y secciones clave - Colecciones del CMS de Webflow ## Tiempos De 4 a 6 semanas ## ¿Tienes un proyecto en mente? Diseñamos y construimos sitios web, tiendas en línea y sistemas de reservas y pagos, y los mantenemos funcionando mes a mes. [Cuéntanos tu proyecto](https://mattriz.com/es/contact/) [Visita el sitio en vivo thegrid.es](https://thegrid.es/) --- ## Sobre Mattriz Mattriz es un estudio de diseño y desarrollo con sede en Bogotá, Colombia, que trabaja con negocios en Estados Unidos y Latinoamérica. Diseñamos la marca, construimos el sitio, la tienda o el sistema de reservas y pagos, y lo mantenemos funcionando mes a mes. La IA acelera el trabajo; las decisiones siguen siendo nuestras. - Qué hacemos: sistemas de reservas y operación, integración de pagos (Square, Stripe, Wompi), paneles de administración a la medida, automatización y seguimiento, sitios web que convierten. - Cómo trabajamos: un plan mensual para construir, mantener y seguir mejorando. No hacemos proyectos sueltos. - Capacidad: tres clientes activos a la vez, un límite deliberado. - Idiomas: español e inglés. - Contacto: contacto@mattriz.com · https://mattriz.com/es/contact/ - Agenda una llamada gratuita de 30 minutos: https://calendly.com/contacto-mattriz/30min - Escáner gratuito de sitios: https://mattriz.com/es/scan/ - Todo sobre el estudio para asistentes de IA: https://mattriz.com/llms.txt