Bubble Shooter | HTML5 Game

LIVE PREVIEWBUY FOR $49

Bubble Shooter — HTML5 Bubble Pop Sport

A cultured, totally featured HTML5 bubble-shooter sport constructed for industrial distribution. Zero exterior JavaScript dependencies. Works on any system, in any trendy browser, straight from a static file host.

Overview

Bubble Shooter is a basic match-3 bubble-popping sport: intention, shoot, and match three or extra same-colored bubbles to clear them from the board earlier than they attain the hazard zone. It ships with three problem tiers plus an countless Free Mode, 50 hand-shaped ranges per tier, 11 unlockable ball skins, a coin economic system, a each day streak system, an built-in advert framework, and 4 selectable shade themes — a whole, ready-to-ship product.

Concerning the Sport

• Entry level is index.html — no construct step required
• Pure vanilla HTML5, CSS3, and ES6+ JavaScript — no libraries, no frameworks, no package deal supervisor
• Absolutely responsive structure — crisp rendering at each display screen dimension and pixel density
• Procedural Net Audio API sound engine — no audio information bundled, each sound impact is synthesized in code
• All sport state endured to localStorage with sleek degradation when storage is unavailable
• Helps mouse, contact, and stylus enter
• Canvas-based rendering for the sport board and shooter, with a hex-offset bubble grid

Themes

4 shade themes can be found, every with matching accent colours throughout each display screen. Purple is free by default; the opposite three are unlocked with in-game cash, utilizing the identical buy-card circulation as ball skins. The lively theme is saved to localStorage and utilized immediately on each return go to.

• Purple — deep violet with electrical purple accents (default, free)
• Black — pure darkish minimalism (60 cash)
• Parrot — vivid jungle greens with lime highlights (80 cash)
• Pink — gentle rose tones with heat blush highlights (80 cash)

Ranges & Problem

• 150 complete ranges throughout three problem tiers, plus an unlimited-length Free Mode
• 50 Simple ranges (5 bubble colours), 50 Medium ranges (6 bubble colours), 50 Onerous ranges (7 bubble colours)
• Free Mode makes use of 4 bubble colours and performs as an countless session with no degree restrict
• Every degree’s bubble structure is procedurally generated from a seeded form (dome, wave, funnel, diamond, and extra) so each degree has a definite silhouette
• Stage progress and completion state are saved per-difficulty in localStorage
• A Stage Choose overlay lets gamers soar to any unlocked degree inside a problem
• Ranges are rated 1–3 stars primarily based on the rating earned when the extent is cleared

Ball Skins

11 selectable ball skins, unlocked with in-game cash or free by default. Every pores and skin re-textures each bubble on the board, within the shooter, and within the next-ball preview.

• Traditional — shiny gloss spheres (free by default)
• Automobile Tire, Bike Tire, Golf Ball, Soccer Ball — sports-themed textures
• Crystal, Lava Ball, Galaxy, Sweet, Neon Ring — stylised materials textures
• Fruit Bowl — six actual fruit images, one per shade

Methods to Play

1. Choose a problem (Simple, Medium, Onerous, or Free) and a degree from the foyer.
2. Goal the shooter with the mouse or a contact drag, and faucet/click on to fireside the present bubble.
3. Match 3 or extra bubbles of the identical shade to pop them and any bubbles left floating with out help.
4. Clear the board (or attain the extent’s goal) earlier than any bubble crosses the hazard zone.
5. Faucet the shooter itself to swap the present bubble with the following one in queue.

Controls

• Goal & Shoot: Click on/faucet anyplace on the board to intention, click on/faucet once more (or drag and launch) to fireside.
• Swap: Faucet the shooter cannon to swap the present and subsequent bubble.
• Bomb Bubble: Clears a radius of bubbles across the shooter’s goal level. Begins with a small stock; extra are earned by watching a rewarded advert. The button greys out (with out disappearing) as soon as the stock reaches zero.
• Dwelling: Returns to the foyer from the in-game backside bar.
• Restart: Restarts the present degree from the start.
• Pause: Pauses the sport and opens the pause menu (resume, restart, give up).

Settings

All settings are accessible from the foyer settings button and are saved mechanically to localStorage.

• Sound Results: Toggle procedural sport sounds on or off.
• Quantity: Alter the sound results quantity degree.
• Goal Information: Toggle the dotted/beam trajectory line.
• Laser Model: Select between Beam, Dotted, or Neon aim-line types.
• Full Trajectory: Lengthen the intention line all the way in which to the touchdown level.
• Particle Results: Toggle the pop-burst particle animation.
• Fall on Match: Toggle whether or not matched bubbles fall away as an alternative of exploding in place.
• Reset All Progress: Clears all saved progress, cash, and settings from localStorage.

Advert Monetization

Bubble Shooter ships with a totally built-in, configurable advert system prepared to hook up with any advert community.

Vital: Advert community integrations corresponding to Google AdSense, AdMob, and ironSource are third-party exterior companies not affiliated with or included on this product. Every community operates independently and has its personal account registration course of, eligibility necessities, approval insurance policies, and probably related prices. Bubble Shooter supplies the advert slot infrastructure solely — consumers are solely chargeable for acquiring their very own accounts, assembly every community’s necessities, and complying with their respective phrases of service.

• Adverts are displayed in a full-screen overlay with a sandboxed iframe, a countdown timer, and a skip button that seems after 5 seconds (configurable).
• Advert content material is loaded from script/advertisements/advert.html — the file incorporates clearly marked remark blocks that present precisely the place to stick your advert community’s loader script and advert unit code (Google AdSense, AdMob Net, ironSource, Unity Adverts, and so on.).
• Advert completion is signaled from the advert slot through window.dad or mum.postMessage('AD_COMPLETE', '*').
• Advert set off factors: the primary sport begin of a session, roughly each third sport begin after that (interstitial), quitting again to the foyer, and the “watch an advert” prompts for bonus bomb bubbles or cash.
• Watching an advert rewards 50 cash, or 3 bomb bubbles, relying on which immediate is used.
• Gamers can spend cash within the store to disable advertisements for his or her present browser session.

Tech Stack

Necessities & Compatibility

• Any trendy browser: Chrome 88+, Firefox 85+, Safari 14+, Edge 88+, Samsung Web 14+
• No server-side code required — deploy to any static file host (GitHub Pages, Netlify, S3, cPanel, and so on.)
• No set up, no construct step, no CLI instruments required
• Web connection required for Google Fonts (loaded through CDN) to render accurately
• Absolutely responsive — adapts to desktop, pill, and cellular screens
• Web Explorer is just not supported
• All localStorage operations are wrapped in attempt/catch for secure degradation in non-public shopping mode

Change Logs

Model 1.1
Added a configuration choice to disable advertisements from the config file.

Different Video games You Will Like

Source