// Ce codebase : Portfolio Minimaliste Glassmorphic

Portfolio Minimaliste Glassmorphic

Portfolio Cyberpunk sur le Thème du Glitch / Site Personnel / Projet Next.js App Router

Résumé en une phrase : Un site de portfolio généré statiquement construit avec Next.js 15 App Router, TypeScript, Tailwind CSS 4 et MDX. Présente une interface utilisateur glassmorphic, une architecture modulaire et une personnalisation rapide — aucun CMS requis.

Durée du développement : Avril 2026 - Juin 2026

Note(s) :

• Avertissement sur l'hébergement/la disponibilité du code : Le code source complet est disponible sur demande. Le projet est en ligne, mais n'est pas publié publiquement pour éviter d'exposer des vulnérabilités potentielles.
• Contact pour plus d'infos ou démos : Contactez Franz Phillip G. Domingo via franzdomingo.dev.
• Note de navigation : Les pages de blog et de projets sont accessibles via la navigation du site.

Caractéristiques

• Interface utilisateur minimaliste et glassmorphic
• Mise en page réactive, mobile-first
• Pages de blog et de projets propulsées par MDX
• Système de composants modulaires (ui/, motion-primitives/, dock/)
• Menu de commande CMD+K, dock animé et chatbot
• Optimisé pour le SEO, accessible et performant
• Déployé sur Vercel avec SSL + CDN
• Commutateur de mode sombre
• Système de notifications Toast
• Extensibilité facile pour de nouvelles sections et composants

Mes Contributions (Rôle et Responsabilités)

Frontend Architecture:

• Developed physics-based canvas transitions and custom scroll snap engines.
• Integrated an AI chatbot with vocal synthesis and local storage persistence.

Multi-Agent Orchestration:

• Orchestrated a pipeline of specialized agents (Coder, Front-End, QA, Tech Writer, Infra).

Performance & DevOps:

• Configured Vercel Edge Runtime and DNS routing for optimal performance.
• Ensured accessibility with reduced-motion fallbacks and Core Web Vitals audits.

Défis Rencontrés

• Synchronizing complex animations:
  Coordinating canvas-based wave physics with React state and GSAP ScrollTrigger.
• AI Chatbot Performance:
  Optimizing TTS vocal synthesis and LLM streaming within a Next.js Edge environment.
• Agent Orchestration:
  Managing a complex multi-agent orchestration pipeline for feature delivery.
• Accessibility:
  Balancing high-performance visual glitch effects with strict reduced-motion accessibility standards.

Architecture du Projet

• Architecture Style:
  Modular, functional React with Next.js App Router (Turbopack).
• Component Organization:
  • app/: Edge runtime routing, layouts, and internationalization (next-intl).
  • components/: Bento grids, 3D Canvas scenes, AI chatbot interface, and GSAP triggers.
  • messages/: Localization JSON dictionaries.
• Integrations:
  Three.js for WebGL, GSAP for high-performance scrolling, and @google/generative-ai for the chatbot.

Aperçu de la Démo

• Captures d'écran/Vidéo : La démo en direct du Portfolio Minimaliste Glassmorphic est disponible sur franzdomingo.dev. Toutes les fonctionnalités de l'interface utilisateur, les mises en page et les interactions peuvent être explorées directement.

• Vues plateforme : Web (réactif, mobile-first)

• Fonctionnalités présentées :

  • Page d'atterrissage glassmorphic
  • Navigation par dock animé
  • Menu de commande (CMD+K)
  • Pages de blog et de projets
  • Chatbot et notifications toast

• Instructions de démo : Visitez le site en direct sur franzdomingo.dev. Pour le code source complet ou une démo privée, contactez l'auteur.

Si vous avez besoin de plus de détails ou si vous voulez voir le codebase, veuillez contacter l'auteur directement.