3D E-Commerce Website Project

Person In Charge: Dongchan Kim

AR Era is Coming.

The launch of AR Glass by Mark Zuckerberg has significantly amplified global interest and highlighted the immense potential of 3D and AR devices. AR technology seamlessly integrates the physical and virtual worlds, enabling immersive and interactive experiences that have transformative applications across industries such as education, healthcare, and retail. Recognizing this potential, we initiated this project to pioneer user-centric innovations that deliver meaningful value and redefine how people engage with technology.



Ready For AR Industry.

We define next-generation AR as the convergence of advanced technologies, including tracking, dynamic 3D reconstruction, registration, rendering, and physics simulation, to deliver immersive and interactive experiences. Among the various techniques for rendering and dynamic 3D reconstruction, We have chosen to focus on Three.js as a starting point, using it as the foundation for my project development and to deepen my understanding of these core concepts.

AS-IS:

As someone interested in creating interactive 2D/3D web content, we have struggled to find resources that effectively teach both front-end development and 3D web graphics. While there are plenty of courses on game development and Unity, there is a noticeable lack of accessible and comprehensive materials focused on web-based 3D technologies. This has made it challenging to bridge the gap between the knowledge of web development and the advanced skills needed to build dynamic 3D websites.

TO-BE:

To address this, we are now learning R3F (React Three Fiber), a powerful stack that combines React and Three.js, allowing me to create 3D web content with ease and efficiency. This unique learning approach not only simplifies the process but also makes it engaging and practical. During this break, we are applying these skills to develop a 3D Web E-Commerce Project, which will help me solidify my understanding and produce an innovative, interactive web experience.

Project Timeline (2025-2026)

January 2025:

Study concept of 3D and Three.js in Web development

Feburary 2025:

3D E-Commerce Website development and deploying it

March 2025:

Ready for Next Project, 3D Immersive 360 Platform with Augmented Reality.


3D 이커머스 웹사이트 제작 프로젝트

AR 시대가 다가오고 있습니다.

마크 저커버그의 AR 글래스 출시로 인해 전 세계적으로 AR 기술에 대한 관심이 급격히 증가했으며, 3D 및 AR 기기의 잠재력이 크게 부각되었습니다. AR 기술은 물리적 세계와 가상 세계를 매끄럽게 통합하여 몰입감 있고 인터랙티브한 경험을 제공하며, 교육, 헬스케어, 리테일 등 다양한 산업에서 혁신적인 변화를 이끌고 있습니다. 이러한 가능성을 인식하고, 우리는 사용자를 중심으로 한 혁신적인 기술을 개발하여 사람들이 기술과 상호작용하는 방식을 재정의하는 것을 목표로 이 프로젝트를 시작했습니다.

AR 산업을 대비합니다.

차세대 AR은 트래킹, 동적 3D 재구성, 레지스트레이션(Registration), 렌더링, 물리 시뮬레이션 등 다양한 첨단 기술이 융합되어 몰입형 인터랙티브 경험을 제공하는 방향으로 발전하고 있습니다. 여러 렌더링 및 동적 3D 재구성 기법 중에서 우리는 Three.js를 학습의 시작점으로 선택하였으며, 이를 기반으로 프로젝트를 개발하고 해당 핵심 개념을 심화 학습하고자 합니다.

AS-IS:

인터랙티브한 2D/3D 웹 콘텐츠를 만들고 싶었지만, 프론트엔드 개발과 3D 웹 그래픽을 효과적으로 가르치는 자료를 찾기가 쉽지 않았습니다. 게임 개발과 Unity에 대한 강의는 많지만, 웹 기반 3D 기술을 쉽게 접근할 수 있도록 설명하는 자료는 부족한 상황입니다. 이 때문에 웹 개발 지식과 동적 3D 웹사이트 구축을 위한 고급 기술 간의 격차를 메우는 것이 어렵습니다.

TO-BE:

이를 해결하기 위해, 우리는 **R3F (React Three Fiber)**를 학습하고 있습니다. R3F는 React와 Three.js를 결합한 강력한 스택으로, 보다 효율적이고 직관적으로 3D 웹 콘텐츠를 개발할 수 있도록 도와줍니다. 이 독특한 접근 방식은 학습 과정을 더 쉽고 흥미롭게 만들 뿐만 아니라 실전에서도 활용할 수 있는 강점을 가지고 있습니다. 다가오는 방학 동안 우리는 이 기술을 활용하여 3D 웹 기반 이커머스 웹사이트 제작 프로젝트를 개발할 예정이며, 이를 통해 개념을 더욱 탄탄히 다지고 혁신적인 인터랙티브 웹 경험을 만들어 나가고자 합니다.

프로젝트 일정 (2025-2026)

2025년 1월:

웹 개발에서 3D 및 Three.js 개념 학습

2025년 2월:

3D 이커머스 웹사이트 개발 및 배포

2025년 3월 ~:

차기 프로젝트 준비 – 증강현실을 결합한 3D 몰입형 360 플랫폼 개발

project image project image

LET’S WORK TOGETHER