Chronoscope

timeline generator for important inventions
Comparision of any 2 timelines
Homepage
Additional information

🌟 Inspiration

The inspiration behind Chronoscope came from our fascination with history and the lack of visually appealing, easy-to-navigate timeline tools online. We wanted to make historical data feel alive—interactive, immersive, and meaningful. Our goal was to help people better understand chronological events through visual storytelling.

🛠️ What it does

Chronoscope allows users to generate stunning, animated timelines from structured data. Each event is displayed with descriptions, source verification links, and smooth transitions. The timeline supports chronological scrolling, dynamic layouts, and a calming starry background for an immersive experience.

🧱 How we built it

We used the following stack:

Next.js (App Router) – Framework for building the app with SSR support.
Tailwind CSS + Radix UI – For styling and accessibility.
Framer Motion – For fluid animations.
TypeScript – Ensures type safety and scalable code.
Markdown/JSON – For representing and parsing timeline data.
Vercel – For deployment and instant preview environments.

🧗 Challenges we ran into

Managing client-side only features like window.open() in a Next.js environment without SSR errors.
Keeping animations smooth while rendering multiple interactive elements.
Designing a responsive layout that adapts across devices without sacrificing readability.
Handling malformed or incomplete event data gracefully.

🏆 Accomplishments that we're proud of

Achieved a seamless blend of design and performance using Framer Motion + Tailwind.
Created a fully responsive, accessible timeline engine.
Integrated Wikipedia and custom sources with verification links for every event.
Built an intuitive UI that’s both minimal and engaging.