Custom Wordpress Theme For Musician

Creative Director (Art + Design) & WordPress Developer, 2017

🗒 Overview

A multi-talented EDM/Pop artist, songwriter and producer with over 50+ releases. Searching for a digital space to connect with her fans.

🖼 Moodboard

miguel wildheart music cover
space gif
general art
magazine editorial
aurora borealis in winter sky
dark room neon night
Woman

🚀 Background

I was the sole designer and lead on the whole UX/UI design process and also wrote all of the code for the site in PHP, with WordPress as the content management system (CMS).

✍ Roboto By Christian Robertson

🍬 Palette

🍭 Gradient

🛠 Sitemap

🏠 Landing Page

A microsite-style design style in which the visitor will be able to navigate through just the homepage, with each section detailing each page in detail.

Wireframe
Wireframe
Landing Page
Mockup

🏠 Global UI

The call to action CTA button Show me love EP (2019) for the latest release serves as a global component to raise awareness. The newsletter sign up form with social media icons is the actual footer, with the ability to add or remove from within the content management system (CMS) dashboard.

Picture of the author
Shop CTA
Footer: Newsletter + Social Media
Newsletter + Social Media

🛠 Biography and Gallery

Each page takes the visitor on a behind-the-scenes journey to connect with the artist.

Biography
Mockup
Gallery Wireframe
Wireframe
Gallery Mockup
Mockup

🛠 Event and Event Post

Archive of past and upcoming show with ticket URL icon link.

Wireframe
Wireframe
Mockup
Mockup
Wireframe
Desktop: Screenshot

🛠 Blog And Blog Article

To inspire other music lovers, whether they're aspiring or already in the industry.

Blog
Wireframe
Picture of the author
Desktop: Screenshot

🛠 Contact and Booking

Picture of the author
Mockup

🛠 Development

  • A custom wordpress admin system to customize any page section, a custom plugin and some CSS elements.
  • Offer customers an option to download their purchased album or single track as a digital download.
  • The moving background was created using the Three.js JavaScript 3D library.
  • Cross-device responsiveness.