# 3Devs — Dirección de arte, sistema web modular y producción visual asistida por IA para tecnología de comercio electrónico

> Caso de estudio: Dirección de arte, sistema web modular, producción visual con IA y UI design para 3Devs, firma de tecnología de comercio electrónico en CDMX.

Web Design / Art Direction / Motion Design / AI Visual Production

Dirección de arte y diseño del ecosistema digital para 3Devs: compañía de tecnología de comercio electrónico en la Ciudad de México especializada en operaciones escalables de eCommerce, marketplaces, gobernanza de catálogos y logística para LATAM y EE. UU.

Reposicionamiento desde 3Dadv hacia firma de commerce technology — sistema web modular, imaginería dirigida con IA y encuadre visual del Agent Model y las plataformas propias Seller Center, Nova Content Commerce y ShippHub.

- **Cliente:** 3Devs (anteriormente 3Dadv)
- **Industria:** Commerce Technology / eCommerce
- **Ubicación:** Ciudad de México, México
- **Año:** 2026
- **Duración:** 1 mes
- **Presupuesto:** $3K USD
- **Rol:** Art Director / Senior Web & Motion Designer
- **Plataformas:** Responsive Website
- **Herramientas:** Figma / After Effects / Midjourney / Photoshop / Illustrator
- **Entregables:** Art Direction
- **:** Website Design
- **:** Design System
- **:** Responsive Screens
- **:** Reusable Templates
- **:** Interactive Prototypes
- **:** Module Animations
- **:** Micro-interactions
- **:** AI Visual Direction
- **:** Project Mockups

## Resumen

3Devs se enfrentaba a un punto de inflexión estratégico: evolucionar su identidad previa (3Dadv) y dejar atrás la percepción tradicional de "agencia de desarrollo" o empresa de staffing técnico. El objetivo del negocio era posicionarse como una firma líder en tecnología de comercio electrónico capaz de construir arquitecturas complejas, integrar ecosistemas y desplegar plataformas propias.

El reto de diseño consistía en estructurar y comunicar con claridad dos pilares complejos: su diferenciado Modelo de Agentes (Agent Model respaldado por arquitectos senior) y su suite de plataformas propietarias (Seller Center, Nova Content Commerce y ShippHub). Creé un sistema visual modular que combina tipografía audaz y condensada (Finlandica), superficies editoriales cálidas, entornos técnicos en Dark Mode e imaginería cinematográfica. Cada recurso visual generado por inteligencia artificial fue rigurosamente dirigido y editado para mantener un estándar ejecutivo impecable en todo el sitio, pantallas responsivas y piezas de motion.

## 01 Dirección de arte y posicionamiento corporativo

Para distanciar a 3Devs del aspecto genérico de las agencias de software, desarrollé un lenguaje visual que transmite autoridad, precisión técnica y madurez corporativa. La paleta central mantiene el contraste del negro, amarillo y blanco, utilizando el amarillo exclusivamente como acento de acción para no saturar la lectura.

• Jerarquía tipográfica: Implementación de la tipografía Finlandica para encabezados, aportando un carácter técnico, audaz y de alta legibilidad que estructura los mensajes comerciales.

• Narrativa visual: Transición armónica de fondos oscuros para secciones de alto impacto (Hero y plataformas) a bloques blancos y grises limpios para facilitar la lectura en descripciones de servicios y metodologías.

## 02 Sistema web modular y plantillas reutilizables (Design System)

En lugar de diseñar páginas aisladas, construí un sistema de diseño responsivo basado en componentes escalables y siete plantillas reutilizables (Home, Hubs de servicio, Detalle de servicio, Modelo de Agentes, Detalle de plataforma, Casos de estudio e Insights).

• Arquitectura escaneable: Tarjetas modulares para presentar su oferta técnica: Desarrollo y Soporte, Arquitectura y Discovery, Integraciones y Middleware, Operaciones de Marketplace y Optimización continua.

• Diferenciación del Agent Model: Diseño de tablas comparativas y diagramas visuales que explican por qué un talento respaldado por directores técnicos y metodologías ágiles es superior al staffing tradicional o freelancers.

## 03 Producción visual asistida por IA y diseño de producto

El ecosistema de 3Devs requería ilustrar conceptos abstractos como middleware, orquestación logística, catálogos gobernados por IA y flujos omnicanal.

• Dirección de IA (Midjourney): Generación y retoque de imaginería abstracta y entornos tecnológicos, unificando color, iluminación y textura para evitar el aspecto predeterminado de la inteligencia artificial.

• UI Mockups para plataformas IP: Creación de interfaces y contenedores visuales para sus tres productos estrella: Seller Center (gobernanza de marketplaces), Nova Content Commerce (enriquecimiento de catálogos con IA) y ShippHub (orquestación logística multicanal).

## 04 Motion Design, prototipado y microinteracciones

El movimiento se utilizó de forma consultiva para demostrar la velocidad, fluidez y solidez de las operaciones digitales que construye 3Devs. Mediante prototipos interactivos en Figma y estudios en After Effects, definí transiciones de entrada, comportamientos de navegación, animaciones modulares y microinteracciones en las tarjetas de servicio y llamados a la acción (CTAs).

## 05 El resultado: una plataforma comercial lista para escalar

El nuevo ecosistema digital consolidó a 3Devs como un socio tecnológico indispensable para marcas de comercio electrónico en México, LATAM y en su futura expansión hacia Estados Unidos. La plataforma no solo optimiza la conversión de leads cualificados (CTOs, líderes de comercio y agencias), sino que dota al equipo interno de una infraestructura visual ágil y escalable para seguir creciendo.

3Devs definió la estrategia de posicionamiento, arquitectura del sitemap, redacción de contenidos (copy), conceptualización de sus plataformas y el desarrollo web. Mi contribución se enfocó en la dirección de arte, diseño web, sistema responsivo, producción visual con IA, prototipado y dirección de motion design.

Website: https://3devs.mx/

HTML: https://www.giovidaurri.com/es/casos-de-estudio/3devs/