Giới thiệu dự án

Thị trường thương mại điện tử ngành nội thất toàn cầu đang chứng kiến sự chuyển dịch mạnh mẽ hướng tới trải nghiệm trực quan hóa 3D và cá nhân hóa sản phẩm theo thời gian thực. Theo các khảo sát thị trường nội thất, hơn 60% khách hàng mong muốn được xem trước không gian sống dưới dạng mô hình 3D trực quan trước khi đưa ra quyết định mua hàng. Tuy nhiên, quy trình tư vấn và thiết kế truyền thống đang đối mặt với các rào cản lớn:

  • Thời gian kết xuất (rendering) kéo dài: Sử dụng các phần mềm máy trạm như SketchUp, 3ds Max, Blender đòi hỏi từ 1 đến 7 ngày để hoàn thiện một bản phối cảnh phòng bếp hoặc phòng khách.
  • Chi phí nhân sự và bản quyền cao: Đòi hỏi kiến trúc sư có chuyên môn sâu về đồ họa 3D, trong khi tỷ lệ chuyển đổi chốt đơn chưa được tối ưu nếu khách hàng thay đổi ý định thiết kế nhiều lần.
  • Thiếu tính tương tác trực tiếp: Khách hàng không thể tự do tinh chỉnh kích thước, chất liệu, màu sắc và xem báo giá tự động ngay trên trình duyệt web.

Đồ án tốt nghiệp "Xây dựng website hỗ trợ thiết kế nội thất" (thực hiện bởi sinh viên Mai Hải Đăng, Nguyễn Minh Chiến - GVHD: TS. Mai Anh Thơ, Khoa Công nghệ Thông tin, Trường Đại học Sư phạm Kỹ thuật TP.HCM, 07/2024) được phát triển nhằm giải quyết triệt để các bài toán trên. Dự án xây dựng một nền tảng Web 3D thời gian thực (Real-time Web-based 3D Platform) cho phép người dùng tự thiết kế, tùy biến và mô phỏng nội thất đa dạng chỉ sau 3-5 phút làm quen.

+-------------------------------------------------------------------------+
|                        MỤC TIÊU CỐT LÕI CỦA ĐỀ TÀI                       |
+-------------------------------------------------------------------------+
| 1. Xây dựng môi trường đồ họa WebGL tương tác mượt mà trên Three.js.     |
| 2. Phát triển module Product Configurator (Bếp chữ I, Bếp chữ L).       |
| 3. Phát triển module Virtual Design (Bố trí không gian phòng mở).        |
| 4. Tự động hóa tính toán kích thước, ràng buộc kỹ thuật và lập bảng giá. |
| 5. Cung cấp trang quản trị Admin quản lý dữ liệu Master Data 3D.        |
+-------------------------------------------------------------------------+

Phương pháp tiếp cận và Phạm vi dự án

  • Giải pháp kỹ thuật: Ứng dụng công nghệ đồ họa WebGL thông qua thư viện Three.js kết hợp cùng kiến trúc Single Page Application (SPA) của React.js, xử lý nghiệp vụ backend bằng framework FastAPI hiệu năng cao và cơ sở dữ liệu quan hệ PostgreSQL.
  • Chỉ số kỳ vọng: Tốc độ khung hình đạt ổn định $\ge 60\text{ FPS}$ trên máy tính bàn, thời gian tải mô hình 3D ban đầu $< 2.5\text{s}$, độ chính xác trong tự động chia modul bếp đạt sai số $0\text{ mm}$ theo tiêu chuẩn sản xuất thực tế.
  • Phạm vi và giới hạn: Tập trung vào các sản phẩm nội thất dạng module phổ biến (tủ bếp dưới, tủ bếp trên, tủ khô, cánh cửa, tay nắm) và nội thất rời (sofa, bàn trà, kệ tivi). Mô hình được tối ưu hóa ở định dạng Binary glTF (.glb).

Phân tích và thiết kế giải pháp

Phân tích hiện trạng

Khảo sát thực tế các giải pháp công nghệ trên thị trường cho thấy sự phân hóa rõ rệt giữa công cụ vẽ 3D chuyên sâu và công cụ tùy biến sản phẩm bán lẻ:

