Quick Conversion of 2D Architecture Diagram into 3D

In real-world work scenarios, many users already have well-developed 2D architecture diagrams (such as those created in PowerPoint, Visio, whiteboard sketches, or images). However, when presenting solutions, reporting to clients, explaining products, or demonstrating digital twins, a 3D architecture diagram that is more intuitive, visual, and interactive is often far more effective.

With the built-in capabilities of iCraft and the help of AI tools, you can quickly upgrade your diagram through the following workflow:

2D Architecture Diagram → AI Recognition → Mermaid Code → Import into iCraft → Auto-generate 3D Architecture → Fine-tune Details → Export for Presentation

This section walks you through the full process so you can complete the transition from 2D to 3D in just a few minutes.

1

Step1: Use AI to Convert a 2D Architecture Diagram into Mermaid Code

First, prepare your 2D architecture diagram. In this example, we use a typical system architecture diagram.

Upload the image to an AI tool and ask it to convert the diagram into Mermaid code.

Recommended prompt example:

Please analyze this system architecture diagram, convert it into Mermaid code, retain the system hierarchical structure, mark all module names, and clearly represent the data flow direction.

After generation is complete, please copy the complete Mermaid code for backup. The following is the Mermaid code provided by AI, which uses the Flowchart mode.

Note: The Mermaid types supported by iCraft are architecture, flowchart-v2, stateDiagram, and sequenceDiagram. You can specify these types in the AI prompt to ensure the code is rendered effectively in iCraft.

flowchart TB

%% Client Layer
subgraph Client_Layer["Client Layer"]
    Web[Web Frontend]
    Mini[Mini Program]
    Mobile[Mobile App]

    Web -->|HTTP Request| Mobile
    Mini -->|API Call| Mobile
    
end

%% Service Layer
subgraph Service_Layer["Service Layer"]
    Gateway[API Gateway]

    UserService[User Service]
    OrderService[Order Service]
    ProductService[Product Service]

    Toolkit[Utility Toolkit]

    Gateway -->|Routing to| UserService
    Gateway -->|Routing to| OrderService
    Gateway -->|Routing to| ProductService

    OrderService -->|Data Interaction| Toolkit
    ProductService -->|Data Interaction| Toolkit
end

%% Data Layer
subgraph Data_Layer["Data Layer"]
    OSS[File Storage / OSS]
    MySQL[(MySQL Database)]
    Redis[(Redis Cache)]

    OSS -->|Interaction| MySQL
    MySQL -->|Reads| Redis
end

%% Cross Layer Connections

Mobile --> Gateway

UserService -->|Data Interaction| MySQL
OrderService -->|Data Interaction| MySQL
ProductService -->|Data Interaction| MySQL

Toolkit --> Redis

2

Step2: Import the Mermaid Code into iCraft

1. Enter the iCraft editor, create a new scene, and select “Mermaid 3D Visualization” from the navigation bar.

2. Paste the Mermaid code you just generated into the pop-up code input box, then click “Apply”.

3. The system will automatically parse the structural relationships and create the corresponding 3D architecture scene on the canvas. The structure and logic of the generated 3D scene are completely consistent with the 2D architecture diagram.

3

Step 3: Fine-tune Colors, Materials and Models

To achieve a more professional visual effect for the 3D architecture, further refined adjustments can be made:

• Adjust the color scheme to make the hierarchy clear at a glance.

• Replace models to make objects more refined and expressive.

• Adjust the layout and align modules for a more presentation-friendly overall structure.

Below is an example architecture diagram after adjustments:

---

Export & Share Results

Upon completion, you can:

• Export high-definition images up to 8K resolution

• Generate online shareable links for direct browser presentation

• Export code for embedding into web pages or systems

• Create videos to insert into presentations for client demos

• Serve as the foundation for digital twin application scenarios

• Use other creative and expressive demonstration formats