Epistorium

Human history through graphs.

Comment

Inspiration

Studying history often feels like memorizing a list of disconnected events and figures. However, the true beauty of history lies in understanding how these elements influence each other to create a grand narrative. I imagined a tool that could visualize human history like a git graph, allowing users to see the flow and interplay of events at a glance. 'Epistorium' was born from this idea. The goal is to untangle the complex web of historical relationships, empowering users to become explorers who discover the connections for themselves.

What it does

Epistorium is a web application that visualizes the lives of historical figures and their relationships on an interactive timeline graph. Users can:

  • Select Collections: Quickly explore specific historical contexts by choosing predefined collections like 'The Manhattan Project' or 'Pioneers of Quantum Mechanics'.
  • Build Dynamic Timelines: Create custom timelines by searching for and adding figures from the side panel.
  • Visualize Relationships: See lifespans as lines on the timeline, with connections (collaboration, rivalry, influence, etc.) drawn between them, making interactions instantly clear.
  • Explore in Detail: Click on any person or event on the timeline to open a modal with detailed information for deeper learning.
  • Track Posthumous Influence: Visualize how a figure's work continued to influence others even after their death through 'posthumous influence' relationships.

Through these features, Epistorium transforms fragmented historical knowledge into a connected narrative, offering a novel way to explore the past.

How we built it

Epistorium is built on a modern web technology stack:

  • Frontend: I used Svelte, Vite, and TypeScript for a reactive and fast user interface and I used it many times before. A component-based architecture allowed for the efficient development of reusable UI elements like Timeline, SidePanel, and PersonModal.
  • Backend & Database: I chose Supabase for my backend, leveraging its PostgreSQL database, authentication, and real-time data APIs. A well-designed schema with tables for persons, events, and relationships allows me to effectively store and query complex historical connections.
  • Data Visualization: The core timeline graph was implemented using D3.js. I leveraged its flexibility to represent lifespans, events, and relationships as dynamic and interactive visual elements.
  • Development Workflow: I rapidly prototyped and fleshed out my ideas in the Bolt.new environment and, following the hackathon rules, included a 'Built on Bolt' badge in my app.

Challenges we ran into

  • Complex Data Modeling: The biggest challenge was translating the uncertain and multi-layered nature of historical relationships into a structured database schema. Defining abstract concepts like 'mentorship', 'rivalry', and even 'posthumous influence' as types in our relationships table, and specifying their valid timeframes (start_date, end_date), required significant consideration.
  • Performance Optimization: Rendering dozens of figures with hundreds of associated events and relationships on the timeline initially caused performance issues. I dedicated significant effort to optimizing my Supabase queries and refining the D3.js data-binding and rendering pipeline to maintain a smooth user experience.
  • Visual Clarity: As more information was added to the timeline, the relationship lines became tangled, creating a 'spaghetti' effect that hindered readability. I worked to ensure visual clarity by dynamically adjusting the color, thickness, and curvature of lines based on the type and importance of the data, and by adding a feature to focus on a specific person.

Accomplishments that we're proud of

  • A New Paradigm for Historical Exploration: I am proud to have successfully implemented a unique idea inspired by git graphs for exploring history.
  • Interactive Visualization: I take great pride in using D3.js to transform complex data into a beautiful and intuitive interface that allows users to interact with history.
  • Meeting the 'Startup Challenge': By using Supabase as my core backend, I have laid the foundation for scaling to millions of users.

What we learned

Through this project, I was deeply impressed by Svelte's simplicity and Vite's fast development experience. Most importantly, the process of turning an abstract idea into a concrete data model and user experience taught me invaluable problem-solving skills.

I also learned about the trade-offs of developing in an AI-assisted environment like Bolt, especially as a project scales. As my data model grew to handle more complex historical events and relationships, the need for fine-tuned algorithm and data optimization became apparent, and I began to encounter the limitations of the platform. I experienced a noticeable performance degradation as the project size increased, which was often highlighted by warnings from the environment itself. The AI's ability to interpret my intent was not as sharp as it was in the early stages, and token consumption grew exponentially. This taught me critical lessons about managing complexity at scale, and the challenges that can arise in such an environment, for instance, the difficulty of rolling back a flawed data migration.

What's next for Epistorium

  • Data Expansion & User Contribution: I want to add data from more eras and cultures to grow the platform into one that encompasses human history. To achieve this, I will introduce a Wikipedia-style contribution model, allowing our community to add and verify new figures, events, and relationships.
  • Fictional Universe Timelines: I plan to expand beyond real-world history to support timelines for fictional universes. Imagine exploring the intricate character relationships in Star Wars, the complex events of The Lord of the Rings, or the sprawling narrative of the Marvel Cinematic Universe with the same powerful visualization tools.
  • Alternative Graph Styles: I plan to introduce new visualization formats beyond the current timeline view. For instance, users could generate mind-map style graphs centered around a specific person or event, showing relationships and influences branching outwards. This would offer an event-centric, rather than time-centric, perspective on history.
  • User-Generated Collections & Sharing: I will develop a system for users to create, save, and share their custom collections and graph visualizations. This will foster a community of creators and allow others to easily discover and explore diverse historical narratives and perspectives.
  • Backend & Performance Overhaul: Based on "What We learned", a top priority is to overhaul my backend architecture for greater performance and scalability. This will involve fine-tuning database queries, optimizing my data-handling algorithms, and establishing a more robust development workflow to better manage a large-scale project.
  • Enhanced Educational Tools: I aim to increase its utility in educational settings by adding an 'Analysis Mode' to explore the causes and effects of specific historical events and a 'Lesson Plan Generator' for teachers.

Personal Commitment and Future Vision

As a senior developer with experience managing diverse projects single-handedly, I have both the vision and the capability to develop Epistorium into a tool that could revolutionize how we study history, on par with a new Wikipedia. This is a long-term commitment for me, one that I will pursue regardless of this hackathon's outcome. However, winning would provide a crucial opportunity to leverage this momentum and accelerate its journey.

The development process within Bolt.new has been a journey of both discovery and limitations. I've pushed the project to a scale where the constraints of an AI-assisted environment become clear. While I am eager to continue building and refining, I've reached a point where further complex requests risk destabilizing the existing implementation—a challenge I've faced multiple times, leading to several project reverts. I believe I have reached the practical limit of what can be developed on this project under the hackathon's 'Built on Bolt' rule. Therefore, I ask you to judge not only the tool's current state but also the vast potential that lies beyond these developmental constraints and the vision I am determined to realize. Thank you.

Built With

Share this project:

Updates