Software developer M. Ahmad has updated a personal web portfolio to feature an experimental interface called Theme Studio, according to developer community posts and repository documentation. The project blends conventional developer presentation with interactive gamification, enabling visitors to physically connect virtual wires to choose distinct site aesthetics.
Interactive Mechanics and Visual Design
The core of the new Theme Studio interface rests on a canvas where three distinct versions of the portfolio appear as selectable cards alongside a central display monitor. Visitors can switch between the classic layout, a terminal theme, and a notebook aesthetic by dragging a wire from a theme card directly into the display, mimicking the physical act of plugging a cable into an old television set. According to project breakdowns, this interaction is enhanced by playful visual feedback, including lightning sparks that jump between the wire and the display as they draw close, and skill icons that slide down the cable once a connection is established. Furthermore, the screen powers on with a vintage television animation before loading the selected page.
To ensure visitors do not have to search for the playground, a live miniature copy sits in the bottom-right corner of the desktop home page and specific theme views. This compact utility cycles through themes and provides quick navigation to the main playground. Additional features mentioned in the repository documentation include live cursors from other active visitors inside the Theme Studio, a command menu accessible via keyboard shortcuts, a GitHub contribution graph, and integrated blogging fed by local MDX posts alongside Dev.to articles.
Modern Tech Stack and Open-Source Availability
Beneath the playful frontend lies a modern web development stack. According to the official repository and project overview, the portfolio is built using Next.js 16 and React 19, styled with Tailwind CSS, and animated via Framer Motion. Data management relies on Prisma paired with PostgreSQL, while hosting and edge performance leverage Cloudflare Workers. The repository is also engineered to be AI-ready, incorporating a dedicated /llms.txt file to facilitate LLM interactions and clean link preview generation for social sharing.
The entire codebase is made publicly available under the MIT license, allowing other developers to fork and study the project. However, repository guidelines explicitly advise anyone cloning the project to remove personal information, images, and specific data directories before publishing their own derivative websites.
Why Gamified Portfolios Matter for Modern Frontend Engineering
The introduction of Theme Studio highlights a broader trend among modern web developers who view personal portfolios not merely as digital resumes, but as sandboxes for technical and artistic expression. In an industry saturated with uniform templates and standard grid layouts, transforming a static portfolio into an interactive playground serves as a live demonstration of a developer's proficiency with advanced frontend motion libraries, state management, and creative user experience design. By utilizing bleeding-edge frameworks like Next.js 16 and React 19 alongside robust backend tooling such as Prisma and Cloudflare Workers, the project illustrates how complex web applications can be packaged into whimsical, highly engaging user journeys. Furthermore, features like live visitor cursors and dynamic cable-dragging mechanics push the boundaries of what users expect from personal developer sites, moving away from passive reading toward active participation. For the developer community, open-sourcing such imaginative experiments under the MIT license provides valuable architectural references for implementing complex animations, state synchronization, and modular theme switching. It encourages engineers to step outside conventional design patterns, demonstrating that technical rigor and playful creativity can coexist effectively within a single production-ready web application.
Editorial graphic and headline text by Signal Titans.
Source: I turned my portfolio into a playground (plug a theme into a display to open it) · GitHub – MA-Ahmad/myPortfolio: A pixel-perfect portfolio with three themes and a Theme Studio playground · GitHub
SIGNAL TITANS
Leave a Reply