Eat the Metaballs

Eat the Metaballs

Web & UI/UX
2024

Live Demo

Loading demo...

About This Project

Eat the Metaballs is an innovative web-based game that combines interactive gameplay with stunning visual effects powered by GLSL shaders. Players navigate through a dynamic environment of colorful metaballs that blend and morph in real-time, creating a mesmerizing visual experience. The game features multiple color themes, adjustable spawn intervals, and score tracking, all rendered using WebGL for optimal performance.

KEY FEATURES OF THE PROJECT

• Metaball Rendering: Implemented metaballs using implicit surfaces and signed distance functions (SDFs). The smooth blending of metaballs was achieved through GLSL shaders, giving the game its organic, fluid visuals.

• WebGL Pipeline: Leveraged WebGL to handle vertex and fragment shaders, ensuring efficient real-time rendering in a web browser.

• Interactive Gameplay: Designed user interactions where players control a point that "eats" smaller metaballs while avoiding larger ones, blending graphics with an engaging game mechanic.

• Performance Optimization: Carefully optimized shader programs to compute metaball visuals dynamically, balancing visual quality and performance.

More than just a project, "Eat The Metaball" kickstarted my passion for shaders. It was here that I discovered how powerful code can be—not just for solving problems, but for creating something artistic, interactive, and fun. This project showed me the creative potential behind graphics programming, blending mathematical precision with visual design.

"Eat The Metaball" is a milestone that reflects both my technical growth and my excitement for combining code, creativity, and playability.

Skills & Technologies

GLSLWebGLJavaScriptHTML5CSS3Shader Programming