Plataforma web para comunicar ciberinteligencia con autoridad

Forxite Intelligence es una plataforma web institucional para comunicar inteligencia de riesgo digital, anticipación de amenazas, fraude y exposición online.

El proyecto combina Astro, React, TypeScript, despliegue en Cloudflare Pages, una API serverless de contacto, SEO técnico avanzado y una experiencia visual basada en partículas interactivas. La web está pensada para transmitir precisión, seguridad y autoridad en un dominio donde la confianza importa tanto como la estética.

Objetivo del proyecto

Forxite necesitaba una presencia digital que no se sintiera genérica. El producto comunica ciberinteligencia, análisis de exposición y riesgo digital; por eso la interfaz debía sostener una identidad seria, técnica y corporativa sin caer en una estética plana.

La solución tenía que resolver cuatro objetivos:

• Presentar servicios especializados de forma clara.
• Dar señales técnicas de confianza desde SEO, estructura y contenido.
• Convertir visitas en solicitudes de análisis.
• Mantener una arquitectura preparada para sumar nuevas páginas, servicios y piezas comerciales.

El resultado es un sitio institucional orientado a negocio, pero construido con base técnica de producto: rutas dinámicas, componentes organizados, datos estructurados, API propia y experiencia interactiva controlada.

Stack tecnológico

Forxite usa un stack moderno que permite combinar rendimiento, interactividad y lógica serverless sin cargar el sitio con complejidad innecesaria.

La elección de Astro como base permite entregar una web rápida y fácil de indexar. React se reserva para piezas que necesitan interacción real, evitando convertir todo el sitio en una SPA cuando no hace falta.

Arquitectura por features

El proyecto está organizado por dominio de pantalla y responsabilidad, no como una lista plana de componentes. Cada sección principal vive en su propia feature, con carpetas para componentes, constantes, tipos, hooks, utilidades y estilos.

Esta separación aporta tres ventajas claras:

1. Escalabilidad: nuevas páginas pueden agregarse sin tocar toda la aplicación.
2. Mantenibilidad: cada feature concentra su propia lógica y estilos.
3. Claridad: al abrir el código, la estructura comunica qué parte del sitio resuelve cada módulo.

Las páginas funcionan como entrada de navegación y delegan en features. Ese patrón evita que pages se convierta en una carpeta con lógica mezclada y mantiene el proyecto más fácil de leer.

Servicios dinámicos con registry pattern

Uno de los puntos más importantes del sitio es la presentación de servicios. Forxite trabaja con varias líneas de valor: análisis de riesgo digital, fraude, exposición, monitoreo y respuesta. En vez de duplicar páginas manualmente, el proyecto usa un registro de servicios con contenido estructurado.

Cada servicio puede tener secciones tipadas como:

• Texto explicativo.
• Listas de beneficios.
• Cards de capacidades.
• Pasos de proceso.
• Callouts para mensajes clave.
• Recursos descargables.

Este enfoque permite generar páginas consistentes, mantener el contenido ordenado y escalar el catálogo sin reescribir layouts. También mejora SEO, porque cada servicio tiene su propia URL, metadata y estructura semántica.

SEO técnico por intención

Forxite incorpora SEO técnico desde la arquitectura. El sitio no usa un único schema genérico para todo; cada tipo de página recibe datos estructurados según su intención.

La implementación contempla:

• WebSite y Organization para reforzar entidad de marca.
• Service para páginas comerciales.
• ItemList para listados de servicios.
• WebPage para páginas informativas.
• BreadcrumbList para navegación semántica.
• ContactPage y ContactPoint para contacto.

Además, el sitio incluye sitemap dinámico, robots.txt generado como endpoint, canonical URLs, Open Graph y Twitter Cards. Todo esto mejora la lectura del sitio por buscadores y asistentes, especialmente en un rubro donde la claridad semántica ayuda a diferenciar servicios técnicos.

API de contacto serverless

La captación de consultas se resuelve con una API propia en Cloudflare Functions. Esto evita depender de formularios embebidos y permite controlar validaciones, errores y entrega de mensajes.

La función de contacto aplica varias capas de protección:

• Validación de método HTTP.
• Validación de content-type.
• Límite de tamaño del body.
• Honeypot para bots.
• Validación de email.
• Límites de longitud por campo.
• Escape HTML para evitar inyección en emails.
• Integración con Resend.
• Respuestas claras ante errores.

Este enfoque convierte el formulario en una pieza confiable del producto. No es solo una UI; es un canal de contacto con lógica de seguridad y control operativo.

Experiencia visual con partículas

La identidad visual de Forxite se apoya en un hero oscuro, tecnológico y dinámico. El fondo de partículas aporta sensación de red, vigilancia y análisis sin depender de videos pesados.

La configuración no es decorativa al azar. El sistema adapta cantidad de partículas según viewport y contempla condiciones de dispositivo. También limita interacciones a contextos donde tienen sentido, como hover en desktop.

Esto permite mantener una estética de alto impacto sin perder control sobre rendimiento ni accesibilidad.

Motion responsable y accesibilidad

Un sitio de ciberinteligencia puede usar motion para reforzar profundidad, pero debe evitar fricción. Por eso Forxite contempla señales de accesibilidad y capacidad del dispositivo.

Patrones aplicados:

• Respeto por prefers-reduced-motion.
• Reducción o desactivación de partículas cuando corresponde.
• Interacciones solo en dispositivos con hover real.
• Navegación semántica con <nav>, <main> y <footer>.
• Labels accesibles en elementos interactivos.
• Estados de menú mobile con atributos ARIA.

La experiencia busca sentirse sofisticada, pero no obligar a todos los usuarios a consumir el mismo nivel de movimiento.

Design system oscuro

Forxite trabaja con un sistema visual basado en tokens CSS. Colores, fondos, bordes, sombras, tipografías, transiciones y superficies están definidos desde variables reutilizables.

Esto permite mantener consistencia entre home, servicios, contacto y páginas internas. También facilita iterar diseño sin tocar cada componente a mano.

El resultado visual comunica seguridad y análisis: base oscura, acentos verdes, contraste alto y composición enfocada en mensajes fuertes.

Resultado

Forxite quedó como una plataforma institucional sólida para un producto de inteligencia digital. El sitio combina presencia comercial, arquitectura escalable, experiencia visual interactiva, SEO técnico y backend serverless.

Lo valioso del proyecto está en la coherencia entre rubro y ejecución: ciberinteligencia necesita transmitir confianza, precisión y capacidad técnica. La web acompaña esa promesa con decisiones concretas en estructura, rendimiento, seguridad y contenido.

Lo más importante que resolvió el proyecto

• Identidad digital fuerte para un producto de riesgo digital.
• Arquitectura Astro + React con separación por features.
• Servicios dinámicos preparados para crecer.
• SEO técnico con Schema.org por intención.
• API de contacto serverless con validaciones reales.
• Motion interactivo controlado por contexto y accesibilidad.
• Design system oscuro consistente y escalable.

Forxite demuestra cómo una web institucional puede funcionar como una capa estratégica de producto: comunica autoridad, organiza servicios, abre canal comercial y sostiene una base técnica lista para evolucionar.