SeleDev

GymFit

GYMFIT es un sitio web desarrollado en Antigravity, utilizando exclusivamente HTML, CSS y JavaScript (vanilla), sin el uso de frameworks ni librerías externas. El objetivo principal del sistema es simular un entorno funcional de gestión de membresías y servicios para un gimnasio, manteniendo una interfaz moderna, minimalista y completamente interactiva. La aplicación cuenta con una landing page (Hero) que introduce al usuario al sistema, destacando la propuesta del gimnasio y facilitando la navegación hacia las distintas secciones. Dentro del sistema, los usuarios pueden visualizar diferentes planes de membresía (como Básico, Premium o Pro), cada uno con sus respectivos beneficios, precios y duración. Al seleccionar una membresía, el sistema solicita al usuario ingresar información básica (como su nombre), permitiendo asociar dicha membresía a un perfil sin necesidad de autenticación formal. Uno de los aspectos más importantes de GYMFIT es la simulación del flujo real de un gimnasio. Una vez seleccionada una membresía, el usuario puede “pagarla” mediante un sistema de pago simulado, lo que activa su estado. A partir de ese momento, el sistema muestra información relevante como el estado de la membresía (activa o vencida), etc. Además, GYMFIT incorpora una funcionalidad extra que eleva el nivel del proyecto: un catálogo de servicios del gimnasio. En esta sección se presentan distintos servicios adicionales, como entrenamiento personalizado, clases de yoga, crossfit, nutrición deportiva o masajes. Cada servicio se muestra en formato de tarjeta con su descripción y precio, y puede ser agregado a un carrito de compras. El carrito permite gestionar los servicios seleccionados, modificar cantidades, eliminar productos y visualizar el total a pagar. También incluye una simulación de compra, donde el usuario puede finalizar la operación y vaciar el carrito, reforzando la experiencia tipo e-commerce dentro del sistema. Toda la información del sistema, incluyendo usuarios, membresías y carrito de compras, se almacena en localStorage, lo que garantiza persistencia de datos incluso al recargar la página. Finalmente, en términos de diseño, GYMFIT sigue una línea minimalista con predominancia del color naranja como acento, acompañado de tonos neutros como blanco, negro y gris. La interfaz está pensada bajo un enfoque responsive (mobile-first), adaptándose correctamente a distintos tamaños de pantalla mediante el uso de Flexbox y Grid.