Tiêu chí so sánh Phần mềm CAD/BIM truyền thống (SketchUp / 3ds Max) Nền tảng 3D Configurator bán lẻ (Ví dụ: Nike By You) Giải pháp Website thiết kế nội thất đề xuất
Môi trường chạy Cài đặt ứng dụng Desktop nặng, yêu cầu GPU rời Trình duyệt Web (WebGL/Canvas) Trình duyệt Web đa nền tảng (Responsive WebGL)
Thời gian học sử dụng Từ vài tuần đến nhiều tháng 1 - 2 phút 3 - 5 phút với hướng dẫn Wizard Step-by-Step
Thời gian dựng hình 1 - 3 ngày cho một căn bếp Tức thì (Real-time) Tức thì (Real-time $\ge 60\text{ FPS}$)
Ràng buộc tiêu chuẩn gỗ Phụ thuộc hoàn toàn vào kỹ sư Cố định trên 1 form sản phẩm Tự động tính tỷ lệ Scale theo chuẩn module (450mm)
Khả năng xuất cấu hình Bản vẽ 2D kỹ thuật phức tạp Đơn hàng thương mại điện tử Bảng kê vật tư (BOM) và giá thành thời gian thực

Phân loại yêu cầu theo mô hình MoSCoW

  • Must have (Bắt buộc): Tải và hiển thị mô hình GLB; tùy chỉnh chia khối tủ theo kích thước thực; gắn cánh và tay nắm theo socket tọa độ; áp vật liệu PBR (Melamine, Acrylic, Sơn 2K); lưu/tải lại thiết kế từ database.
  • Should have (Nên có): Ẩn/hiện cánh cửa để xem cấu trúc thùng; chụp ảnh màn hình bản vẽ chất lượng cao; môi trường phản xạ ánh sáng HDR ẩn; cảnh báo va chạm tường trong Virtual Design.
  • Could have (Có thể có): Chế độ đo kích thước trực quan (Dimension ruler); thay đổi màu nền background không gian 3D.
  • Won't have (Chưa làm trong giai đoạn này): Xuất trực tiếp mã G-code cho máy CNC; tính toán tải trọng chịu lực chi tiết của từng ngăn kéo.

Thiết kế hệ thống

Kiến trúc hệ thống được xây dựng theo mô hình phân tầng Client-Server hiện đại, tách biệt hoàn toàn giữa tầng xử lý đồ họa giao diện và tầng logic dữ liệu.

+-----------------------------------------------------------------------------------+
|                                CLIENT LAYER (React.js)                            |
|  +-------------------------------------+  +------------------------------------+  |
|  |       Three.js Viewport (WebGL)     |  |       State Management (Redux)     |  |
|  |  - GLTFLoader, OrbitControls        |  |  - Step State, Selected Modules    |  |
|  |  - PBR Shading, HDR Reflection Map  |  |  - Pricing Calculator, Auth State  |  |
|  +-------------------------------------+  +------------------------------------+  |
+------------------------------------------+----------------------------------------+
                                           | HTTP REST API (Axios / JSON)
+------------------------------------------v----------------------------------------+
|                                SERVER LAYER (FastAPI)                             |
|  +---------------------+  +----------------------+  +--------------------------+  |
|  |  Auth Controller    |  |  Design Engine API   |  |  Master Data Manager     |  |
|  |  (JWT Bearer)       |  |  (Step & Constraint) |  |  (Module, Material, Price)| |
|  +---------------------+  +----------------------+  +--------------------------+  |
+------------------------------------------+----------------------------------------+
                                           | SQLAlchemy ORM (asyncpg driver)
+------------------------------------------v----------------------------------------+
|                               DATABASE LAYER (PostgreSQL)                         |
|  [users]  [designs]  [design_details]  [modules]  [submodules]  [materials]       |
|  [textures]  [virtual_rooms]  [virtual_modules]  [pricing_rules]                  |
+-----------------------------------------------------------------------------------+

Technology Stack và Thông số phiên bản

  • Frontend Client: React.js v18.2.0, Three.js v0.160.0, Redux Toolkit v2.0.1, Axios v1.6.5, TailwindCSS v3.4.1.
  • Backend Server: FastAPI v0.109.0 (Python 3.11), Uvicorn v0.27.0 (ASGI Server), Pydantic v2.6.0 để validate dữ liệu đầu vào.
  • Database Management: PostgreSQL 16.1 lưu trữ quan hệ có ràng buộc toàn vẹn dữ liệu.
  • 3D Modeling Tools: Trimble SketchUp 2023 chuẩn hóa Mesh Groups và tối ưu lưới đa giác, xuất định dạng glTF 2.0.

Thiết kế RESTful API cốt lõi

