diff --git a/ArchitectureColoredPainting/src/Editor/EditorWidget.cpp b/ArchitectureColoredPainting/src/Editor/EditorWidget.cpp
index 81d9f19..03ca81d 100644
--- a/ArchitectureColoredPainting/src/Editor/EditorWidget.cpp
+++ b/ArchitectureColoredPainting/src/Editor/EditorWidget.cpp
@@ -31,6 +31,7 @@ EditorWidget::EditorWidget(QWidget *parent) : QWidget(parent)
     QJsonObject source = jsonDoc.object();
     elementManager = new ElementManager(source,previewWindow->getRenderer());
     layerManager = new LayerManager(source, elementManager);
+    qDebug() << layerManager->toJson();
     previewWindow->initialize(layerManager,QSize(jsonDoc.object().value("width").toDouble(),jsonDoc.object().value("height").toDouble()));
     if (layerManager->getRoot() != nullptr)
     {
diff --git a/ArchitectureColoredPainting/src/Editor/ElementManager.cpp b/ArchitectureColoredPainting/src/Editor/ElementManager.cpp
index 78b03b6..0177c31 100644
--- a/ArchitectureColoredPainting/src/Editor/ElementManager.cpp
+++ b/ArchitectureColoredPainting/src/Editor/ElementManager.cpp
@@ -3,6 +3,7 @@ ElementManager::ElementManager(QJsonObject source,Renderer::ElementRenderer* ren
 {
     auto elementsJson = source.value("elements").toArray();
     qDebug() << elementsJson.size();
+    int index = 0;
     for (auto elementJson : elementsJson)
     {
         if (elementJson.toObject().value("type").toString() == "group")
@@ -12,6 +13,8 @@ ElementManager::ElementManager(QJsonObject source,Renderer::ElementRenderer* ren
         
         (*elements.rbegin())->renderer = renderer;
     }
+	for (auto element : elements)
+		element->index = index++;
 }
 
 void ElementManager::addElement(GraphicElement *element)
@@ -33,3 +36,13 @@ GraphicElement *ElementManager::getElementById(int index)
 ElementManager::~ElementManager()
 {
 }
+
+QJsonObject ElementManager::toJson() const
+{
+	QJsonArray elementsJson;
+	for (auto element : elements)
+		elementsJson.push_back(element->toJson());
+	QJsonObject result;
+	result.insert("elements", elementsJson);
+	return result;
+}
\ No newline at end of file
diff --git a/ArchitectureColoredPainting/src/Editor/ElementManager.h b/ArchitectureColoredPainting/src/Editor/ElementManager.h
index 3c26f9b..7673c17 100644
--- a/ArchitectureColoredPainting/src/Editor/ElementManager.h
+++ b/ArchitectureColoredPainting/src/Editor/ElementManager.h
@@ -19,6 +19,7 @@ class ElementManager
     ~ElementManager();
     void addElement(GraphicElement *element);
     void removeElement(GraphicElement *pElement);
+	QJsonObject toJson()const;
     /**
      *  only used in initialization
      */
diff --git a/ArchitectureColoredPainting/src/Editor/GraphicElement.cpp b/ArchitectureColoredPainting/src/Editor/GraphicElement.cpp
index 9381eee..eecb1fd 100644
--- a/ArchitectureColoredPainting/src/Editor/GraphicElement.cpp
+++ b/ArchitectureColoredPainting/src/Editor/GraphicElement.cpp
@@ -76,3 +76,10 @@ PixelPath GroupElement::getPaintObject(std::vector<Renderer::ElementStyleStrokeD
 //		rawPath.addPath(path);
 //	}
 //}
+//TODO : Ìí¼Óϸ½Ú
+QJsonObject GraphicElement::toJson() const
+{
+	QJsonObject result;
+	result.insert("name", name);
+	return result;
+}
\ No newline at end of file
diff --git a/ArchitectureColoredPainting/src/Editor/GraphicElement.h b/ArchitectureColoredPainting/src/Editor/GraphicElement.h
index a34d56f..a3fd8e5 100644
--- a/ArchitectureColoredPainting/src/Editor/GraphicElement.h
+++ b/ArchitectureColoredPainting/src/Editor/GraphicElement.h
@@ -22,7 +22,9 @@ class GraphicElement
 public:
 	Renderer::ElementRenderer *renderer;
     QString name = "";
+    int index;
     // TODO: ¸ÄΪBitmapPath
+	virtual QJsonObject toJson() const;
     virtual PixelPath getPaintObject() const = 0;
     virtual PixelPath getPaintObject(std::vector<Renderer::ElementStyleStrokeDemo>) const = 0;
 };
diff --git a/ArchitectureColoredPainting/src/Editor/LayerManager.cpp b/ArchitectureColoredPainting/src/Editor/LayerManager.cpp
index 5831180..a9b73b8 100644
--- a/ArchitectureColoredPainting/src/Editor/LayerManager.cpp
+++ b/ArchitectureColoredPainting/src/Editor/LayerManager.cpp
@@ -62,11 +62,20 @@ bool LayerManager::changeParent(FolderLayerWrapper *newParent) const
     selectedLayers[0]->setParent(newParent);
     return true;
 }
+
 void LayerManager::addLayer(LayerWrapper *layer)
 {
     layerSet.insert(layer);
 }
+
 void LayerManager::removeLayer(LayerWrapper *layer)
 {
     layerSet.erase(layer);
 }
+
+QJsonObject LayerManager::toJson() const
+{
+	QJsonObject result;
+	result.insert("root-layer", root->toJson());
+	return result;
+}
\ No newline at end of file
diff --git a/ArchitectureColoredPainting/src/Editor/LayerManager.h b/ArchitectureColoredPainting/src/Editor/LayerManager.h
index b484047..390cfed 100644
--- a/ArchitectureColoredPainting/src/Editor/LayerManager.h
+++ b/ArchitectureColoredPainting/src/Editor/LayerManager.h
@@ -31,6 +31,7 @@ class LayerManager
     LayerWrapper *getRoot() const;
     LayerManager() = default;
 	LayerManager(QJsonObject source, ElementManager* elementManager);
+	QJsonObject toJson() const;
     void paint(QPainter *painter, QSize size) const;
     bool rename(QString newName) const;
     bool combine() const;
diff --git a/ArchitectureColoredPainting/src/Editor/LayerWrapper.cpp b/ArchitectureColoredPainting/src/Editor/LayerWrapper.cpp
index a8f0a07..28ba954 100644
--- a/ArchitectureColoredPainting/src/Editor/LayerWrapper.cpp
+++ b/ArchitectureColoredPainting/src/Editor/LayerWrapper.cpp
@@ -53,6 +53,7 @@ FolderLayerWrapper::FolderLayerWrapper(QJsonObject json, ElementManager *element
         auto p = reinterpret_cast<GroupElement *>(elementManager->getElementById(referencedJson.toInt()));
         if (p != nullptr)
             p->setSourceLayer(this);
+		this->referencedBy = referencedJson.toInt();
     }
     for (auto childJson : childrenJson)
     {
@@ -181,3 +182,40 @@ QTreeWidgetItem* FolderLayerWrapper::getQTreeItem()
 	}
 	return LayerWrapper::getQTreeItem();
 }
+
+//TODO: add effects
+
+QJsonObject LayerWrapper::toJson() const 
+{
+	QJsonObject json;
+	json.insert("name", property.name);
+	QJsonObject transformJson;
+	transformJson.insert("offset", QJsonObject({ {"x", property.offset.x()}, {"y", property.offset.y()} }));
+	transformJson.insert("scale", QJsonObject({ {"x", property.scale.x()}, {"y", property.scale.y()} }));
+	transformJson.insert("rotation", property.rotation);
+	json.insert("transform", transformJson);
+	return json;
+}
+
+QJsonObject FolderLayerWrapper::toJson() const
+{
+	QJsonObject json = LayerWrapper::toJson();
+	QJsonArray childrenJson;
+	for (auto& child : children)
+		childrenJson.push_back(child->toJson());
+	json.insert("children", childrenJson);
+    json.insert("is-folder", true);
+    if(this->referencedBy != -1)
+		json.insert("referenced-by", this->referencedBy);
+    else
+		json.insert("referenced-by", QJsonValue());
+	return json;
+}
+
+QJsonObject LeafLayerWrapper::toJson() const
+{
+	QJsonObject json = LayerWrapper::toJson();
+	json.insert("element", wrappedElement->index);
+	json.insert("is-folder", false);
+	return json;
+}
\ No newline at end of file
diff --git a/ArchitectureColoredPainting/src/Editor/LayerWrapper.h b/ArchitectureColoredPainting/src/Editor/LayerWrapper.h
index 8d0284f..130b7f9 100644
--- a/ArchitectureColoredPainting/src/Editor/LayerWrapper.h
+++ b/ArchitectureColoredPainting/src/Editor/LayerWrapper.h
@@ -60,13 +60,16 @@ class LayerWrapper
     // virtual void deleteAll() const = 0;
     virtual void del();
     virtual void delSelf();
+	virtual QJsonObject toJson() const;
     ~LayerWrapper() = default;
+    
 };
 
 class FolderLayerWrapper : public LayerWrapper
 {
   public:
     vector<shared_ptr<LayerWrapper>> children;
+    int referencedBy = -1;
 
   public:
 
@@ -80,6 +83,7 @@ class FolderLayerWrapper : public LayerWrapper
 	void del() override;
     void delSelf() override;
 	QTreeWidgetItem* getQTreeItem() override;
+	QJsonObject toJson() const override;
 };
 
 class LeafLayerWrapper : public LayerWrapper
@@ -93,6 +97,7 @@ class LeafLayerWrapper : public LayerWrapper
     void refresh() override;
     LeafLayerWrapper() = default;
     LeafLayerWrapper(QJsonObject json, ElementManager *elementManager, FolderLayerWrapper*parent);
+    QJsonObject toJson() const override;
 };
 
 Q_DECLARE_METATYPE(LayerWrapper *)
diff --git a/data.json b/data.json
index 577f595..150cb6c 100644
--- a/data.json
+++ b/data.json
@@ -34,6 +34,7 @@
     "is-folder": true,
     "referenced-by": null,
     "children": [
+
       {
         "name": "GroupFolderExample",
         "transform": {
@@ -87,6 +88,7 @@
           }
         ]
       },
+
       {
         "name": "ReferencingGroupLayer",
         "transform": {