Rubén RomeroDiseñador UX/UI y Frontend
Todo el trabajo

Plataforma Inmobiliaria: Arquitectura de Información B2B/B2C

La web de una inmobiliaria local con recorridos separados para quien compra y quien vende, valoración de viviendas y un programa para militares. Diseño UX/UI y desarrollo frontend.

Home de la inmobiliaria en escritorio y en móvil: vista aérea de una ciudad con montañas detrás y el buscador de viviendas.
Cliente
Inmobiliaria y notaría local (Colorado, EE. UU.)
Rol
Diseño UX/UI, Desarrollo frontend
Año
2026
Equipo
Equipo de Twelve Legs Marketing
Herramientas
Figma

Contexto

Una inmobiliaria local de Colorado, que además ofrece servicios de notaría, quería una web nueva. Su valor está en conocer la zona y acompañar a cada cliente de principio a fin, algo que los grandes portales inmobiliarios no transmiten.

Lo hice con el equipo de Twelve Legs Marketing: diseñé la web completa y me encargué del desarrollo frontend. El proyecto es confidencial, así que la marca, las direcciones y los textos que la identificaban aparecen cambiados en las imágenes.

Reto

Una agencia pequeña compite con portales que tienen todas las viviendas y todos los filtros. La web no podía ganar en volumen, así que tenía que ganar en confianza y cercanía: explicar cómo trabajan, dar motivos para contactar y mostrar quién hay detrás.

Además, comprador y vendedor llegan con preguntas muy distintas, y los dos procesos son largos y generan inquietud.

Proceso

Diseñé la home, las páginas de compradores y de vendedores, la de la agencia, el aviso de privacidad, la página de gracias y la 404, sobre un sistema sencillo: una serif clásica para los titulares, fondos claros, un azul acero para las acciones y fotografía de la zona.

Cada público tiene su página, con su propio recorrido paso a paso, sus ventajas y sus testimonios. La home reparte hacia las dos y concentra lo que sirve a todos: viviendas destacadas, valoración de la vivienda y acceso a los buscadores MLS de la zona.

Home en escritorio: titular sobre una vista aérea con montañas, propuesta de valor, viviendas destacadas y bloque de valoración de la vivienda.
La home: propuesta de valor, viviendas destacadas y valoración. Marca y direcciones ficticias.

Solución

  • El proceso, explicado. Compradores y vendedores tienen su recorrido en pasos numerados (nueve para comprar, once para vender) que cuentan qué pasa en cada momento y en qué ayuda la agencia.
  • Valoración como puerta de entrada. «¿Cuánto vale tu casa?» explica en tres pasos qué recibe el propietario, sin compromiso, y es la llamada a la acción principal para vendedores.
  • Viviendas destacadas sin competir con los portales. Una selección de fichas con precio y datos básicos, y enlaces directos a los buscadores MLS para quien quiere ver todo el mercado.
  • Un programa para militares. Una sección propia presenta la ayuda económica para militares en activo y veteranos, en una zona con mucha presencia militar.
Recorrido del comprador en nueve tarjetas numeradas, desde el presupuesto hasta el día de la firma.
El recorrido del comprador, de «¿cuál es tu presupuesto?» al día de la firma.
Sección de agradecimiento a militares con texto, botón hacia la ayuda económica y fotografía de una bandera al atardecer.
El programa de ayuda para militares en activo y veteranos.

Versión móvil

Para este portfolio he adaptado a móvil las pantallas clave con el mismo sistema. El menú ocupa la pantalla y suma un acceso directo a la valoración, los recorridos pasan a una línea vertical de pasos y las fichas de viviendas se apilan con la información básica a la vista.

Tres pantallas móviles: home, menú a pantalla completa y viviendas destacadas.
Home, menú y viviendas destacadas en móvil.
Tres pantallas móviles: recorrido del comprador en pasos, valoración de la vivienda y programa para militares.
Recorrido del comprador, valoración y programa para militares en móvil.

Resultado

La web está en producción: explica cómo trabaja la agencia, tiene en la valoración su principal llamada a la acción para propietarios y se distingue de los portales por cercanía y confianza.