Skip to content

3D Model Designer - a revolutionary Angular application that empowers you to create, manipulate, and customize 3D models effortlessly. With an intuitive interface and advanced Three.js integration, this tool is perfect for both beginners and seasoned professionals in the field of 3D modeling.

Notifications You must be signed in to change notification settings

oguzhan18/3d-model-designer

Repository files navigation

3D Model Designer

Welcome to the 3D Model Designer - a revolutionary Angular application that empowers you to create, manipulate, and customize 3D models effortlessly. With an intuitive interface and advanced Three.js integration, this tool is perfect for both beginners and seasoned professionals in the field of 3D modeling.

Features

1. Drag-and-Drop Tools

Easily add various 3D shapes (cube, sphere, cylinder, cone) to your scene by dragging and dropping them from the toolbox. Each shape can be customized and positioned to your liking.

2. Camera Controls

Navigate your 3D scene with ease using the integrated camera controls. Move the camera up, down, left, or right to get the perfect view of your models.

3. Object Properties Panel

Select any 3D object to access and modify its properties, including color, position, and scale. Make precise adjustments to bring your creative vision to life.

4. Export and Import Models

Export your 3D models in STL format for use in other applications or for 3D printing. Import STL files to continue working on existing models.

5. Dark Mode Toggle

Switch between light and dark mode to suit your preference or working environment. Enjoy a comfortable and visually pleasing experience.

Getting Started

Prerequisites

  • Node.js
  • Angular CLI

Installation

  1. Clone the repository:
    git clone https://github.com/oguzhan18/3d-model-designer.git
2. Navigate to the project directory:
  ```bash
  cd 3d-model-designer

Running the Application

Start the development server:

  ng serve

Open your browser and navigate to http://localhost:4200 to see the application in action.

Usage

Adding and Manipulating Objects

  1. Drag a shape from the "Tools" panel and drop it onto the canvas.
  2. Select the object to view and edit its properties in the "Properties" panel.
  3. Use the camera controls to navigate around the scene and get the best view.

Exporting Models

Click the export button to download your 3D model in STL format. The file can be used in other 3D applications or for 3D printing.

Importing Models

Use the file input to load STL files into the application. Continue working on your models seamlessly.

Technical Details

Built With

Angular - Frontend framework for building dynamic web applications. Three.js - A powerful 3D library that makes WebGL simpler. Tailwind CSS - A utility-first CSS framework for styling.

File Structure

  • src/app: Angular components and services.
  • src/assets: Static assets such as fonts and images.
  • src/styles: Global styles and theme settings.

About

3D Model Designer - a revolutionary Angular application that empowers you to create, manipulate, and customize 3D models effortlessly. With an intuitive interface and advanced Three.js integration, this tool is perfect for both beginners and seasoned professionals in the field of 3D modeling.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published