Inspiration

Most OSINT tools online are either outdated, scattered across multiple sites, or too complex for beginners. I wanted to build something that feels futuristic, visually satisfying, beginner-friendly, and still practical enough for real reconnaissance work.

The inspiration came from:

• cybersecurity study routines
• Google dorking frustrations
• wanting a unified OSINT learning + tools platform
• my love for cyber-themed UIs and hacker aesthetics

OSINT Academy is my attempt to make intelligence gathering both educational and fun.

---

What it does

OSINT Academy is a cyber-styled web OSINT toolkit that includes:

🔍 Google Dork Generator

Generates advanced queries for:

• emails
• usernames
• phone numbers (auto-formatted into multiple versions)
• social media footprint
• PDF/TXT/SQL/CSV exposure
• directory listings
• data leaks

📘 OSINT Study Guide

Fully interactive learning space with:

• expandable OSINT techniques
• progress tracking
• clean beginner-friendly explanations

🎨 Cyber UI System

• neon hacker cursor
• glowing input boxes
• animated transitions
• matrix rain background
• responsive layout

The whole site feels like a cyber terminal mixed with a modern OSINT dashboard.

---

How we built it

The project is built entirely from scratch using:

Frontend

• HTML5
• CSS3 (custom neon design system)
• Vanilla JavaScript (OOP + modules)
• Anime.js (UI motion)
• Typed.js (terminal typing)
• Splitting.js (text animations)

Custom JS Engines

• dork generation engine using templating strings
• phone number normalization + multi-format builder
• animated DOM renderer for categories
• localStorage progress tracker
• custom cursor animation loop
• matrix rain canvas renderer

No frameworks, no heavy libraries — everything is fast and hand-crafted.

---

Challenges we ran into

⚠️ Designing the cyber UI without lag

Matrix backgrounds & neon glows can easily drop FPS, so performance tuning took work.

⚠️ Phone number formatting

Different countries mean different patterns — building a universal formatter was tricky.

⚠️ Keeping it beginner-friendly but powerful

OSINT can be overwhelming. The challenge was creating a tool that teaches while still feeling like a real recon panel.

⚠️ Structured animations

Coordinating typing effects, fade-ins, and layout shifts all together required precise timing.

---

Accomplishments that we're proud of

• Built a full OSINT education + tool platform alone
• Designed a smooth cyber UI that actually looks premium
• Generated Google dorks in real-time across multiple categories
• Managed to keep everything lightweight, responsive, and fast
• Created a project that both beginners & advanced users can enjoy
• Polished look and branding that feels hackathon-worthy

---

What we learned

• how to architect a multi-module JS project
• deep understanding of UI animations and motion design
• better OSINT methodology
• how to optimize canvas animations for browsers
• how to structure dork generation logic cleanly
• how to design a “fun but functional” learning experience

This project massively improved my frontend architecture & cybersecurity knowledge.

---

What's next for OSINT Academy – Cyber Intelligence Web Toolkit

The roadmap includes:

🚀 Feature Expansions

• more dork categories (cloud, CVEs, public buckets, etc.)
• metadata extraction module
• passive DNS lookups
• email breach detection
• username pattern intelligence
• reverse search integrations

🎨 UI Enhancements

• dark terminal mode
• optional sound effects
• section-based navigation

🌐 Deployments

• a Chrome extension
• a mobile-friendly mini version
• API-based backend for advanced recon

OSINT Academy will continue evolving into a complete open-source intelligence platform.

---

Built With

• canvas
• css3
• github
• html5
• javascript
• local-storage