Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/shamikaredkar/slimesprint

This project is a fun and interactive game called Slime Sprint, implemented in JavaScript using the HTML5 Canvas. The objective of the game is to navigate your slime character through various obstacles and get a high score.
https://github.com/shamikaredkar/slimesprint

canvas canvas-game canvas2d css-animations css-flexbox dino-game dinosaur-game html-css-javascript html5 javascript javascript-game

Last synced: about 2 months ago
JSON representation

Host: GitHub
URL: https://github.com/shamikaredkar/slimesprint
Owner: shamikaredkar
Created: 2024-07-12T18:31:00.000Z (6 months ago)
Default Branch: main
Last Pushed: 2024-07-16T19:31:28.000Z (6 months ago)
Last Synced: 2024-07-17T22:16:18.125Z (6 months ago)
Topics: canvas, canvas-game, canvas2d, css-animations, css-flexbox, dino-game, dinosaur-game, html-css-javascript, html5, javascript, javascript-game
Language: JavaScript
Homepage: https://shamikaredkar.github.io/SlimeSprint/
Size: 2.85 MB
Stars: 0
Watchers: 2
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

SLIME SPRINT GAME - Demo

## About The Project

## Features:

### Interactive Gameplay

- **Character Control:** Take command of a lively slime character, space bar to jump and dodge obstacles.
- **Obstacle Avoidance:** Encounter obstacles of different sizes that test your reflexes and timing.
- **Engaging Mechanics:** The game incorporates engaging mechanics like double jumps and speed boosts, adding layers of complexity and excitement to the gameplay.

### Dynamic Graphics

- **Adaptive Resolution:** The game’s graphics dynamically adjust to fit different screen sizes and resolutions, ensuring a consistent visual experience whether you’re playing on a desktop, tablet, or smartphone.
- **Smooth Animations:** Experience fluid animations that bring the slime character and environment to life. Every movement, jump, and obstacle interaction is smoothly rendered to enhance the gaming experience.
- **Visually Appealing:** The game features a vibrant color palette and detailed textures that create an immersive and visually appealing game world.

### Responsive Design

- **Cross-Device Compatibility:** Designed to work seamlessly across a variety of devices, from large desktop screens to small mobile displays. The game’s layout and controls adapt to provide an optimal experience regardless of the device.
- **Touch-Friendly:** On touch-enabled devices, the game’s controls are intuitive and easy to use, making it accessible for players on tablets and smartphones.

### Customizable Settings

- **Difficulty Levels:** Customize the game’s difficulty by adjusting parameters like the speed of obstacles, the frequency of bonuses, and the overall game pace. This allows both novice and experienced players to enjoy the game at their preferred level of challenge.
- **Game Parameters:** Modify various game settings directly in the `index.js` file. Change the number of obstacles, the type of terrain, and other gameplay elements to create a personalized gaming experience.
- **Persistent Settings:** Save your customized settings so that your preferences are retained across game sessions, providing a tailored and consistent experience every time you play.

### Visual Feedback

- **Welcome Screen:** A welcoming message prompts new players to start the game, ensuring a smooth and inviting entry into the gameplay.
- **Game Over Screen:** Displays a "GAME OVER" message when you lose, and allows you to restart the game.
- **Explosion Animation:** When certain events occur, such as hitting an obstacle, an explosion animation is triggered. This animation consists of a series of images that are displayed in sequence. The images are stored in a list and iterated over to create the animation effect.
- The game features background images that resize with the window to ensure a consistent and immersive experience:

## Built With

- ![JavaScript][JavaScript]
- ![HTML5][HTML5]
- ![CSS3][CSS3]

[JavaScript]: https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black
[HTML5]: https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge&logo=html5&logoColor=white
[CSS3]: https://img.shields.io/badge/CSS3-1572B6?style=for-the-badge&logo=css3&logoColor=white