Mobile first website for a reunited rock band ahead of new album and tour
In 2015, the classic Swedish rock band Backyard Babies reunited after a five-year break. Their online presence had declined, and they needed a new website to promote their upcoming European tour and studio album.
Summary
The team consisted of me, Brand Designer Rickard Linder, and the band members themselves – mainly singer Nicke Borg and lead guitarist Dregen.
I led the project and handled User Research, Sketching, Copywriting, and Web Development. Rickard led the graphic design together with Dregen, while Nicke contributed to copywriting.
The website was released in June 2015. It had this impact:
- Captured the band’s gritty, punky vibe
- Improved Search Engine Optimization (SEO)
- Saved journalist time by providing a press kit
- Gave promoters easy access to branding materials
Note: I haven’t worked on the website since 2015.
About Backyard Babies
Backyard Babies is one of my favorite rock bands!
When I was a teenager in the early 2000s, rock and metal were in a poor state – Limp Bizkit was climbing the charts, Axl Rose had gotten cornrows, and guitar solos seemed to be a thing of the past.
I was losing faith in the future of rock ‘n’ roll – until I one day in 2001 tuned into the Swedish music show Voxpop and saw the video for Backyard Babies’ new single Brand New Hate.
They. Blew. My. Mind.
Challenge: Replacing a broken website
For their 2015 comeback, Backyard Babies partnered with my employer HiQ, seeking a digital partner to stay ahead in the competitive and ever-changing music industry.
At the time, their existing website was completely broken, and they needed a brand-new one. Since Rickard and I had built Dregen’s personal website in 2013, we were given the project.
Goals
Having a passion for both web design and loud rock music, I knew that rock bands often had outdated, poorly maintained websites.
I set out to make the best website for a rock band ever – and to show the band the importance of maintaining a tidy online presence.
We set these goals:
- Improve SEO
- Ensure solid performance
- Make it easy to update on their own
- Capture the band’s gritty, punky vibe
- Provide essential content for the visitors
- Look great and work well on any screen size
Learning what content users wanted
We focused on users and content before diving into graphic design or getting caught up in details. After meetings with the band and their manager, Per Kviman, we identified the main audiences:
- Journalists
- Die-hard fans
- Casual rock fans
- Concert promoters
Insights from my former coworkers at the Finnish newspaper Nya Åland were invaluable. For example, they told us they often struggled to find high-quality promo photos
For concert promoters, Kviman and the band already had decades of experience, providing exactly what Rickard and I needed to know.
Struggles with presskit and album covers
After gathering all insights, I drafted the website content and shared it for feedback with some rock fans, a journalist at Nya Åland, and the band’s manager Per Kviman, along with Dregen and Nicke.
The press kit was particularly challenging. My first draft was too tongue-in-cheek and was rightfully rejected by the band.
Their next draft was better but still needed refinement. I eventually made some edits, and it turned out well, though it cost us more time than we had.
Dregen helped out with the album covers
Finding images for the discography page was also tricky. While we sourced many from Google and the Discogs community, the quality was inconsistent.
Luckily, Dregen saved the day by photographing his personal record collection, even uncovering some rare promo singles. A treat for die-hard fans!
Sketching on paper and designing in the browser to save time
Once the content was ready, I sketched layouts for small and large screens on paper. Everything in between would be designed directly in the browser to save time.
Before showing the sketches to the band, I asked designer colleagues for feedback to catch potential usability issues.
Giving buttons a punk rock vibe
For graphic design, Rickard and I collaborated closely with Dregen, the band’s de facto Brand Designer.
He created their logo and is deeply involved in their visual identity, album artwork, and promo photos, as well as design work for his other band, The Hellacopters.
During this phase, Dregen focused on details – like giving the website’s buttons a punk rock vibe.
Dregen suggested using pink and yellow, inspired by the iconic Sex Pistols album “Never Mind the Bollocks”.
Writing code and measuring performance
With content and graphic design finalized, I began frontend development. By then, I had three years of experience designing and building responsive websites.
To measure performance, I used Google PageSpeed Insights and tested the site on my phone while riding the Stockholm subway – I was looking for poor 3G coverage.
I was determined to avoid slow-loading sites that didn’t work well on small screens or touch devices.
Result and impact
The website backyardbabies.com was released in June 2015, just before the band’s European tour and upcoming new single.
- SEO was improving
- Performance was solid
- Journalist were provided a press kit
- It had captured the band’s gritty, punky vibe
- The band could update the website on their own
- Promoters gained easy access to branding materials
Tech stack
We chose WordPress for its popularity and because Dregen was already familiar with it. Icreated a child theme based on the established official WordPress theme Twenty Twelve.
WordPress plugins
- Yoast SEO – optimizing SEO
- W3 Total Cache – improving performance
- Disqus Comment System – managing comments
CSS
For easily maintained CSS, I used Sass and skipped frameworks like Bootstrap to keep the file size small.
Optimizing images
All images were compressed using JPEGmini or TinyPNG, which significantly reduced page size and improved performance.
Third-party Javascript libraries
I used Picturefill for implementing responsive images and Waypoints for triggering scroll events.
How it made me feel
Working with both my friend Rickard and one of my favorite rock bands was exciting, educational, and just plain cool.
Unfortunately, I couldn’t continue working with the band after switching employers in 2015. They and their manager wanted to keep me on board, but contractual reasons made it impossible.
As a big fan of Backyard Babies, I often had to pinch myself – it felt surreal to be part of it.
/Alexander