magic algorithms

min span tree
flow
dijkstras

Inspiration

We wanted to create a fun, interactive tool to help visualize computer science algorithms involving graphs because who doesn't love a graph.

What it does

It brings CS is to life! Our tool allows users to choose between three graph algorithms: Dijkstra's algorithm for finding shortest paths on a weighted graph, Minimum Spanning Trees to connect nodes with minimal edge weight, and Network Flow simulations to explore capacities and flow through networks. These topics all come up in CS courses (Primarily CS311) at UMass and magic algorithms provides an excellent interface to visualize and learn these fundamental concepts.

How we built it

We built the tool using Vue, TypeScript, and HTML Canvas.

Challenges we ran into

Bugs... bugs and more bugs 🥲

Accomplishments that we're proud of

Building a functional, interactive, educational tool in this short timeframe.

What we learned

We strengthened our understanding of both graph algorithms and web development in Vue and TypeScript.

What's next for magic algorithms

We envision adding a cleaner UI, more customizability to allow users to experiment with different types of graphs and formats, and a library of graph presets. We’d love to enhance the visual design and make the tool even more capable to become a standard in CS education!