Design Inspiration

The portfolio's 3D world aims to create a minimalist yet engaging space using simple geometries like cubes. Animations breathe life into these simple forms, creating an intriguing environment that evolves as users navigate through it. This concept is adapted to a web-based, scroll-driven experience, offering a unique and interactive way to explore the portfolio.

For the UI elements, especially the project cards, the design draws inspiration from augmented reality interfaces like Apple's visionOS. Both ui and 3d elements feature a modern aesthetic with glass-like and metallic effects providing a futuristic touch. The project cards incorporate extruded UI components and parallax effects, enhancing depth within the 3D environment.

From Concept to Reality

The journey began in Blender, where the initial 3D scene was modeled. This screenshot provides a glimpse into the early stages of development, showcasing the raw 3D environment before its integration into the web application.

Technical Implementation

Built with Next.js and React Three Fiber, this portfolio creates an immersive 3D environment. The scene, crafted in Blender as shown above, was imported as a GLTF model and integrated with R3F. Framer Motion powers both 2D and 3D animations, ensuring smooth transitions and interactions throughout the experience. Tailwind CSS was used for efficient styling and consistent design implementation across the project.

Development Challenges

Creating this portfolio involved balancing visual fidelity with web performance. Optimizing the 3D scene for smooth rendering across devices was a key challenge, as was integrating the glass-like and metallic effects within the constraints of web technologies.