BCN --:--
06 / 06Primer proyecto del máster · Landing page

Travel Beyond

Una landing page para una empresa que vende viajes al espacio — mi primer proyecto de UX/UI, rediseñado dos años después para ver cuánto he avanzado.

Rol
Diseñadora UX/UI
Duración
Dic. 2023 · Rediseño 2026
Contexto
Máster en Diseño de Experiencias Digitales, BAU
Tipo
Académico · Landing page
Herramientas
Figma · Photoshop · VS Code
Final redesign hero: Earth at the centre, upcoming launches and experience cards, one orange button
01 — Dónde empezó

Mi primer proyecto de UX/UI.

Travel Beyond fue el primer proyecto de diseño de mi Máster en Diseño de Experiencias Digitales en BAU Barcelona. El encargo: una landing page para escritorio y móvil para una empresa que promete viajes al espacio en un máximo de tres años.

El objetivo no era solo informar — era hacer sentir la atracción del espacio y que la gente dejara sus datos para formar parte de él.

02 — El proceso de 2023

De una guía de prioridades al código.

Ordené lo que tenía que decir la página — propuesta de valor, beneficios, testimonios, registro, pie — lo esbocé en papel, lo refiné en wireframes de fidelidad media en Figma, creé un pequeño sistema de diseño y un prototipo navegable, y finalmente lo programé en HTML, CSS y JavaScript.

  1. Guía de prioridades
  2. Bocetos en papel
  3. Wireframes mid-fi
  4. Sistema de diseño
  5. Hi-fi + prototipo
  6. HTML · CSS · JS
Paper sketches of the desktop and mobile landing page
Mid-fidelity wireframes in Figma
Bocetos en papel y después wireframes de fidelidad media en Figma
Design system: brown, orange, night blue, Ethnocentric and Rubik
Marrón, naranja y azul noche · Ethnocentric + Rubik
03 — Dos años después

Rediseñado para ver cuánto he avanzado.

En 2026 volví a él con todo lo que he aprendido desde entonces — investigación, sistemas de diseño y construir productos reales. El mismo encargo, las mismas fuentes — Ethnocentric y Rubik — y los mismos textos y fotos como punto de partida.

Lo que ha cambiado es cómo toma decisiones la página — y la atmósfera: de un cartel sepia a un escenario oscuro y tranquilo donde hablan el planeta y una sola llamada a la acción.

2023 hero: centred title and button over the planet scene
2023 — Original
Final redesign hero: Earth at the centre, upcoming launches and experience cards, one orange button
2026 — Rediseño
04 — Qué ha cambiado

Menos cosas, dichas más alto.

  1. 01
    Una portada que vende el viajeEl planeta ocupa el centro con un solo botón naranja, los próximos lanzamientos a un lado y las experiencias al otro — la página responde «¿adónde puedo ir y cuándo?» antes de hacer scroll.
  2. 02
    Negro, con un naranja que significa algoEl marrón y el azul noche dejan paso a paneles casi negros. El naranja se reserva para lo que se puede hacer: el botón, el estado activo, las fechas y los números.
  3. 03
    Secciones numeradasCada sección es un panel redondeado con una sola función y un número, para que la página se lea como un viaje del 01 al 05.
  4. 04
    Una voz cada vezLos testimonios son ahora una lista de nombres junto a una sola cita y un retrato grandes, en lugar de tres columnas pequeñas compitiendo por la atención.
  5. 05
    Un formulario que pide menosDos columnas de campos suaves, un solo botón claro — y ningún «Cancelar» en una landing page.
2023 testimonials: three small columns
2023 — Tres columnas
Final redesign testimonials: list of names, portrait and one large quote
2026 — Una voz cada vez
2023 sign-up form with boxed fields and a Cancel button
2023 — Campos en caja y Cancelar
Final redesign sign-up: two columns of fields and one orange button
2026 — Un solo botón claro
05 — Móvil

Pensado también para el pulgar.

En el móvil la portada solo mantiene el planeta, el título y el botón; los lanzamientos y las experiencias pasan a su propio panel, los beneficios se convierten en una fila que se desliza y el formulario en una sola columna.

Final redesign hero on mobile
Launches and experience cards on mobile
Sign-up form on mobile
Rediseño 2026 — móvil 390
06 — Iteraciones

El primer rediseño se quedó más cerca del original.

La primera versión mantenía el marrón, el naranja y el azul noche y la escena original del planeta, y arreglaba la estructura. Funcionaba — pero aún parecía de 2023. Llevarla a un escenario negro y más tranquilo es lo que hizo que el rediseño se sintiera nuevo.

2026 hero: full-screen scene, left-aligned title, info row and slide controls
Iteración 1 — escena cálida a pantalla completa
Final redesign hero: Earth at the centre, upcoming launches and experience cards, one orange button
Iteración 2 — final
07 — Resultado

Qué me enseñó el rediseño.

La página de 2023 seguía el proceso paso a paso. La de 2026 toma decisiones: qué mostrar primero, qué quitar y cuál es lo único que pide.

Ponerlas una al lado de la otra es la medida más clara que tengo de cómo han cambiado mi mirada — y mi criterio — desde mi primer proyecto.

2
años entre versiones
2
iteraciones del rediseño
1
llamada a la acción
Siguiente proyecto — 01 / 06Venu