Concept · built with AI tools

Road Sense Bengaluru Bengaluru's funniest traffic school, in Kannada and Telugu

A playful, clay-style traffic-awareness web app for Bengaluru. A recurring cast acts out 14 bad road habits plus one bonus episode in short 3D scenes with Kannada and Telugu voice lines and English subtitles, then shows the real fine, the better way and a quick quiz. It ends with a Spot the Violation game, a commute fine calculator and a shareable pledge badge.

Road Sense Bengaluru: cover screen
Status
Concept · built with AI tools
Type
Website
Category
Civic
Version
v0.1 (TrafficRules_v0.1, October 2026)
Built with
HTML, CSS, Vanilla JavaScript …

This is a self-initiated concept, designed and built by Srini with AI tools. It is not a real company or client project.

01The problem

Many people in Indian cities break traffic rules out of habit: wrong-way riding, signal jumping, phones at the wheel, no-parking, triple riding. Lectures and fine tables rarely change behaviour. Road Sense uses humour, local characters and local-language voices to make the real consequences (fines, licence suspension, court) stick in about a minute per episode.

02Who it is for

Citizens of Bengaluru (Kannada and Telugu speakers, with English subtitles for all); classrooms, offices, kiosks and families watching together.

03Features

  • 14 episodes + 1 bonus, about one minute each
  • Four-step episode flow: play the act, see the bill, the better way, quiz
  • Kannada and Telugu voice lines (32 clips) with English subtitles
  • Lightweight 3D scenes (Three.js) with GSAP scroll animation
  • Fines with MV Act sections and other consequences (licence suspension, jail)
  • Running score out of 15 and total fines dodged, with progress dots
  • Spot the Violation: find 6 rule-breakers at a junction in 45 seconds
  • What did your commute cost? fine calculator, totalled in masala dosas
  • Road Sense pledge with a personalised, downloadable PNG badge
  • Sound and voice toggles plus synthesised traffic ambience
  • Fully static, works offline; no login, no backend

04Pages & screens

  • Splash: Tap to start the ride
  • Hero: Bengaluru, we need to talk
  • Meet the cast (Raju, Officer Gowda, Pinky Aunty, Ajji, Bunty, Rocky, Meena)
  • Episodes 1-14 + Bonus (Drunk & Drive, Wrong-Way Driving, Minor Driving, Signal Jumping, Throwing Trash, Phone While Riding, Overtaking on a Blind Turn, Triple Riding, Arguing with Police, A Cop Taking a Bribe, No Parking, Blocking Another Car, Harassing Women While Riding, Road Rage, Eyes on the Road)
  • Spot the Violation game
  • What did your commute cost? calculator
  • Road Sense pledge and badge
  • Footer: emergency 112, Bengaluru Traffic Police spot fines, challan and reporting links

05Stack

HTML
CSS
Vanilla JavaScript
Three.js 0.149
GSAP 3.12.5 + ScrollTrigger
Web Audio API
Base64-bundled MP3 voice clips
Static hosting (Netlify / GitHub Pages / any web server)

06How I built it with AI

Concept built by Srini with AI tools: AI-generated clay-style artwork (hero, cast and 15 episode images), synthesised (text-to-speech) Kannada and Telugu voice lines, and AI-assisted code for the single-file app, 3D scenes and games. The package also ships an AI-assisted Installation & Admin Manual and User Guide (PDF). No prompt or conversation file is included in the project files.

07Design highlights

Highlight 01

Humour over lectures: a recurring cast (unbribable Officer Gowda, sarcastic Ajji, wailing toddler Bunty) makes each rule memorable

Highlight 02

Local-language first: every act is voiced in Kannada and Telugu, with English subtitles always on

Highlight 03

Real consequences up front: each episode's 'bill' shows the fine and law section; drunk driving goes to court, and Harassing Women scores 'Dignity saved' rather than money

Highlight 04

Gamified loop: score out of 15, fines dodged, Spot the Violation and a fine total translated into masala dosas

Highlight 05

Zero-friction deployment: one static index.html with bundled scripts and voices, runs offline on a laptop, kiosk or projector