Title: Launching My Personal Website After Two Years: An Open Source Journey with Procedural Generators and Interactive Features
Introduction
After a prolonged period of brainstorming, developing, and occasionally abandoning personal projects—a challenge many developers can relate to—I am excited to announce the completion and launch of my personal website. This project represents over two years of dedication, experimentation, and learning, culminating in a dynamic, interactive platform that goes beyond traditional portfolios.
A Project Reflecting My Development Philosophy
This website is more than a static showcase; it serves as an interactive system designed to transparently demonstrate my development process. By integrating unique procedural animations, custom tools, and accessibility considerations, I aimed to create an engaging experience for visitors and a tangible reflection of my skills and approach.
Explore the website here: https://ujjwalvivek.com
In-Depth Technical Insights
For those interested in the technicalities behind the project, I’ve documented a comprehensive deep dive that covers math models, ASCII diagrams, and detailed code breakdowns. You can read it here: Log 0003: Going Open Source. Additionally, the complete codebase is available on GitHub for open collaboration: https://github.com/ujjwalvivek/portfolio.
Key Features and Technical Highlights
- Procedural Background Generators
The website features four distinct procedural backgrounds created with the Canvas API—without relying on external libraries. These include:
- Hologram cubes
- Recursive circuit trees
- Psychedelic mandalas
- Quantum node networks
Each generator pushes performance boundaries, and optimization is an ongoing process to ensure smooth rendering.
- Interactive Terminal Footer
A standout feature is the footer’s embedded command-line interface (CLI). It allows users to interact through commands, discover hidden easter eggs, and even trigger a custom crash screen that unleashes a mini dinosaur game. This adds an extra layer of interactivity and fun to the browsing experience.
- Custom Markdown Renderer
All content on the site is rendered with a bespoke Markdown engine, integrated with KaTeX for math formulas and Mermaid for diagrams. Building this from scratch provided unique challenges but affords greater flexibility and performance.
- Accessibility & User Experience
Accessibility was a top priority. The site respects prefers-reduced-motion
