Boceto Final de Landing Page para Raíces Viajeras

Explicación

En la primera fase se revisaron los tres bocetos diseñados previamente y se eligió uno de ellos por su claridad en la comunicación y su coherencia con los objetivos del proyecto.
Sin embargo, tras una evaluación más profunda, y al visualizar el diseño web ya implementado se consideró que esa versión resultaba demasiado antigua en estilo y no transmitía la modernidad que el cliente busca para el lanzamiento de 2026.
Por ello, el equipo decidió crear un nuevo boceto con un enfoque minimalista y más actual, manteniendo la simplicidad del flujo y reforzando la identidad visual con un diseño limpio, ordenado y centrado en la experiencia del usuario.

Justificación del Boceto Inicial

El boceto original fue seleccionado tras comparar las tres propuestas individuales. Se eligió por su capacidad para representar la identidad visual del proyecto, su claridad comunicativa y su estructura basada en principios de diseño como la proporción áurea y la teoría Gestalt. Se valoró especialmente la simplicidad del flujo, la jerarquía visual coherente y el enfoque en la experiencia del usuario.

Vista Escritorio Boceto Antiguo

Wireframe vista escritorio

El diseño mantiene una coherencia visual sólida al aplicar principios de Gestalt y la proporción áurea, creando una estructura equilibrada y fluida. La espiral de Fibonacci guía la atención hacia los elementos clave, como el formulario de registro, generando una navegación natural y jerarquizada. Los patrones de semejanza, proximidad y continuidad organizan los contenidos de forma intuitiva, facilitando la comprensión y mejorando la experiencia del usuario. La proporción áurea se refleja en el tamaño y espaciado del título y los textos, aportando armonía visual y reforzando la usabilidad, ya que el recorrido de lectura se produce de manera cómoda y coherente.

Vista Móvil Boceto Antiguo

Wireframe vista móvil

El uso de la proporción áurea y los principios de Gestalt se adapta a un formato vertical que prioriza la claridad y la legibilidad. La espiral de Fibonacci guía la mirada desde el título hasta el formulario de registro, asegurando un flujo visual natural. La proximidad y continuidad estructuran la información en bloques bien definidos, facilitando la lectura y la interacción táctil. Estos recursos proporcionan equilibrio y armonía, logrando una interfaz coherente y estética que favorece la usabilidad y la navegación intuitiva en pantallas reducidas.

Justificación de Actualización del Boceto

Aunque el boceto inicial cumplía con los requisitos fundamentales del cliente, el equipo decidió actualizarlo tras detectar que su estilo visual resultaba demasiado clásico y no reflejaba adecuadamente la modernidad que se busca para el lanzamiento de 2026. Por ello, se desarrolló un nuevo boceto con un enfoque minimalista, más actual y profesional, manteniendo los principios de claridad, estructura ordenada y experiencia de usuario efectiva.

Wireframe boceto lápiz

Esta nueva versión conserva la lógica de bloques del diseño anterior, pero simplifica los elementos visuales, refuerza el protagonismo del CTA y mejora la adaptabilidad responsive. Se ha optimizado el uso del espacio, la tipografía y los contrastes para lograr una estética más limpia y contemporánea, alineada con las expectativas del público objetivo.

Nuevo Boceto Elegido

El nuevo boceto fue creado como respuesta a la necesidad de actualizar la estética del diseño original, que resultaba visualmente desfasado para los estándares actuales. Esta nueva versión mantiene los principios fundamentales del proyecto: "claridad, estructura ordenada y eficacia comunicativa" pero los reinterpreta con un enfoque más moderno y minimalista.

El diseño se apoya en los principios de la teoría Gestalt para organizar los bloques de contenido de forma intuitiva: la proximidad y la semejanza agrupan elementos relacionados, mientras que la continuidad y la simetría guían la navegación del usuario de manera fluida.

Además, el diseño se ha renovado por completo para lograr un aspecto más moderno. El resultado es una landing page más limpia, profesional y acorde con lo que esperan los usuarios actuales, especialmente de cara al lanzamiento de una aplicación web en 2026.

Vista Deskpot Boceto Nueva Landing

Wireframe vista deskpot

La espiral marca el recorrido visual de la página. Guía la mirada desde el menú superior, pasando por los bloques de contenido, hasta llegar al punto más importante: el formulario de registro, que coincide con el centro de la espiral para dirigir al usuario hacia la conversión. Esto hace que la composición sea armónica y fácil de seguir.

En la composición se aplican varios principios de la Gestalt:
- Proximidad: Los elementos relacionados están agrupados (menú, textos, imágenes, formulario).
- Similaridad: Las cajas y textos usan formas y estilos parecidos, lo que da unidad.
- Continuidad: El recorrido visual sigue la espiral de manera natural.
- Figura–fondo: El formulario destaca claramente sobre el resto.

Vista Móvil Boceto Nueva Landing

Wireframe vista móvil Wireframe vista móvil

La espiral de Fibonacci se utiliza para ordenar el recorrido visual de arriba hacia abajo. La curva guía la mirada desde el menú superior, pasando por los textos y botones, hasta llegar al formulario, que coincide con el punto de mayor atención.

Los principios de Gestalt ayudan a que todo sea más fácil de entender en pantalla pequeña:
- Proximidad: los elementos relacionados (campos del formulario, botones, lista) se agrupan en bloques claros.
- Similitud: los campos y botones mantienen un mismo estilo..
- Continuidad: la estructura sigue una línea vertical fluida que coincide con la espiral.

Justificación de la Familia Tipográfica y Colores Elegidos

La familia tipográfica seleccionada se basa en fuentes sans-serif modernas, que transmiten claridad, simplicidad y profesionalidad. Este estilo tipográfico facilita la lectura en pantalla, tanto en dispositivos de escritorio como móviles, y refuerza la identidad minimalista del proyecto. Además, se ha buscado un equilibrio entre títulos con mayor peso visual y textos de párrafo más ligeros, para mantener una jerarquía clara y coherente.

En concreto, se han elegido las tipografías Roboto y Inter. Roboto aporta neutralidad y legibilidad en textos largos y formularios, gracias a su amplia gama de pesos y a su diseño optimizado para pantallas digitales. Por su parte, Inter se emplea en títulos, subtítulos y botones, ya que está diseñada específicamente para interfaces modernas, ofreciendo un aspecto más actual y profesional. La combinación de ambas asegura una jerarquía visual clara, una experiencia de lectura cómoda y una estética coherente con los valores de sostenibilidad y modernidad que busca el proyecto Raíces Viajeras.

En cuanto a la paleta de colores, se ha optado por tonos naturales y neutros (verdes, beige y grises suaves), que evocan la conexión con la naturaleza y la sostenibilidad, valores centrales de Raíces Viajeras. El color principal se utiliza para destacar elementos clave como el CTA (botón de registro), mientras que los secundarios aportan contraste y equilibrio visual. Esta combinación asegura una experiencia estética agradable, coherente con la temática del proyecto y alineada con las expectativas del público objetivo.