Phương thức Endpoint Chức năng nghiệp vụ Dữ liệu trả về / Payload
POST /api/v1/auth/login Xác thực người dùng và cấp JWT { "access_token": "...", "token_type": "bearer" }
GET /api/v1/designs/steps/{type_id} Lấy cấu hình các step dựng hình theo loại bếp Danh sách các Step (Vị trí gốc, góc xoay, vector tịnh tiến)
POST /api/v1/designs/save Lưu bản vẽ Product Configurator / Virtual Snapshot JSON cấu trúc cây Module, Material ID, Transform
GET /api/v1/designs/{design_id} Tải lại bản vẽ đã lưu lên Viewport 3D Dữ liệu chi tiết Module, Tọa độ, Texture ID để render lại
GET /api/v1/materials/textures Lấy danh mục vật liệu và maps texture Bảng ánh xạ Material -> danh sách ảnh Texture URL
POST /api/v1/pricing/calculate Tính tổng chi phí thiết kế tự động Chi tiết đơn giá từng module, vật liệu cánh, phụ kiện

Phương pháp luận phát triển (Methodology)

Dự án áp dụng mô hình Agile/Scrum rút gọn với 10 giai đoạn (milestones) liên tục từ tháng 08/2023 đến tháng 07/2024:

  1. Giai đoạn 1 - 3 (08/2023 - 09/2023): Phân tích nghiệp vụ tiêu chuẩn module mộc, thiết kế UI/UX trên Figma, nghiên cứu cơ chế pipeline nạp mô hình 3D qua Three.js.
  2. Giai đoạn 4 - 6 (09/2023 - 11/2023): Xây dựng Core API backend FastAPI, lập trình logic chuỗi tịnh tiến tọa độ các khối bếp chữ I/L, giải thuật nạp texture động.
  3. Giai đoạn 7 - 8 (11/2023 - 02/2024): Tích hợp PBR Shader với môi trường HDR ẩn, thêm tính năng ẩn/hiện cánh tủ và thước đo kích thước.
  4. Giai đoạn 9 - 10 (02/2024 - 07/2024): Phát triển phân hệ Virtual Design (bố trí nội thất phòng mở), xây dựng trang quản trị Master Data Admin, kiểm thử tải và nghiệm thu đề tài.

Implementation và kết quả

Quy trình phát triển và Thuật toán then chốt

1. Thuật toán tự động phân chia Module và Tính toán tỷ lệ Scale

Kích thước tiêu chuẩn của một đơn vị tủ bếp module là $450\text{ mm}$ (dao động hợp lệ từ $250\text{ mm} - 500\text{ mm}$). Khi người dùng nhập tổng chiều dài bếp $L\ (\text{mm})$, hệ thống tự động xác định số lượng đơn vị thiết kế khả dụng $N$ và tính tỷ lệ co giãn (scale factor) $S$:

$$N = \text{round}\left(\frac{L}{450}\right), \quad W_{\text{avg}} = \frac{L}{N}, \quad S = \frac{W_{\text{avg}}}{450}$$

// Implementation thuật toán tính toán Step và phân bổ vị trí Module trong Three.js
export const calculateModuleTransform = (stepConfig, previousModules, currentModuleWidth) => {
  let initialPosition = { ...stepConfig.defaultPosition };
  
  if (previousModules.length === 0) {
    return {
      position: [initialPosition.x, initialPosition.y, initialPosition.z],
      rotation: [0, stepConfig.rotationY, 0]
    };
  }

  // Lấy thông tin module liền trước
  const lastModule = previousModules[previousModules.length - 1];
  const lastWidth = lastModule.customWidth || lastModule.defaultWidth;

  // Tịnh tiến vị trí dựa trên trục dịch chuyển của step hiện tại
  const newX = lastModule.position[0] + stepConfig.directionVector.x * lastWidth;
  const newY = lastModule.position[1] + stepConfig.directionVector.y * lastWidth;
  const newZ = lastModule.position[2] + stepConfig.directionVector.z * lastWidth;

  return {
    position: [newX, newY, newZ],
    rotation: [0, stepConfig.rotationY, 0]
  };
};

2. Kỹ thuật Selective Texture Mapping trên mô hình GLB

Để đảm bảo bản vẽ phản ánh chính xác quy cách đóng đồ gỗ công nghiệp (ví dụ: tấm hậu không phủ vân gỗ đắt tiền, chỉ phủ melamin trơn bảo vệ), hệ thống áp dụng cơ chế lọc Mesh theo Group Name trong cây đối tượng Three.js:

