Celebrating a Milestone: Launching My Personal Website After Two Years of Development
After an extended journey filled with initial ideas, setbacks, and persistent effort, I am excited to unveil my newly finished personal websiteโcrafted over the past two years. This project represents more than just an online portfolio; itโs a reflection of my development philosophy, creativity, and commitment to open-source collaboration.
An Interactive Showcase of Creativity and Technical Mastery
Visit the live site here: https://ujjwalvivek.com
This platform is designed to offer visitors a transparent glimpse into my development process, blending artistry with technical innovation. It features a suite of advanced functionalities and interactive elements that set it apart from typical personal sites.
Deep Dive into the Technical Aspects
For those interested in the behind-the-scenes craftsmanship, Iโve documented a comprehensive blog post covering the technical nuances, mathematical concepts, and code breakdowns involved. Explore it here: Read the detailed development story
The full project codebase is accessible via open source on GitHub: https://github.com/ujjwalvivek/portfolio
Key Features and Technical Highlights
1. Four Procedural Background Generators
Utilizing only the HTML Canvas APIโwithout relying on external librariesโI created four unique dynamic backgrounds:
– Hologram cubes with vibrant reflections
– Recursive circuit-style trees
– Psychedelic mandalas with mesmerizing symmetry
– Quantum-inspired node networks
Optimizing real-time performance was a significant hurdle, and ongoing improvements are still underway.
2. Interactive Terminal Footers
Beyond aesthetics, the footer serves as a functional command-line interface (CLI). Users can input commands, uncover hidden easter eggs, and even trigger playful features such as a custom crash screen featuring a vintage-inspired dinosaur game.
3. Custom Markdown Rendering
Built from scratch, this renderer integrates KaTeX for mathematical notation and Mermaid for diagrams, offering rich, embedded content without external dependencies.
4. Accessibility-First Design
Prioritizing inclusivity, the site respects user preferences such as prefers-reduced-motion
. Additionally, a “Low Chaos Mode” provides a sensory-sensitive alternative for all visitors.