Streamix UI
Recursos del proyecto
Tecnologias
Funcionalidades
Resumen
Desarrollo de una interfaz web inspirada en plataformas de streaming, pensada para poner a prueba habilidades avanzadas de UI/UX, responsive design y gestion de contenidos dinamicos. El objetivo era recrear una experiencia creible de estilo streaming, con catalogo dinamico, navegacion fluida y microinteracciones, manteniendo coherencia visual en todos los dispositivos. Se presto especial atencion al layout, spacing y animaciones para mejorar la percepcion de calidad del producto.
Rol
Diseno de la interfaz y desarrollo frontend, con foco en responsive design avanzado, componentizacion UI, calidad visual, interacciones y gestion de datos desde API.
Que hice
Construi una homepage de estilo streaming con hero dinamico, filas en carrusel horizontal y tarjetas de contenido con estados hover y focus. Integre un catalogo dinamico via API, gestionando estados de carga, error y empty state. Optimice el comportamiento responsive en distintos breakpoints adaptando grids, carruseles, tipografia e imagenes para desktop, tablet y mobile. Anadi microinteracciones y animaciones en hover, entrada y scroll para mejorar la percepcion de respuesta y calidad de la UI. Estructure la interfaz en componentes reutilizables para layout, filas/carruseles, tarjetas de contenido y estados skeleton/loading.
Problemas resueltos
Layout complesso con caroselli
Las interfaces basadas en carruseles son dificiles de gestionar de forma responsive. Se definieron reglas especificas para preservar coherencia visual, interacciones consistentes y una densidad de contenido adaptativa segun los breakpoints.
Percezione di qualità della UI
Sin animaciones, la interfaz se percibe estatica y poco convincente. Las microinteracciones mejoraron la percepcion de respuesta, la calidad visual y la continuidad entre secciones.
Gestione dati asincroni
Con contenidos cargados desde API, es necesario gestionar varios estados de la aplicacion. Se implementaron patrones para mantener una experiencia fluida incluso con condiciones de red no optimas.
Otros proyectos
Una seleccion de otros trabajos utiles para entender mejor mi enfoque tecnico.