Portfolio Card

Web Dev
Frontend
3D Modeling
Portfolio Card

Tech Stack

React Native
Next.js
React
Node.js
MongoDB
Nest.js
Typescript

Description

In my personal project, I've ventured into the world of creativity, fashioning a distinctive portfolio card through the utilization of Three.js.

This portfolio card transcends convention; it emerges as a captivating 3D model, adorned with meticulous lighting arrangements that conjure a spellbinding visual journey.

To materialize this concept, I've harnessed the combined potential of Three.js and Blender, orchestrating a meticulous crafting of the central 3D model that serves as the cornerstone of the card's allure.

Yet, the allure extends beyond aesthetics. I've ingeniously interwoven custom links directly into the fabric of Three.js components. Through the creation and seamless integration of novel components, these additions elegantly rest upon the card's surface, mirroring its rotations and delivering an interactive dimension to my portfolio.

The portfolio card itself is an opus of motion, perpetually swaying in an auto-rotational dance that unfurls its multifaceted essence. As an enhancement, I've introduced an instinctive user interaction element. A simple, intuitive drag of the card in specific directions grants viewers a comprehensive vantage, enabling exploration from every conceivable angle.

At its core, my personal project epitomizes technical finesse, artistic expression, and interactive design. The amalgamation of Three.js, Blender's prowess, and the innovation of component integration has birthed not only a portfolio card, but a dynamic encounter leaving an indelible imprint on all who partake.

  • Conceptualized and realized a distinct portfolio card using Three.js, highlighting creative exploration.
  • Crafted a mesmerizing 3D model enhanced by thoughtful lighting arrangements, resulting in a captivating visual voyage.
  • Leveraged the synergy of Three.js and Blender to meticulously sculpt and refine the central 3D model, embodying meticulous attention to detail.
  • Innovatively integrated custom links within Three.js components, introducing an interactive layer via seamlessly incorporated new elements.
  • Enabled an auto-rotating feature for the portfolio card, perpetually showcasing its various facets to observers.
  • Introduced an instinctual user interaction mechanism, allowing viewers to comprehensively explore the card's dimensions through simple, intuitive dragging motions.
  • Represented a fusion of technical prowess, artistic ingenuity, and interactive design in a project that reshapes the boundaries of conventional portfolio representation.

Page Info

Blogs Landing Page

Front and Back view of the card

/experience/card/card_2.webp/experience/card/card_3.webp

Links embedding on the model

test description

/experience/card/card_1.webp

Blender project

test description

/experience/card/card_4.webp