Rogerio Lucas Viana

Full Stack Developer Junior

Cómo he diseñado y organizado mi portfolio RogerLab

Un portfolio de desarrollo web debería mostrar algo más que una lista de tecnologías. También debería ayudar a entender cómo trabaja la persona que hay detrás: qué decisiones toma, cómo organiza sus proyectos y qué considera importante al construir una aplicación. Con esa idea he rediseñado RogerLab. El objetivo no era cambiar su identidad, sino presentar mejor mi trabajo y crear una estructura que pueda seguir creciendo conmigo. Una identidad visual más clara He mantenido la paleta de tonos carbón y marfil, con versiones clara y oscura. Sobre esa base, he trabajado la jerarquía visual, los espacios y la tipografía para que cada sección tenga una función reconocible y la información resulte más fácil de recorrer. Los títulos utilizan Big Shoulders y el texto principal, Public Sans. Esta combinación permite diferenciar la presentación de los contenidos sin recurrir a demasiadas fuentes ni elementos decorativos. También he conservado el fondo animado de partículas, uno de los detalles que identifican la web. La animación puede pausarse y respeta la preferencia de movimiento reducido del dispositivo. La intención es que acompañe al contenido, no que compita con él. Una estructura pensada para conocer mi trabajo La página de inicio presenta mi perfil y da acceso directo al currículum en español e inglés. A partir de ahí, el portfolio se organiza en secciones dedicadas a mis conocimientos, las prácticas profesionales, los proyectos, el contacto y este blog. Proyectos: cada trabajo tiene espacio para explicar su contexto, las tecnologías utilizadas y su funcionamiento mediante imágenes y enlaces. No se trata solo de mostrar una captura: quiero que se pueda entender qué he construido y explorar el resultado. Prácticas: recoge mi experiencia y los aprendizajes de esa etapa. Contacto: completa el recorrido con una vía para propuestas profesionales y oportunidades de colaboración. La navegación permanece visible durante el desplazamiento para facilitar el acceso entre secciones, especialmente en las páginas con más contenido. Cuidar la experiencia también forma parte del desarrollo El diseño se adapta a móvil, tablet y escritorio. Además del aspecto visual, he trabajado el contraste, el foco visible al navegar con teclado, los tamaños de los controles y el comportamiento de las animaciones. El contenido general del portfolio está disponible en español, inglés y portugués. La tecnología detrás del diseño El portfolio está construido con Laravel y plantillas Blade. Los estilos se organizan con Sass y variables CSS compartidas, mientras que TypeScript gestiona las interacciones del navegador. Vite y Gulp se encargan de preparar los recursos para su publicación. He mantenido este stack durante el rediseño. En lugar de añadir herramientas para cada detalle visual, he priorizado reutilizar estilos y componentes, mantener una estructura comprensible y limitar las dependencias innecesarias. Los colores, espacios y estilos de los controles se apoyan en un sistema común. Esto facilita que una mejora pueda aplicarse de forma coherente y reduce las diferencias entre páginas. Una nueva sección para compartir el proceso Este blog añade una parte que faltaba en el portfolio: un lugar para explicar el trabajo que no siempre se ve en una demostración final. Idiomas: cada publicación dispone de campos propios para español, inglés y portugués, incluidos el título, el texto, los metadatos SEO y las descripciones alternativas de las imágenes. Imágenes: las publicaciones pueden incluir una imagen, varias en un carrusel manual o ninguna, en cuyo caso aparece el logo de RogerLab. Gestión: se realiza desde un panel privado, separado de la lectura pública. Quiero utilizar este espacio para compartir decisiones técnicas, mejoras, dificultades y aprendizajes reales. Esta primera publicación es el punto de partida: una explicación de cómo está construido el lugar donde iré mostrando mi evolución como desarrollador.
Volver al blog