import * as THREE from 'three';

export const applyTextureToSelectiveMeshes = (gltfModel, textureUrl, materialParams) => {
  const textureLoader = new THREE.TextureLoader();
  textureLoader.load(textureUrl, (loadedTexture) => {
    loadedTexture.wrapS = THREE.RepeatWrapping;
    loadedTexture.wrapT = THREE.RepeatWrapping;
    loadedTexture.repeat.set(1, 1);

    gltfModel.scene.traverse((child) => {
      if (child.isMesh) {
        // Chỉ map texture vào các Mesh được quy định là Main (thùng) hoặc Door (cánh)
        if (child.name.includes("Main") || child.name.includes("Door")) {
          child.material = new THREE.MeshStandardMaterial({
            map: loadedTexture,
            roughness: materialParams.roughness, // Ví dụ: Acrylic = 0.1, Melamine = 0.8
            metalness: materialParams.metalness, // Sơn 2K bóng = 0.2
            envMapIntensity: 1.2
          });
          child.material.needsUpdate = true;
        }
      }
    });
  });
};

3. Kỹ thuật Socket Snapping cho tay nắm cửa và phụ kiện

Tại các cánh cửa tủ, mô hình 3D được gắn sẵn các điểm neo vô hình (Empty Meshes) có quy ước định danh như TAYNAM_LEFT, TAYNAM_CENTER. Khi người dùng chọn mẫu tay nắm, hệ thống tự động duyệt tìm socket này để đặt tay nắm vào đúng vị trí và góc quay tương ứng:

export const attachHandleToDoorSocket = (doorMesh, handleGltf) => {
  doorMesh.traverse((child) => {
    if (child.name.startsWith("TAYNAM_")) {
      const handleInstance = handleGltf.scene.clone();
      handleInstance.position.copy(child.position);
      
      if (child.name === "TAYNAM_LEFT") {
        handleInstance.rotation.set(0, 0, 0); // Đặt dọc cạnh trái
      } else if (child.name === "TAYNAM_CENTER") {
        handleInstance.rotation.set(0, 0, Math.PI / 2); // Xoay ngang giữa cánh
      }
      doorMesh.add(handleInstance);
    }
  });
};

Kiểm thử và Đánh giá hiệu năng

Hệ thống đã trải qua quá trình kiểm thử toàn diện trên nhiều cấu hình thiết bị khác nhau:

+-------------------------------------------------------------------------+
|                        KẾT QUẢ BENCHMARK HIỆU NĂNG                       |
+-------------------------------------------------------------------------+
| Client Desktop (Core i5 11th Gen, GPU Intel Iris Xe / GTX 1650):        |
| - Tốc độ dựng hình: Ổn định 60 FPS tại độ phân giải 1080p.             |
| - Tiêu thụ bộ nhớ RAM: Trung bình 110MB - 145MB bộ nhớ WebGL.           |
| - Thời gian tải tài nguyên: ~1.2s cho cảnh 3D chứa 15 module bếp.        |
|                                                                         |
| Client Mobile (iPhone 13, Safari / Android Chrome):                     |
| - Tốc độ dựng hình: 45 - 58 FPS.                                        |
| - Thao tác cảm ứng (Touch Orbit / Pinch Zoom): Mượt mà, không giật lag. |
|                                                                         |
| Backend FastAPI Performance (Đo bằng Apache Benchmark - 1000 requests):  |
| - Latency trung bình: 14.8ms cho endpoint tính giá và nạp cấu hình.      |
| - Tỷ lệ lỗi (Error rate): 0.00%.                                        |
+-------------------------------------------------------------------------+

