Proyecto Web

Motos Julio

Diseño UX/UI y Estrategia de Conversión

Construcción UX/UI

Proyecto de diseño y construcción de la interfaz web de MyRealFood, desarrollado en base a wireframes y siguiendo principios de UX/UI. Se trabajó con un sistema de retículas inspirado en Bootstrap, asegurando una estructura clara y adaptable.

Durante el análisis inicial se observó que MyRealFood no contaba con una versión web, por lo que se diseñó un Home y una página de recetas.

El objetivo principal fue dirigir la conversión hacia la descarga de la aplicación, colocando el CTA en un lugar estratégico y visible.

  • Versión Desktop: 1440 px

  • Sistema de 12 columnas, medianil de 24 px y márgenes de 180 px.

Pincha en la imagen, míralo con mas detalle.

AI - Buscador de inteligencias Artificales

Esta website de UX/UI para la búsqueda de Inteligencias Artificiales fue diseñada para ofrecer una experiencia de usuario óptima y personalizada al interactuar con el buscador.

Durante el proceso se aplicó la metodología Design Thinking, lo que permitió investigar a los usuarios potenciales, analizar los datos obtenidos y transformar esos insights en soluciones efectivas.

Además, la marca fue creada desde sus bases, desarrollando tanto la identidad visual como la interfaz, con el objetivo de lograr una imagen coherente, clara y atractiva.

Pincha en la imagen, míralo con mas detalle.

Diseño Web MyRealFood

Diseño y desarrollo de una web de conversión para Motos Julio, con un enfoque claro en la simplicidad y la efectividad. Se creó una arquitectura de 3 páginas (Home, Productos y Contacto), definida inicialmente mediante wireframes para garantizar una navegación fluida.

El objetivo estratégico fue dirigir al usuario hacia un CTA de llamada telefónica, posicionándolo como acción principal. El resultado fue una web visualmente clara, fácil de usar y orientada a resultados, optimizando tanto la experiencia de usuario como la captación de clientes.

Pincha en la imagen, míralo con mas detalle.

VR Reality: Immersive

Onboarding

Diseño de interfaz para una plataforma de Realidad Virtual enfocada en la simplicidad de acceso.

El reto consistió en crear un flujo de registro y login que mantuviera la estética futurista y envolvente del producto sin sacrificar la claridad funcional.

Utilizando una paleta de altos contrastes con neones sobre fondos oscuros, se optimizó la jerarquía visual de los campos de entrada y botones de acción para reducir la carga cognitiva del usuario durante su primer contacto con el ecosistema inmersivo.

Pincha en la imagen, míralo con mas detalle.

Los Gigantes también corren

UX Research · Atomic Design System · Diseño Visual

Este proyecto nació de la confianza de Quijote Maratón en su 30ª edición: un rediseño integral centrado en el usuario (Design Thinking), abordando tanto la identidad visual como la arquitectura de la información y la estrategia de contenido.

Desarrollado sobre WordPress, el proyecto integró metodologías de ideación asistida por IA, optimizando tiempos de ejecución y reduciendo fricción en cada fase del proceso de diseño.

Proceso, metodología y stack de herramientas

A continuación se documenta el proceso completo del proyecto: desde la fase de descubrimiento hasta el High-Fi, detallando las herramientas utilizadas, los problemas detectados y las decisiones de diseño adoptadas en cada etapa.

La implementación se realizó en WordPress con el page builder Divi, aplicando conocimientos de HTML y CSS para garantizar precisión en la maquetación y asegurar una gestión de contenido autónoma y escalable por parte del cliente.

Esta sección documenta en profundidad la fase de Discovery & Research, el punto de partida de todo proceso de diseño centrado en el usuario. Cada entregable presentado puede explorarse en detalle accediendo directamente a las imágenes, donde se recoge el análisis completo de cada artefacto generado durante esta etapa.

A través de una investigación cualitativa y cuantitativa, se identificaron los principales insights que condicionaron las decisiones de diseño a lo largo de todo el proyecto. Este proceso permitió detectar fricciones reales en la experiencia del usuario, establecer oportunidades de mejora concretas y construir una base sólida de conocimiento sobre la que fundamentar cada decisión de diseño posterior.

Discovery & Research

Visual Design System & Atomic Design

Esta sección recoge el desarrollo completo del Sistema de Diseño Visual del proyecto: desde la definición de la identidad gráfica hasta la construcción de cada componente de interfaz, documentando las decisiones estéticas y funcionales que dan coherencia visual a toda la experiencia digital.

Cada elemento del sistema fue diseñado de forma individualizada pero bajo una misma lógica estructural, garantizando coherencia visual y consistencia funcional en todos los puntos de contacto de la interfaz. Este enfoque basado en Atomic Design permitió escalar los componentes de forma eficiente, reduciendo la deuda de diseño y facilitando tanto la implementación como el mantenimiento futuro del producto.

Pincha en la imagen, míralo con mas detalle.

Pincha en la imagen, míralo con mas detalle.

Pincha en la imagen, míralo con mas detalle.

Ideación & Arquitectura de la Información

La fase de Ideación y Arquitectura de la Información constituye el esqueleto estratégico del proyecto. En esta etapa se analizó en profundidad la estructura de navegación existente, identificando redundancias, secciones huérfanas y flujos de usuario ineficientes que generaban fricción en la experiencia. A partir de ese diagnóstico, se redefinió completamente la jerarquía de páginas y secciones, simplificando la navegación y priorizando los contenidos de mayor valor para el usuario. Paralelamente, se abordó la optimización técnica del rendimiento web: compresión y redimensionado de imágenes, reducción de elementos prescindibles y mejora de los tiempos de carga, factores que impactan directamente tanto en la experiencia del usuario como en el posicionamiento SEO.

En Brainstorm creemos que el buen diseño no es casualidad, es método. Combinamos los principios del diseño UX/UI con procesos de trabajo potenciados por inteligencia artificial para crear experiencias digitales que conectan con las personas y funcionan con precisión. Desde la arquitectura de la información hasta el sistema visual, cada decisión tiene un propósito claro: construir productos digitales que sean tan intuitivos como memorables.

UXUI & Product

Pincha en la imagen, míralo con mas detalle.