• 

  Destruction of widgets

• 

  Flamethrower

Inspiration

I was inspired by Animator vs Animation ( https://www.youtube.com/watch?v=VufDd-QL1c0 ). The fighting and destruction of virtual property was quite cool. Initially I thought it would be difficult to implement something like this, but I was convinced otherwise when I saw a featured team from 2025's Hack&Roll on JigSaw Google Pictures. Hence, this project.

What it does

Destruction of widgets. Click on the widget to make it destructable and breakable, then break it. The physics of flinging widgets around, and the freedom to choose what to destroy is liberating. Users can destroy titles, images and entire documents. There's also a flamethrower.

How we built it

Matter.js helped with the physics mechanics, and pure vanilla js & css helped with the rest. This project relies on how web pages ultises tags like

, , to referance the objects. Websites that run purely on <div> or are protected are harder to convince to be broken.</p> <h2 id="challenges-we-ran-into">Challenges we ran into</h2> <p>Rendering of a destructable. I had to find a way to create an object thats identical to the widgets on screen for the user. I've learnt to appreciate the very basics of web dev, my saving grace was HTML2Canvas 🙏</p> <h2 id="accomplishments-that-were-proud-of">Accomplishments that we're proud of</h2> <p>The flamethrower is very cool ^</p> <h2 id="what-we-learned">What we learned</h2> <p>Basics of everything need more appreciation.</p> <h2 id="whats-next-for-i-want-to-rage">What's next for I Want To RAGE</h2> <p>I plan on uploading it as an official web extension for the public. It's not a perfect app, but it's funny and fun to the right crowd. There's other features I can add like a "Stuff left in this page to destroy", or improving performance and rendering to introducing better particle destruction, not to mention sound effects</p>

Built With

• css
• javascript
• material.js