Web Design and Development

I was required to design and code a homepage for a fictitious electronic music festival: Elektrik Eel, aimed at a 20 to 35 year old crowd. The client provided mood boards, the brand logo, images and mandatory text, and wanted it all built in HTML and CSS in a sophisticated manner. The client also required that the site be fluidly responsive for mobile and tablet, and a jQuery script be added to create a drop-down menu (for mobile) that would open/close on click.

I started with a wireframe in Figma so I had some direction before touching any code. From there I had to think through how the whole thing would hold up on smaller screens, mobile and tablet included. I was pleased when I realised I could reuse the same layout for desktop and tablet by wrapping the desktop section in a container, so the background still showed down the left and right sides of the page instead of stretching awkwardly.

For the colour scheme, I picked purple, black and white straight out of the client's own imagery, then pulled the hero image that matched those colours the closest. For the headings I used a font called Red Rose, it has just enough edge to sit comfortably in an electronic music scene. For the body copy I went with Roboto, since readability mattered more than style once you got past the headings.

I also added a flicker effect to the page title from some code I found online and reworked until it matched the page's tone. It was a small detail, but it tied the whole hero section together.

This was the project that hooked me, challenging in a good way, and it is a big part of why I want to keep designing and building websites and apps.