My recent design project is yet another personal one. Check out my EDM, synthwave music website design project
Well actually, when I’m not working on client projects or creating content on YouTube, I’m working on personal projects and new business ventures. One of my passions is creating synthwave electronic music.
So, let me take you behind the scenes of designing and developing the website, as well as putting together my merchandise store using WordPress, WooCommerce, and Oxygen Builder.
If you’re a musician or in a band and looking for some incentive to build your own website, complete with branding, a merch store, hopefully, this personal project of mine will inspire you.
🔥 Don’t forget to check out my complete website-building video course if you want to learn how to build a website like this!
Megaglitch is the stage name that I use for my music. The website that I envisioned for this project would be a simple single-column homepage layout employing a dark theme. The preliminary colors selected, being a retrowave theme, were black, vibrant pink, purple, and blue.
I started the logo design using a simple sketch of bold fonts. I then scanned the drawing and brought it to life using my favorite graphic design tool, Affinity Designer.
Photos, images, and graphics
All of the photos and graphics for the website were also created in-house. Here are a few snapshots of the website and pages.
The homepage is simple and promotes the latest musical release. The homepage also displays logos of the streaming sites where the music is available. I’ve tried to keep this page as minimal and clean as possible.
The product list page and product information page were completed using Oxygen Builder, WooCommerce, and the WooCommerce integration plugin. This also had to be minimal in design, clean, and mobile responsive.
The layout is as basic as it comes. The images of the products were shot in-house using a Panasonic Lumix G7.
Music artwork and merchandise design
The LP music artwork as well as the t-shirt artwork and other merch were also designed in-house before heading off to print.
Website tech stack for synthwave music website design project
Here is a list of the plugins, technologies, and tools used to create the Megaglitch website –
- SiteGround web hosting
- Oxygen Builder
- Recoda for Oxygen
- WoCommerce
- WooCommerce Integration Plugin
- WP Forms Lite
- Order minimum/maximum amount for WooCommerce
- Rank Math SEO Pro
- WooCommerce Menu Cart
- WooCommerce PayPal Payments
- WooCommerce Shipping & Tax
- Custom Related Products for WooCommerce
- Insert Headers & Footers
- Social Snap Lite
Need a designer? Do you need an epic website to promote your band or solo music? Need a designer with experience in the industry? Get in touch with me today for a free quote. Or grab my web design course to learn how to build a website like this yourself!