Inkway - Hand-Drawn Physics Line Drawing HTML5 Game

INKWAY – Premium HTML5 Physics Drawing Puzzle Game

Level Editor

INKWAY – Every Stroke Counts

INKWAY is a beautifully crafted, physics-based drawing puzzle game built entirely with pure HTML5, CSS, and JavaScript. Players draw ink paths on a notebook-style canvas to guide a doodle car from start to finish, using as little ink as possible to earn 3 stars.

Inspired by classics like Draw a Line and Brain It On, INKWAY delivers a polished, premium gaming experience directly in the browser. No engine licenses, no frameworks, no dependencies. Just clean, readable vanilla JavaScript that runs everywhere.

Fully responsive and optimized for mobile, tablet, and desktop. Works flawlessly on Chrome, Safari, Firefox, Edge, and all modern browsers. Easily wrap it as a native mobile app using Cordova, Capacitor, or WebView to publish on the Google Play Store and iOS App Store.

Core Features

• HTML5 Game – Playable instantly on all modern browsers and devices. No plugins required.
• No Engine Required – Built entirely in pure JS/CSS. No Unity, Construct, GameMaker, or Phaser license needed.
• Mobile and Desktop Ready – Fully responsive UI that auto-scales to any screen size and orientation.
• Touch and Mouse Controls – Smooth drawing input with pressure-sensitive ink lines on both touch screens and desktop mice.
• Real Physics Engine – Powered by Matter.js for realistic gravity, collisions, friction, and bouncing.
• 20 Handcrafted Levels – Progressively challenging puzzles with ramps, bridges, gaps, springs, boosters, hazards, and more.
• 3-Star Rating System – Players are scored based on how efficiently they use their ink budget. Less ink means more stars.
• Rewarded Ad Monetization – Built-in Watch Video Ad system for level hints. Ready to connect Google AdMob, AdSense, Adsterra, or any ad network.
• Visual Level Editor – Full drag-and-drop level editor included. Create unlimited custom levels without writing code.
• Comprehensive Documentation – Detailed HTML documentation covering setup, customization, level creation, ad integration, and deployment.
• Single Config File – All game settings (physics, ink cost, star thresholds, ad toggle, branding) controlled from one clean config.js file.
• Auto-Save System – Player progress, stars, and best scores are automatically stored in localStorage.
• Haptic Feedback – Vibration feedback on mobile devices for drawing and collisions.
• Sound Effects – Complete audio system with toggle controls in settings.
• Clean Codebase – Well-organized, fully commented, modular JavaScript. Easy to understand and modify.

Gameplay Highlights

• Draw to Solve – Players draw freehand ink paths to create ramps, bridges, and platforms that guide the car to the finish line.
• Erase Tool – Made a mistake? Switch to the eraser to remove strokes and reclaim a portion of your ink budget.
• Engine Off Levels – Some levels disable the car engine entirely. Players must rely purely on gravity and clever drawing to push the car to the goal.
• Interactive Props – Levels include springs, speed boosters, spinning wheels, moving platforms, breakable blocks, and deadly hazards like spikes and lava.
• Ink Budget System – Each level provides a limited ink budget displayed as a progress bar. Players must strategize their strokes carefully.
• Animated Tutorial – Level 1 includes a smooth animated hand tutorial showing new players exactly how to draw their first path.
• Level Hints – Every level records the developer solution path. Players can view the hint to learn the optimal approach.
• Notebook Aesthetic – Charming ruled-paper background with a red margin line, giving the entire game a hand-drawn doodle notebook feel.

Built-In Ad Monetization

Start earning from Day 1. INKWAY comes with a fully integrated rewarded video ad system. No extra plugins or coding required.

