Beatly – Music Website

Context

This website was created as part of my final presentation (soutenance). I developed it using procedural PHP. As a big fan of music, I wanted to build a platform where people can review albums, rate them, and share their opinions. The idea was to create a simple and fun space for music lovers.

Features

The platform allows users to register with their email, username, and password. Once logged in, they can update their profile, including their photo and personal information. On the homepage, the top 5 albums of the month are displayed, with a « See more » button that links to the full album catalog.

The album catalog is shown in a grid format with album covers, titles, and artist names. Users can filter albums by genre or artist, or use the search bar to find specific albums. Each album has a detailed page showing all the important information: cover image, title, artist, genre, release year, and tracklist. There’s also a rating system from 1 to 5 stars and a comment section where users can post their reviews.

Users can also submit new albums through a form, uploading the album cover and filling in all the necessary details like title, artist, genre, date, tracklist, and even links to Spotify or YouTube.

Admin Interface

Admins have access to a dedicated interface. From there, they can manage all users (edit or delete accounts, or change roles from user to admin). They also moderate the content by approving new album submissions and reviewing or deleting inappropriate comments.

User Experience

Each user has their own profile page, where they can see their reviews and update them if needed. They can also change their personal information easily. The site is fully responsive, meaning it works on all devices—desktop, tablet, and mobile—with an adaptive menu that fits each screen size.

Design Process and Logo

For the design, I wanted something clean and modern. The color palette is simple to keep the focus on the content. The homepage highlights the latest and most popular albums.

The left logo is the first one I made using Canva. It was a rough version, just to get a first visual idea. Later on, I recreated a cleaner and more polished version (the right one) using Illustrator. I used the font « Estrella Early » because it has a unique and elegant style that fits the identity of the site.

I started the process by sketching ideas related to music, using symbols like records, headphones, and sound waves. I then selected the most minimal and effective shape that still gives a clear musical identity to the platform. The final logo reflects the spirit of sharing and discovering music together.

I make a little sketch of the logo :

the left one (old logo) the right one (new logo)

Mock up :

finally the website !

👉 click to see more

Conclusion

This project allowed me to combine technical skills with my passion for music. I learned how to structure a procedural PHP project with both front-end and back-end logic, and how to create a smooth user experience. It’s a personal and complete project that reflects both who I am and what I love.

THANK YOU !