Metal Storm's UI update

Here we are.

I don't even know where to begin. When we took over Metal Storm (and effectively relaunched it), there were four major projects that we had to complete before we could feel like we could claim full ownership, both legally and technically. While the legal side of things was straightforward, it quickly became clear that the technical side would be more challenging once we started working on the code. The MS codebase had remained unchanged for about a decade without any maintenance or further development.
The four projects (or "pillars") we identified were

• Port the code to a current version of PHP
  
• Refactor the database layer to modern technologies and a state-of-the-art setup
  
• Fix everything that's broken and refactor or rewrite the important components that keep the site alive
  
• Port the UI to a current version of Bootstrap and modernize it
  

I took care of pillar 1 before we relaunched in September 2021 and finished pillar 2 during an extended stay in Southeast Asia in 2022, which took about five months. Since then, we have been gradually improving the site, ensuring that it runs, while slowly working our way up to a point where it makes sense to tackle pillar 4. Most of this work was invisible, but we pledged to ourselves and you to be transparent about it.

Earlier this year, after the awards rewrite had been implemented, I had no immediate tasks left to complete. At the same time, people in our team and some of you requested new features that I knew would benefit from a modern, well-supported UI framework. So I sat down and got to work. That was in February, shortly after the awards had gone live.

Unfortunately, we inherited nothing but a bundle of UI code, which I had to analyse and separate into framework code and our own modifications. This took almost a month, but once complete, we could start updating the underlying framework and porting our own code, ensuring that everything still works with newer framework versions (I'm talking about Bootstrap, btw, for those interested). I won't bore you with the details of that process, but suffice it to say that I started in mid-March, and the project is going live today.

When we took over the site, it seemed completely unreasonable to even consider reaching this point at any reasonable time. Originally we had planned to re-write the whole site before even going live in 2021, but that idea fell flat after an analysis of what was in front of us. Never in a million years would I have believed in 2021 that we would actually reach this point; and do it in less than four years.

But, as I said, here we are.

I present to you a version of Metal Storm that is now fully under our technical control and in a great state for further development.

It's unfortunate to announce such a significant achievement amidst the technical issues we're currently facing. However, by going live, I can stop managing different versions of Metal Storm's code and focus on collecting your feedback and making further adjustments where necessary. Having worked on this for so long, I'm a bit blind to many things, so I'm hoping community feedback will highlight these quickly and help us to fix and move on from them.

So, what has changed, and what's new?

• Tons of invisible stuff has changed everywhere. I had to touch pretty much every single page in this process.
  
• The font size of the site is now 16px (up from 14px). This has been a web standard for over a decade and will improve the experience for our mobile users.
  
• Many animations have been redone, and the controls should now behave more consistently with what you are used to from other websites.
  
• Many of our pages have undergone a UI overhaul, and this process will continue in future. You'll find lots of convenience features throughout, as well as an overall much better mobile experience.
  
• We have consolidated and reorganised our main menu and made it more mobile-friendly. Try opening the search and the menu at the same time on your phone and you will see what I mean.
  
• Tons of bugfixes, such as being able to edit shouts without having to reload the page after, or fixing the search bar bug where it would always search for the selected item when it changed.
  
• A million smaller things I'm forgetting right now
  

On top of that, I added some new features while refactoring the surrounding code. One of these is the announcements feature that you are looking at right now. We've wanted to separate internal news from site news for a long time, and this feature allows us to publish real metal news and release Metal Storm news as announcements, reaching our intended audience: our community.

So, what's next?

If you want to help, look out for anything in the UI that seems unusual, or things that used to work but don't now (like dead buttons). I think, our trusty Something isn't working (right) thread is perfect for this. I have a snapshot of what Metal Storm looked like before this update running on my development machine, which I can use as a reference. From now on, however, Metal Storm will be developed fully with a mobile-first approach. This means that some things will be bigger, some links will become buttons and the layout will change to work better on a small screen. Remember that you can use Ctrl+– (ctrl and the minus key) to zoom out in your browser to make the text appear smaller. I have paid close attention to maintaining proportions, so if you want things to be as small as they used to be, you should have the same experience as before.

Words cannot express how happy we are to have reached this point with Metal Storm. We hope you enjoy the changes as much as we do, and that you're as excited as we are about what the future holds.

Wow thanks man. awesome news, good job. Danke schön man

Great work, corrupt and the team. Site looks better than ever.

I think you deserve a lot of beers for all this work

Written by RaduP on 02.07.2025 at 18:14

I think you deserve a lot of beers for all this work

Yes, or 60 year old single malt limited de lux edition

This is definitely a huge upgrade, I just got back on MS after two hours, and what shock (and good surprise) to have an improvement in the ergonomics of the site on the phone.
I must admit it wasn't very mobile-friendly until now.

I hope this will attract more curious people to visit the site. Good work!

Appreciate all of the work you put in to keeping our favorite website up and running and updating it to modern standards. I don't understand jack about web design but it seems like a big undertaking, especially when you aren't being paid. Thanks for the transparency and constant updates, I'll echo Radu in saying that we all owe you several beers

Woah, thanks for all the work!

You were showing us your progress for a lot of that time and even so I feel like the scale of this undertaking is beyond my imagination. All those updates and incremental steps and I still can't fathom just how much work went into this. I'm amazed by how much better the site is today than it was yesterday, and this month compared to last month, and this year compared to last year. The fact that it works at all is amazing compared to what it was like back when I took over as editor-in-chief.

Congratulations on finishing these major developments and thank you for the life you've breathed back into Metal Storm. It's exciting to feel like the place is new again.

The renewed website looks really great!

I see you implemented my request, thank you very much!

I like MetalStorm's new face....congratulations!

Written by Ansercanagicus on 02.07.2025 at 21:15

I see you implemented my request, thank you very much!

uhm

I did, but not the way you show in your screenshot. I added your own ratings to the popup. There's nothing in the list code that would influence the colors of album names.

Written by corrupt on 02.07.2025 at 23:00

I did, but not the way you show in your screenshot. I added your own ratings to the popup. There's nothing in the list code that would influence the colors of album names.

it's my script above it, now that my ratings are present in the source code of the page, I can parse them adequately

I appreciate making the UI more mobile-friendly, as I mostly visit MS on my phone. I especially like the way the band pages look: the tabs look sleek, the latest reviews are more prominent, and I like that the album cover art is enlarged everywhere (although not always centered).

Some minor things to tweak still, and hopefully the site will soon work faster again, but, overall, I'm happy about the increasing number of UI improvements!

This is some amazing work, corrupt. I just planned to do a quick visit tonight before going to bed, and I have already spent two hours
You will get bombarded (at least in the beginning) with stuff that needs fixing, but remember that you asked for it

This is great, corrupt. Thanks! Overall looks great on phone and computer.

Although I have only been here for two years as a new user, I hope this can become my permanent home.

ThAnX a million for your time. On the "Discography" section of a band's page, "Other releases" section, you can't see the types of the albums, like Single/Live...

Aaahhh.... I liked all the minor improvements and the way you kept us updated along the way over the past months and had not realized that something bigger was in the works. The new look is an evolution and has a sleek and clean and structured and inviting feel. Still I can't help a little twist of regret about the old page because now it is gone and lost forever (well, you said you had a snapshot). Doesn't mean I want the old version back, but just had to say this.
And yes, the new page looks great, and for some reason the change in font size really appeals to me, a lot more than I would have expected.
Congratulations to this major step closer towards your vision, and thank you for keeping this alive.

Thanks for all the great work behind the scenes! I joined 12 years ago, when I was still in school and have since been using it as my main source for all things metal. Its cool to see the site getting modernized and worked on - most other sites I was visiting regularly back when I joined here are all dead or dying, sadly. Congratulations on successfully "keeping MS alive and intact" and all the great changes!

PS: needed some getting used to, but now, I absolutely adore the new look on mobile

Thanks for all the hard work that keep our favourite site not only alive, but improving the experience.

Nice work! It's a separate level of hell to get an older codebase on modern standards, especially when it comes to the UI. I'm a desktop user and hardly check MS on my phone so no clue what it looked like before, but is seems cool now.

I appreciate all of the hard work that went into maintaining this site. I've been coming here since 2004, and it's where I love to keep track of my album and record collection, all while getting band and artist updates. Again, thank you, MS! Greetings from Colorado

thanks corrupt for all the work you've put into this! I've definitely noticed all the little (and big) QoL improvements over the last few months and they're super appreciated

Fantastic work, well done

Thank you for all the positivity, people. We really appreciate it, and the help we've been getting in finding the remaining bugs. Knowing we have an awesome, supportive community is a great portion of why we keep doing this. You guys (and girls) rock!

Written by Ansercanagicus on 02.07.2025 at 21:15

I see you implemented my request, thank you very much!

Bro, nice list you're browsing there Brilliant in fact hahaha.

Been out for a bit but just sat down and looked at the new update and it looks and feels so good! As others have said, thanks for all the hard work to make the site better, we really appreciate the effort that goes into building a community!

There's too much Cloudflare security verifying checks, which sometimes stuck and I can't open MS on slow/problematic internet of Iran!