Entre bastidores

La pantalla de inicio de MyProgram,
versión a versión.

Del 6 de enero al 25 de septiembre de 2026: 42 versiones de la pantalla de inicio, recompiladas a partir del código de su época y fotografiadas como en un teléfono Android, con el mismo atleta ficticio.

  • 42 versiones renderizadas
  • 262 días de historia
  • 63 días sin tocar la pantalla de inicio, del 14 de enero al 18 de marzo
  • 8 versiones entre el 23 y el 25 de septiembre

La película

Nueve meses, en 42 imágenes.

Desliza entre las versiones, pulsa reproducir o usa las flechas del teclado.

Pantalla de inicio de App Muscu 1.0.0, 6 de enero de 2026

Versión 1 de 42

6 de enero de 2026

Época azul App Muscu 1.0.0

Pantalla fechada el miércoles, 7 de enero, a las 8:15.

Etapa La sesión del día

6 ene 25 sept

marca las versiones comentadas más abajo.

Las etapas

Catorce giros, en cuatro épocas.

Cada pantalla se desplaza con el dedo o con la rueda del ratón, hasta la barra de pestañas.

Las pantallas se muestran en francés, el idioma original de la app.

Los comienzos

Enero

App Muscu se convierte en MyProgram en ocho días. Fondo negro, tarjetas grises, azul para los estados.

Pantalla de inicio de App Muscu 1.0.0, 6 de enero de 2026

6 de enero de 2026 App Muscu 1.0.0

La sesión del día

La primera pantalla de inicio cabe en una tarjeta: la sesión prevista para hoy, su programa y dos botones para aplazarla o darla por hecha. La app todavía se llama App Muscu y solo tiene tres pestañas.

Verla en la película

Pantalla de inicio de MyProgram 1.0.0, 14 de enero de 2026

14 de enero de 2026 MyProgram 1.0.0

Mi semana

Ocho días después, la app pasa a llamarse MyProgram y la pantalla de inicio despliega toda la semana. Cada día tiene su subtítulo y cada tarjeta su etiqueta de estado: hoy, próxima o atrasada. Cada sesión se puede aplazar o validar. El Perfil se convierte en la cuarta pestaña.

Verla en la película ↕ la pantalla se desplaza

La semana se amplía

Marzo – abril

La pantalla de inicio sigue siendo una lista de días. Las tarjetas muestran primero un avance de los ejercicios y luego su detalle completo.

Pantalla de inicio de MyProgram 1.2.0, 18 de marzo de 2026

18 de marzo de 2026 MyProgram 1.2.0

Un avance de los ejercicios

Tras dos meses sin tocar la pantalla de inicio, un encabezado centrado sustituye al de la navegación. Bajo el título de cada sesión aparecen los tres primeros ejercicios y el número de los siguientes. La pestaña Sesiones pasa a llamarse Templates y deja la barra dos días después.

Verla en la película ↕ la pantalla se desplaza

Pantalla de inicio de MyProgram 2.0.0, 5 de abril de 2026

5 de abril de 2026 MyProgram 2.0.0

Los botones entran en la tarjeta

Aplazar y validar pasan al interior de la tarjeta, bajo un filete. Una sesión futura ya no se valida, solo se aplaza. Cuando la semana en curso está vacía, la pantalla de inicio muestra la siguiente. El resto de la v2.0.0 trata del asistente de creación de programas y de la generación con IA.

Verla en la película ↕ la pantalla se desplaza

Pantalla de inicio de MyProgram 2.1.0, 8 de abril de 2026

8 de abril de 2026 MyProgram 2.1.0

La sesión detallada

Cada tarjeta despliega sus ejercicios, numerados, con series, repeticiones y cargas. Tocar un ejercicio abre un tutorial de YouTube, y la nota del coach cierra la lista. Para llegar ahí, las sesiones dejan de ser texto libre: ahora se guardan en JSON estructurado.

Verla en la película ↕ la pantalla se desplaza

La época Volt

Abril – agosto

Toma forma una verdadera pantalla de inicio: franja de la semana, gran tarjeta de sesión y luego una tarjeta por tema. El verde volt firma la app.

Pantalla de inicio de MyProgram 2.1.0, 19 de abril de 2026

19 de abril de 2026 MyProgram 2.1.0

El rediseño v3

La primera pantalla de inicio diseñada como una pantalla. Arriba, el logo y el avatar. Luego la franja de la semana: blanco para lo hecho, un círculo para hoy, volt para lo que viene. La próxima sesión ocupa una gran tarjeta volt, con sus etiquetas y un botón para empezar. Dos defectos de juventud: el logo negro se pierde sobre el fondo y la tarjeta muestra el JSON en bruto de la sesión, corregido ocho días después.

Verla en la película ↕ la pantalla se desplaza

Pantalla de inicio de MyProgram 3.0.0, 27 de abril de 2026

27 de abril de 2026 MyProgram 3.0.0

La tarjeta despliega la sesión

La tarjeta volt enumera los ejercicios bajo la nota del coach. Debajo, una lista de la semana alinea las demás sesiones en filas compactas, con un filete del color de la disciplina: volt para el fitness, azul para el running. El 2 de mayo, la pestaña Clasificación se une a la barra.