Đổi mới và đóng góp

  1. Chuẩn hóa quy trình thiết kế mộc theo hệ Module hóa tự động: Thay thế việc vẽ tự do không kiểm soát bằng các thuật toán ràng buộc theo tiêu chuẩn sản xuất nội thất thực tế (khoảng dung sai kích thước 250 - 500mm, chiều ngang cố định 800mm cho module bồn rửa/bếp đôi).
  2. Mô phỏng chân thực độ bóng PBR bằng kỹ thuật Invisible HDR Environment: Sử dụng bản đồ môi trường ánh sáng HDR vô hình (scene.environment) giúp các vật liệu bóng như Sơn 2K, Acrylic phản xạ ánh sáng chân thực mà không làm phân tán sự chú ý của người dùng vào hình nền.
  3. Hệ thống phân tầng Mesh theo vai trò sản xuất: Cơ chế đặt tên Mesh trong file GLB (Main, Door, TAYNAM_*) loại trừ tình trạng map nhầm texture lên các tấm hậu ván trơn, đảm bảo tính đồng nhất 100% giữa mô hình 3D và thành phẩm sau thi công.
  4. Tối ưu hóa chi phí và thời gian chuyển đổi đơn hàng: Rút ngắn thời gian từ khâu tiếp nhận yêu cầu đến khi có bản vẽ 3D kèm báo giá từ 2 - 5 ngày xuống còn 3 - 5 phút, giúp doanh nghiệp tiết kiệm ước tính 70% chi phí nhân sự thiết kế ban đầu.

Ứng dụng thực tế và triển khai

Kịch bản sử dụng thực tế

  • Doanh nghiệp sản xuất nội thất may đo: Tích hợp website vào quy trình tư vấn bán hàng. Nhân viên kinh doanh chỉ cần mang theo tablet/laptop đến tận nhà khách hàng, nhập kích thước đo đạc thực tế của căn hộ và cùng khách hàng thiết kế trực tiếp bộ tủ bếp theo sở thích.
  • Khách hàng cá nhân (B2C): Truy cập website để tự do trải nghiệm, ướm thử các mẫu sofa, bàn trà vào không gian phòng khách có sẵn thông qua module Virtual Design trước khi đến showroom.
+---------------------------------------------------------------------------------+
|                        KIẾN TRÚC TRIỂN KHAI HỆ THỐNG (DEVOPS)                   |
+---------------------------------------------------------------------------------+
|   Internet User ----> [ Cloudflare CDN / WAF (SSL, Caching GLB, Textures) ]     |
|                                         |                                       |
|                                         v                                       |
|                   [ Nginx Reverse Proxy / Load Balancer ]                       |
|                         /                           \                           |
|                        v                             v                          |
|         [ React Frontend Container ]      [ FastAPI Backend Container (Gunicorn)]|
|         (Static Files Nginx Serving)                  |                         |
|                                                       v                         |
|                                           [ PostgreSQL 16 DB Container ]        |
|                                           (Persistent Data Storage / NVMe SSD)  |
+---------------------------------------------------------------------------------+

Hạn chế và hướng phát triển

Hạn chế hiện tại

  • Cơ chế phát hiện va chạm (Collision Detection) trong phân hệ Virtual Design đang áp dụng thuật toán Bounding Box đơn giản trên mặt phẳng 2D, chưa hỗ trợ phát hiện va chạm đối với các cấu trúc phòng có góc vát hoặc tường cong phức tạp.
  • Chưa tích hợp trực tiếp cổng thanh toán trực tuyến và chức năng xuất mã lệnh điều khiển máy cắt gỗ tự động (G-code / DXF).

Hướng phát triển tiếp theo

  • Tích hợp công nghệ Thực tế tăng cường (AR - Augmented Reality): Sử dụng WebXR API để chiếu trực tiếp các module tủ và sofa đã thiết kế vào không gian thực của phòng thông qua camera điện thoại thông minh.
  • Trí tuệ nhân tạo hỗ trợ thiết kế (AI Layout Generator): Ứng dụng mô hình AI gợi ý cách sắp xếp vị trí các module bếp tối ưu dựa trên quy tắc "Tam giác hoạt động" (Bếp nấu - Bồn rửa - Tủ lạnh) trong kiến trúc nội thất.
  • Tự động xuất bảng bóc tách vật tư chi tiết: Kết nối trực tiếp cơ sở dữ liệu với phần mềm quản lý sản xuất xưởng (ERP/CAM) để sinh bản vẽ cắt ván tự động.

Đối tượng hưởng lợi

+-------------------------------------------------------------------------------+
|                       GIÁ TRỊ MANG LẠI CHO CÁC ĐỐI TƯỢNG                      |
+-------------------------------------------------------------------------------+
| Sinh viên & Người học:                                                        |
| - Cung cấp mã nguồn tham khảo hoàn chỉnh về ứng dụng Three.js + React.js.     |
| - Mô hình mẫu tích hợp giữa FastAPI và xử lý Master Data 3D.                  |
|                                                                               |
| Lập trình viên (Developers):                                                  |
| - Nắm bắt kiến trúc xử lý Socket Snapping và Selective Mesh Texture Mapping.  |
| - Giải pháp tối ưu hóa hiệu năng render 3D thời gian thực trên trình duyệt.   |
|                                                                               |
| Doanh nghiệp nội thất & Xưởng sản xuất:                                       |
| - Giảm thiểu 70% thời gian tư vấn thiết kế ban đầu cho khách hàng.            |
| - Tăng tỷ lệ chuyển đổi chốt đơn nhờ hình ảnh trực quan và giá cả minh bạch.  |
|                                                                               |
| Nhà nghiên cứu:                                                               |
| - Tài liệu thực nghiệm về ứng dụng đồ họa WebGL trong lĩnh vực kiến trúc.     |
+-------------------------------------------------------------------------------+

