Web Dev

School projects focused on front-end development using HTML, CSS, and JavaScript. Each project emphasizes responsive design and modern web practices.

Group Project Flexbox

Aura

This project was about creating a Bakery website, my primary role was the Lead Developer.

We started by creating a correct identity for the brand Aura, which required a lot of research and brainstorming to find the right tone and aesthetic. Once we had a clear vision, we moved on to the design phase in Figma, where I focused on crafting a visually appealing layout that would resonate with our target audience.

The development process was a lesson in precision and creativity. We implemented Flexbox to create a responsive and dynamic layout that would adapt seamlessly across devices. The project was built with a Mobile First approach, ensuring that the user experience was optimized for smaller screens before scaling up to larger displays.

SEE LIVE SITE
adableu/aura
Group Project Floats System

C de Cómic

This project was an intensive group challenge to build a fully functional comic bookstore from scratch. My primary role was the Lead Developer.

Technically, the project was a lesson in precision. We were restricted to a Float-based grid system, which required meticulous mathematical calculations for every column to ensure a perfect structure without the aid of modern Flexbox or Grid tools.

Following a strict Mobile First philosophy, we started the process in Figma for prototyping. This ensured that the user experience was optimized for smaller screens before a single line of code was written in HTML, CSS, and JavaScript.

SEE LIVE SITE
adableu/c-de-comic
adableu/music-artist
Individual Project Flexbox

music artist

An individual project dedicated to exploring modern UI/UX trends for the music industry. I chose to build a digital home for a musical artist, focusing on high-impact visuals and fluid navigation.

This project allowed me to implement Flexbox, providing a more elastic and dynamic layout compared to legacy systems. The development remained strictly Mobile First, ensuring the mobile experience was the priority throughout.

Like all my work, the execution started in Figma, where I focused on display typography and a high-contrast aesthetic that matches the artist's brand identity.

SEE LIVE SITE