Verla en la película ↕ la pantalla se desplaza

Pantalla de inicio de MyProgram 3.6.8, 5 de junio de 2026

5 de junio de 2026 MyProgram 3.6.8

El color de la disciplina

La víspera, las sesiones pasan a la v2: ejercicios estructurados y tipo de sesión (Gimnasio, Running, Hyrox…). La gran tarjeta abandona el volt fijo por el color de su disciplina, verde agua para el gimnasio. El botón sigue siendo negro y toma ese color para su texto.

Verla en la película ↕ la pantalla se desplaza

Pantalla de inicio de MyProgram 4.0.0, 15 de julio de 2026

15 de julio de 2026 MyProgram 4.0.0

La pregunta del día

Una tarjeta se instala en lo alto de la pantalla de inicio: la pregunta del día, con su racha de días seguidos y su notificación. Mientras tanto, la barra ha cambiado: el 18 de junio entran las Ligas y sale el Perfil, que ahora se abre desde el avatar.

Verla en la película ↕ la pantalla se desplaza

Pantalla de inicio de MyProgram 4.1.0, 24 de agosto de 2026

24 de agosto de 2026 MyProgram 4.1.0

Una pantalla de inicio en tarjetas

La lista de sesiones de la semana deja la pantalla de inicio. Bajo la tarjeta de sesión llegan dos tarjetas: la nutrición del día, con las calorías restantes y las proteínas, y la clasificación, con el top % y el número de marcas registradas. Nutrición, que entró en la barra el 12 de agosto, lleva ahora una etiqueta BETA.

Verla en la película ↕ la pantalla se desplaza

Dark Glow

Septiembre

Ocho versiones en tres días. El rojo, el vidrio, el relieve topográfico y la forma del día, que llega a la pantalla de inicio.

Pantalla de inicio de MyProgram 4.3.3, 23 de septiembre de 2026

23 de septiembre de 2026 MyProgram 4.3.3

Dark Glow

En una tarde, la app cambia de piel. El rojo sustituye al volt, IBM Plex Sans y JetBrains Mono sustituyen a la fuente del sistema, y la barra de pestañas se convierte en una cápsula de vidrio flotante. La pantalla de inicio sigue media hora después: un fondo topográfico bajo un halo rojo que no se desplaza, un gran título, días en pastillas.

Verla en la película ↕ la pantalla se desplaza

Pantalla de inicio de MyProgram 4.3.3, 23 de septiembre de 2026

23 de septiembre de 2026 MyProgram 4.3.3

Las tarjetas de la mañana

Cinco minutos después, la pestaña Forma llega a la pantalla de inicio. Por la mañana, una tarjeta pregunta cómo va una molestia declarada, aquí en la rodilla, de 0 a 10. La barra reúne ahora Inicio, Programas, Nutrición y Forma.

Verla en la película ↕ la pantalla se desplaza

Pantalla de inicio de MyProgram 4.3.3, 24 de septiembre de 2026

24 de septiembre de 2026 MyProgram 4.3.3

Un solo encabezado, una sesión plegada

Al día siguiente llegan los comentarios desde el teléfono. JetBrains Mono desaparece y queda una sola fuente. El logo se centra sobre el título, como en la pestaña Nutrición. La tarjeta de sesión se pliega a su título, su nota, sus etiquetas y su botón: los ejercicios se quedan dentro de la sesión.

Verla en la película ↕ la pantalla se desplaza

Pantalla de inicio de MyProgram 4.3.3, 25 de septiembre de 2026

25 de septiembre de 2026 MyProgram 4.3.3

Hoy

La forma del día se intercala entre la franja y la sesión: sueño, VFC, frecuencia cardíaca en reposo y la propuesta del día cuando una molestia lo requiere. El botón pasa a abrir la sesión cuando no lanza directamente el entrenamiento. Detrás del avatar, un buzón de notificaciones.

Verla en la película ↕ la pantalla se desplaza

Cómo lo hicimos

El código real, no maquetas.

  1. Para cada versión, el código de la app se extrae tal como era ese día, desde su historial de git.
  2. Se compila para el navegador con react-native-web. La app cree estar en Android. Las funciones propias del teléfono (widgets, salud, suscripciones, notificaciones) se sustituyen por dobles inertes, y el servidor por una pequeña base de datos ficticia.
  3. La barra de pestañas, los iconos y las fuentes son los de la época: Roboto y los emojis de Android, y luego IBM Plex cuando la app la adopta.
  4. El mismo atleta ficticio en todas partes: un programa Push Pull Legs y un plan de medio maratón, lunes y martes hechos, la sesión Pull prevista para hoy.
  5. El reloj se congela a las 8:15 del miércoles de la semana de cada versión. Cada pantalla se fotografía en 384 × 832 puntos.

No son capturas de la época. Los datos son inventados, la barra de estado está dibujada y las pantallas no responden al tacto. Los defectos visibles, en cambio, son originales.

La última versión cabe en tu bolsillo.

Descárgala en Google Play
Oui →