psst... remember to right-click a block to rotate or change it!

Inspiration

Before we joined this Hackathon, we were discussing the ways to get children to break into electrical engineering through fun toys/programs. Thinking that a good way might be to use familiar objects as representations of real circuits, we thought thought of imitating Redstone (from Minecraft), a great representation of real-life electrical engineering.

However, since children are often distracted by other aspects of the game, like mining and survival, we came up with a solution: Minecraft with just Redstone. Since a 3-dimensional world is often difficult to maneuver through (and 3D graphics in JS with no frameworks is a nightmare), we believed that a 2D playground would be the best place to learn electrical engineering through Minecraft circuits.

What it does

This is a Minecraft Redstone simulator build to be faithful to the original game as much as possible. Many hours were put into looking through the Wiki and playing the game, researching how exactly Redstone works, down to a T.

How we built it

Programming As per the project rules, this simulator is a static site using vanilla HTML/CSS/JavaScript. There are no external dependencies.

Drawing It was decided to make the artwork as fun and cute as possible, appealing to children instead of "redstone professionals" who may look for a more utility-based simulator.

Challenges

There weren't many giant hurdles to overcome (mostly because such a good baseline framework for implementing new features was built), but there were indeed run into some major bugs that took days to fix. We wanted it to be as close to the real game as possible, so any inconsistencies were a top priority in fixing, no matter how small they seemed.

Here's just a few:

  • Sound delay bug: Note blocks, when activated, should instantly play a sound. However, in the simulator, the sounds were delayed. A cup of coffee and a rabbithole later, we found out about "web browser sound buffering," which required us to preload all sounds in order to get instantaneous sound feedback. It took another day to figure out how all this stuff works, but after much Googling, we figured out how to manually load all the sounds in beforehand.
  • Redstone Dust rendering: Redstone Dust and Repeaters has several versions, which depend on things like signal strength, and connectivity. It was decided that instead of trying to make smart, mathematical logic to determine what's rendered, a giant "switch" statement would be best. And in the end, it worked.
  • Ticking: Minecraft has something called "ticks" which determine the timings of certain operations. Getting things to align was a headache of its own. After much coding, it was determined that instead of trying to order update events, it would be best to just propagate events everywhere and let previously written logic figure it out. And lo and behold, this worked after just a little bit of debugging. Complicating things would probably had made the program run a bit faster, but we haven't encountered a single performance issue ever since we started.

Accomplishments

  • Overcoming the aforementioned tick challenge was huge. Ever since the "update everything and let it sort itself out" decision was made, programming updates has been basically smooth sailing. Premature optimisation is truly the bane of programming.
  • Design decisions at the start of development. With how well programming has gone throughout this project, the compromise between design patterns and simplicity is optimised for as much productivity as possible.

Lessons Learned

  • Designing a program doesn't need to be unnecessarily complex. Start with a simple framework, and work from there
  • Game dev principles: Entity-Component-System, ticking and update alignment, and much more
  • A LOT about how Minecraft's Redstone works (and how it can be implemented)

What's next

If we win this competition, we want to stay committed to continue developing this project to its absolute limits.

First, we plan to add a "tutorial," explaining basic Minecraft Redstone concepts to those who wish to go into it a bit more.

In terms of graphics, we want to add particles and animations to make the experience more interactive and realistic.

We also want to be able to scale up and down the graph infinitely (currently, all you can do is set the "height" and "width" in script.js) using the scrollwheel. This will allow for much larger-scale projects to be created using this program.

Additionally, while nearly all core Minecraft Redstone components have been implemented, just a couple haven't been added or completed as of yet (we started 2 weeks after the hackathon started). These are listed below:

  • Honey Blocks: While not important to every Redstone contraption prior to 1.19, these blocks are useful when building highly advanced slimestone structures. We left these out because we believed them to be too far out of the scope of this project to be vital.
  • Container blocks and entities: Droppers, Dispensers, Chests, all useful blocks in highly complex tasks. The time constraint didn't quite give us enough time to implement these complicated blocks, but extremely complex Redstone circuits, like CPUs and computers, need these to function.

Built With

Share this project:

Updates