• Rewarded Ad Modal – Players watch a short video ad to unlock the solution hint for any level.
• 1-Click Toggle – Enable or disable ads with a single boolean in config.js. Default is OFF for clean testing.
• Works With Any Ad Network – Pre-wired callback hooks for Google AdMob, Google AdSense, Adsterra, Poki, CrazyGames, Unity Ads, or Facebook Audience Network.
• Test Mode Built-In – Runs a simulated 3-second video ad player so you can test the full flow without a live ad account.
• Detailed Integration Guide – Step-by-step documentation with code examples showing exactly where to paste your ad SDK callbacks.

Visual Level Editor – Create Unlimited Levels

INKWAY includes a powerful, browser-based drag-and-drop Level Editor that lets you create, edit, test, and export custom levels without writing a single line of code.

• Drag-and-Drop Props – Place cars, finish lines, ramps, platforms, springs, boosters, spikes, lava, breakable blocks, spinning wheels, and more by simply clicking on the canvas.
• Draw and Solve – Switch to Draw mode to solve the level yourself. Your solution path is automatically recorded as the 3-star hint line.
• Test Play – Instantly test your level in the editor with full physics simulation before exporting.
• Download JSON – Export your finished level as a clean JSON file. Drop it into the levels folder and it is instantly playable in the game.
• Load Existing Levels – Import and modify any existing level JSON file to tweak difficulty, rearrange props, or redesign the layout.
• Delete Props – Hold right mouse button on any prop and click left mouse button to delete it.
• Configurable Physics – Adjust gravity, ink budget, engine on/off, and canvas size per level directly in the editor sidebar.

Level Editor Workflow

1. Place Vehicle and Finish Line – Every level requires a car start position and a finish (win box) goal. Place these first.
2. Add Props and Terrain – Drag in platforms, ramps, springs, boosters, hazards, and decorative elements to design your puzzle.
3. Draw the Solution – Switch to Draw mode and solve the level yourself. This records the optimal ink path as the level hint.
4. Test Play – Click Play to simulate the level with full physics. Verify it is solvable and fun.
5. Download JSON – Export the level. The 3-star ink usage and hint lines are automatically saved in the file.
6. Drop into Game – Place the downloaded JSON file into the game/levels/ folder and it is instantly playable.

Easy Customization

• Single Config File – Change game name, tagline, physics values, ink cost, star thresholds, and ad settings from one file (game/config.js).
• CSS Variables – All colors, fonts, spacing, and theme values are defined as CSS custom properties. Change the entire look by editing a few lines.
• Modular Architecture – Clean separation between physics, drawing, vehicle, objects, UI, storage, and level management modules.
• Swap Vehicle Art – Replace the car SVG in vehicle.js to reskin the player character.
• Add New Prop Types – The object system is extensible. Add new interactive prop types by following the existing patterns in objects.js.

What is Included

• Complete Game Source Code (Pure HTML5/CSS/JS)
• Visual Drag-and-Drop Level Editor
• 20 Handcrafted Levels (JSON)
• Built-In Rewarded Ad System
• Matter.js Physics Engine
• Comprehensive HTML Documentation
• Single-File Master Configuration
• Auto-Save and Progress Tracking
• Sound Effects and Audio System
• Free Updates and Support

Technical Details

• Engine: Pure HTML5, CSS3, Vanilla JavaScript
• Physics: Matter.js (included)
• Resolution: Fully responsive (auto-scales to any screen)
• Controls: Mouse, Touch, Stylus
• Browsers: Chrome, Safari, Firefox, Edge, Opera, Samsung Internet
• Mobile Ready: iOS Safari, Android Chrome, responsive landscape mode
• App Wrapping: Compatible with Cordova, Capacitor, WebView, and Electron
• File Size: Lightweight, fast loading on all connections
• No Server Required: Runs entirely client-side. Host on any static file server.

Requirements

To edit or customize this game, you do not need any paid software. Any standard text editor (VS Code, Sublime Text, Notepad++) works perfectly.

No build tools, no npm, no Node.js, no terminal commands. Just open the HTML files and start editing.