MELODY GENIE

This website was designed by Joygirl and I brought it to life using HTML, CSS, and JavaScript. This is one of my early projects and offered some very interesting challenges such as the animations and music player. It’s a beautiful site and I consider it a work of art.

OVERVIEW

Purpose: I took this on as a fun project to challenge myself and bring a beautiful design to life.
Technology Stack: HTML, CSS, JavaScript
Live Link: View site
Note: The website is still under construction.

A sreenshot from the website of Melody Genie

FEATURES

Animation: There is a unique animation on the homepage. There are also two infinite scroll marquees.
Music player: Each page has a custom and attractive music player. Features include loop, shuffle and a playlist.
Colors: The site is aesthetically pleasing and features a nice collection of beautiful colors.

CHALLENGES

Bringing the homepage animation to life is a tough challenge. Other challenges include coding the custom music players, positioning some of the elements, and the mobile view for some of the sections.

LESSONS LEARNED

I learned that having images inside divs makes styling (such as resizing and scaling) easier. I also learned that conflicts can occur in your JavaScript code when you have different HTML elements with the same class names or IDs. I needed to apply this lesson to make two music players on the same page work properly.

MELODY GENIE

OVERVIEW

FEATURES

CHALLENGES

LESSONS LEARNED

LET'S CONNECT