Personal Site

In this update, the primary focus was on resolving external asset rendering issues, expanding the interactive deck, and completing the site’s digital footprint grid. The most critical fix involved addressing hotlink restrictions from media hosts like IMDb and Amazon CNDs by implementing a no-referrer meta header in the layout. This allowed all high-resolution film posters, web series covers, and gaming media assets to render smoothly without broken image links or aspect-ratio distortion. Additionally, a custom SVG favicon was introduced, and a subtle neon text-shadow glow was added to highlight my name across the hero section. To complete the digital footprint section, I added dedicated Spotify and Reddit widgets with glowing neon halos alongside the existing social cards. The Duolingo widget icon was also updated to a sleek, monochrome vector design to maintain visual consistency across all network blocks. With the media display bugs resolved and all interactive props fully operational, the project is ready for its final deployment pipeline and cross-device performance testing.

Devlog #2: Goalpost Animations, Multi-Puzzle Engine & Expanded Social DeckIn this second development update, the primary focus shifted toward deepening interactivity and refining visual feedback across the personalized deck. The football minigame received a full structural overhaul, transitioning from a basic bounce effect to a dedicated goalpost frame complete with net pattern styling. Clicking the ball now triggers a smooth CSS transform animation that shoots the ball directly into the “Top Bin” target before resetting. Additionally, the single chess conundrum was upgraded into a dynamic multi-puzzle system featuring custom navigation controls, allowing users to toggle seamlessly between different tactical scenarios like Smothered Mates, Queen Sacrifices, and Back-Rank Checkmates.On the UI and networking front, several visual polish passes and link integrations were executed. A subtle neon glow text-shadow was applied to the hero header to make the main title stand out against the radial backdrop. The social media grid was expanded with Spotify and Reddit widgets to complete the box layout, and the Duolingo badge was updated with a clean monochrome owl vector icon. To ensure full functionality, all movie posters, web series cards, gaming overlays, and social widgets were wrapped in explicit link structures, ready for exact external URL mapping, along with a lightweight SVG favicon added to the document head.With the core interactive features fully implemented, the next milestone focuses on deployment readiness and optimization. The short-term plan includes conducting thorough cross-device responsiveness testing, verifying touch interactions on mobile viewports, and populating final project links. Following these final refinements, the site will be pushed to GitHub to establish an automated deployment pipeline for live hosting.

Devlog #1: Building a Custom Personal Site & Interactive Deck. I’ve officially kicked off development on my custom personal website, built completely from scratch using vanilla HTML5, CSS3, and JavaScript. The goal of this project is to create an interactive, cinematic hub that showcases my work as a CS engineering student, STEM Olympiad background, hardware builds, and personal passions. So far, I have established the overall responsive layout, crafted a clean light-mode aesthetic, and built the core interactive elements—including a dynamic typing hero section, a popup FUT manager card modal, a football goal kick minigame with live commentary, and a Mentalist-inspired observation generator. Over the past session, my primary agenda focused on layout alignment, UI refinements, and asset fixes. I resolved poster aspect-ratio inconsistencies across the cinema, web series, and gaming cards to ensure uniform vertical alignment, while wrapping each card in subtle neon glow rings. Furthermore, I aligned the baseline for all widgets in the personalized space, updated the polyglot section with official Duolingo stats and branding, and introduced floating background mathematical symbols to reflect the site’s STEM theme. Looking ahead, my shortlist for the next milestone involves setting up the GitHub repository, establishing a clean deployment pipeline, and testing cross-device responsiveness. I also plan to implement smoother section scroll transitions, add further polish to the chess conundrum puzzle widget, and integrate an embedded feed for my math paradox blog. The core foundation is set, and the next phase will focus on micro-interactions and performance optimization!