Câu hỏi thường gặp

1. Yêu cầu phần cứng và trình duyệt để vận hành website là gì?

Hệ thống chạy hoàn toàn trên nền tảng WebGL chuẩn HTML5. Yêu cầu phía người dùng chỉ cần thiết bị có trình duyệt hiện đại (Google Chrome $\ge 90$, Mozilla Firefox $\ge 88$, Apple Safari $\ge 14$, Microsoft Edge $\ge 90$) và hỗ trợ tăng tốc phần cứng cơ bản. Không bắt buộc phải có card đồ họa rời (GPU rời).

2. Hệ thống xử lý thế nào khi có hàng trăm người dùng tùy biến 3D cùng lúc?

Do toàn bộ quá trình render 3D và tính toán tọa độ được thực thi tại Client-side (nhờ engine Three.js tận dụng GPU/CPU của máy người dùng), máy chủ FastAPI chỉ tiếp nhận các yêu cầu REST API nhẹ để lấy cấu hình JSON và file tĩnh. Toàn bộ file mô hình GLB và Texture được lưu trữ trên Object Storage và phân phối qua mạng CDN có cơ chế bộ nhớ đệm (caching), giúp hệ thống dễ dàng mở rộng phục vụ hàng chục ngàn người dùng đồng thời.

3. Website có thể tích hợp vào các hệ thống quản lý bán hàng (ERP/CRM) có sẵn không?

Hoàn toàn có thể. Kiến trúc Backend của hệ thống được xây dựng hoàn toàn dưới dạng RESTful API chuẩn hóa, cho phép các hệ thống CRM/ERP bên thứ ba dễ dàng đồng bộ danh mục sản phẩm, đơn giá, và nhận dữ liệu bản vẽ kỹ thuật thông qua Webhook hoặc API key.

4. Chi phí duy trì và bảo trì hệ thống hàng tháng bao gồm những gì?

Chi phí vận hành gồm: 01 VPS/Cloud Server chạy Docker (FastAPI + PostgreSQL) cấu hình khuyến nghị 2 vCPU / 4GB RAM (khoảng 200.000 - 400.000 VNĐ/tháng), dịch vụ lưu trữ file 3D S3 kết hợp Cloudflare Free CDN (chi phí gần như bằng 0 ở quy mô ban đầu).

5. Dữ liệu thiết kế của người dùng có được đảm bảo an toàn và bảo mật không?

Hệ thống áp dụng cơ chế xác thực phân quyền qua JWT (JSON Web Token), mã hóa mật khẩu theo thuật toán băm Bcrypt, và thiết lập ràng buộc khóa ngoại chặt chẽ trong cơ sở dữ liệu PostgreSQL. Mọi bản vẽ chỉ có thể được xem và chỉnh sửa bởi chính người tạo hoặc tài khoản Quản trị viên (Admin).

Kết luận

Đồ án tốt nghiệp "Xây dựng website hỗ trợ thiết kế nội thất" của nhóm tác giả Mai Hải Đăng và Nguyễn Minh Chiến đã giải quyết thành công bài toán chuyển đổi số trong lĩnh vực thiết kế và kinh doanh nội thất. Bằng cách kết hợp linh hoạt giữa Three.js, React.js, FastAPI và PostgreSQL, đề tài đã mang lại một giải pháp công nghệ toàn diện: vừa cung cấp công cụ trực quan hóa 3D trực quan, mượt mà cho khách hàng, vừa cung cấp giải pháp quản trị danh mục sản phẩm chuyên sâu cho doanh nghiệp.

Đây là nền tảng vững chắc để tiếp tục mở rộng sang các công nghệ tương lai như AI Generative Design và WebXR, góp phần thúc đẩy sự phát triển của ngành công nghiệp nội thất thông minh trong kỷ nguyên số.