{
  "id": 528059,
  "title": "🟩 Team Matrix or ⬜ Team Paper? | Alan Babychan",
  "url": "https://urgent.news/2026/08/11/team-matrix-or-team-paper-alan-babychan",
  "topic": "tech",
  "section": "Tech",
  "published": "2026-08-11T03:30:00.000Z",
  "source": {
    "name": "Dev.to",
    "slug": "dev-to",
    "url": "https://dev.to/alanbabychan/team-matrix-or-team-paper-alan-babychan-1ai"
  },
  "original_language": "en",
  "account": "After weeks of meticulous design, development, and refinement, the author is thrilled to unveil the latest iteration of their personal portfolio. This update diverges from conventional static portfolios, instead focusing on performance, interaction design, accessibility, analytics, and user experience.\n\nThe centerpiece of the portfolio is a cyberpunk-inspired dark mode called Matrix Theme. This theme boasts animated binary effects, glowing UI elements, and an immersive developer experience. In contrast, Paper Theme presents a clean, modern light mode that emphasizes readability, visual hierarchy, and clarity.\n\nAn interactive audio system adds depth to the browsing experience. This system includes background music, UI sound effects, a dedicated settings panel, adjustable volume controls, and is built using the Web Audio API. A custom mouse-follow glow and subtle cursor interactions enhance the user experience through micro-interactions, such as hover states, smooth page transitions, animated UI components, and responsive visual feedback.\n\nThe project is anchored by clear typography, intuitive navigation, responsive layouts, and design choices that prioritize accessibility. Performance and analytics are handled through a Next.js framework, ensuring optimal speed, SEO, and scalability. Google Analytics 4 is implemented with features like SPA page tracking, Google Consent Mode v2, custom event tracking, and user interaction analytics.\n\nThe tech stack powering this project includes Next.js, React, Tailwind CSS, Framer Motion, Web Audio API, Google Analytics 4, and Microsoft Clarity. In the near future, the author plans to develop a personal AI assistant that will allow visitors to interact conversationally with their portfolio, ask questions about their projects, experience, and skills, and explore everything in a conversational manner.\n\nThe author is eager to gather feedback from fellow developers. They invite visitors to explore both themes, enable the audio, play around with the interactive elements, and provide their thoughts on what they think or how it could be improved. The portfolio can be accessed at https://www.alanbabychan.online.",
  "summary": "🚀 Shipping a major update to my portfolio After weeks of designing, developing, and refining, I'm excited to share the latest version of my personal portfolio. Rather than building another static portfolio, I wanted to treat it like a real product—focusing on performance, interaction design, accessibility, analytics, and user experience. 🌐 Live: https://www.alanbabychan.online What I built 🟩…",
  "key_points": [
    "Alan Babychan unveils new portfolio with Matrix and Paper themes",
    "Interactive audio system enhances browsing experience",
    "Tech stack includes Next.js, React, Tailwind CSS"
  ],
  "editors_take": null,
  "illustration": null,
  "coverage": {
    "outlets": 1,
    "also_reported_by": []
  },
  "ai_generated": true,
  "disclaimer": "Summaries, key points and the editor’s take are written by software from other outlets’ reporting and may contain errors — always check the linked original."
}