diff --git a/docs/en/accessory/485t.md b/docs/en/accessory/485t.md
index 50532712..d30c5133 100644
--- a/docs/en/accessory/485t.md
+++ b/docs/en/accessory/485t.md
@@ -6,7 +6,7 @@
 <img src="assets/img/product_pics/accessory/485t/485t_02.jpg" width="30%" height="30%">
 
 
-:memo:**[Description](#Description)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;🛒**[Purchase](https://m5stack.com/collections/m5-accessory/products/frame-panel-extended-install-components)**
+:memo:**[Description](#Description)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;🛒**[Purchase](https://m5stack.com/collections/m5-accessory/products/m5stack-rs485t)**
 
 ## Description
 
diff --git a/docs/en/unit/butterfly.md b/docs/en/unit/butterfly.md
index f740f83b..af9ea567 100644
--- a/docs/en/unit/butterfly.md
+++ b/docs/en/unit/butterfly.md
@@ -5,7 +5,7 @@
 
 ***
 
-:memo:**[Description](#Description)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:bulb:**[Assembly Steps](#Assembly-Steps)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;🛒**[Purchase](https://m5stack.com/collections/m5-unit/products/m5stack-butterfly-magic-prop-toy)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+:memo:**[Description](#Description)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:bulb:**[Assembly Steps](#Assembly-Steps)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;🛒**[Purchase](https://m5stack.com/collections/m5-application/products/butterfly-launcher)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 
 
 ## Description
diff --git a/docs/index.html b/docs/index.html
index 0c76b488..465356c4 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -5,33 +5,30 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, shrink-to-fit=no">
-    <meta name="description"
-        content="M5Stack Documentations - Modular Rapid Product Development Toolkit, based on ESP32. ESP32 is a series of low cost, low power system on a chip microcontrollers with integrated Wi-Fi and dual-mode Bluetooth.">
+    <meta name="description" content="M5Stack Documentations - Modular Rapid Product Development Toolkit, based on ESP32. ESP32 is a series of low cost, low power system on a chip microcontrollers with integrated Wi-Fi and dual-mode Bluetooth.">
     <meta name="google-site-verification" content="_EWJaM8G6xwMtEqemO4yN8WqSU2CaKVi3jTj0gLg48E">
     <title>M5Stack - A series of modular stackable development devices</title>
     <link rel="icon" href="assets/img/favicon.ico">
-  
+
     <link rel="stylesheet" href="assets/css/loading.css">
     <script>
-            var _LoadingHtml = '<div id="loading"><div class="loading-flex"><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div></div></div>';
-            document.write(_LoadingHtml);
-                    
-                    //监听加载状态改变
-                    document.onreadystatechange = completeLoading;
-            
-                    //加载状态为complete时移除loading效果
-                    function completeLoading() {
-                        if (document.readyState == "complete") {
-                            var loadingMask = document.getElementById('loading');
-                            loadingMask.parentNode.removeChild(loadingMask);
-                        }
-                    }
+        var _LoadingHtml = '<div id="loading"><div class="loading-flex"><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div><div class="demo3"></div></div></div>';
+        document.write(_LoadingHtml);
+
+        //监听加载状态改变
+        document.onreadystatechange = completeLoading;
+        //加载状态为complete时移除loading效果
+        function completeLoading() {  
+            if (document.readyState == "complete") {    
+                var loadingMask = document.getElementById('loading');    
+                loadingMask.parentNode.removeChild(loadingMask);  
+            }
+        }
     </Script>
 
     <!-- Stylesheets -->
     <link rel="stylesheet" href="https://unpkg.com/docsify-themeable/dist/css/theme-simple.css" title="Simple">
 
-    
 
     <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap.min.css">
 
@@ -48,20 +45,21 @@
 <body>
     <div class="btn-toggle"></div>
     <div class="d-flex a flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-white border-bottom shadow-sm">
-            <h5 class="my-0 mr-md-auto font-weight-normal"><a href="https://m5stack.com/"><img src="//cdn.shopify.com/s/files/1/0056/7689/2250/files/LOGO_40x.jpg?v=1563273356" style="margin-right:10px;margin-top:-5px"></a>M5Stack Docs</h5>
+        <h5 class="my-0 mr-md-auto font-weight-normal">
+            <a href="https://m5stack.com/"><img src="//cdn.shopify.com/s/files/1/0056/7689/2250/files/LOGO_40x.jpg?v=1563273356" style="margin-right:10px;margin-top:-5px"></a>M5Stack Docs</h5>
 
-            <nav class="my-2 my-md-0 mr-md-3">
-                <a id="product" class="p-2 text-dark"href="#" >Product</a>
-                <a class="p-2 text-dark dropdown-toggle" data-toggle="dropdown">API</a>
-                <div class="dropdown-menu">
-                    <a id="arduino" class="dropdown-item" href="#/en/api">Arduino API</a>
-                    <a class="dropdown-item" href="https://github.com/m5stack/UIFlow-Code/wiki">MicroPython API</a>
-                </div>
-                <a id="cases" class="p-2 text-dark" href="#/en/case">M5Stack Cases</a>
-                <a id="related" class="p-2 text-dark" href="#/en/related_documents">Related Documents</a>
-                <a id="faq" class="p-2 text-dark" href="#/en/faq" style="margin-right: 70px;">FAQ</a>             
-            </nav>
-            <a id="language" class="btn btn-primary" style="color:#fff" onclick="language()">中文</a>
+        <nav class="my-2 my-md-0 mr-md-3">
+            <a id="product" class="p-2 text-dark" href="#">Product</a>
+            <a class="p-2 text-dark dropdown-toggle" data-toggle="dropdown">API</a>
+            <div class="dropdown-menu">
+                <a id="arduino" class="dropdown-item" href="#/en/api">Arduino API</a>
+                <a class="dropdown-item" href="https://github.com/m5stack/UIFlow-Code/wiki">MicroPython API</a>
+            </div>
+            <a id="cases" class="p-2 text-dark" href="#/en/case">M5Stack Cases</a>
+            <a id="related" class="p-2 text-dark" href="#/en/related_documents">Related Documents</a>
+            <a id="faq" class="p-2 text-dark" href="#/en/faq" style="margin-right: 70px;">FAQ</a>
+        </nav>
+        <a id="language" class="btn btn-primary" style="color:#fff" onclick="language()">中文</a>
     </div>
     <div id="app">loading...</div>
     <div><img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/back_top.png" class="back_top" onclick="(function(){$('html, body').animate({scrollTop: 0}, 500);})()"></div>
@@ -92,7 +90,7 @@
                 '/.*/navbar.md': '/navbar.md',
                 '/en/': '/',
             },
-            auto2top:  true,
+            auto2top: true,
             mergeNavbar: true,
             maxLevel: 4,
             subMaxLevel: 3,
@@ -108,98 +106,102 @@
         }
     </script>
     <script>
-        window.onload = function () {
+        window.onload = function() {
             // setInterval(function(){
             //     $('.nav-link[data-bind="event"]').on('mouseenter', Enter);
             //     $('.dropdown-menu div[data-bind="leave1"]').on('mouseleave', Leave);
             // }, 600);
         };
 
-        $(document).ready(function(){
-            $(".btn-toggle").on('click', function(){
+        $(document).ready(function() {
+            $(".btn-toggle").on('click', function() {
                 $(".btn-toggle").toggleClass('open');
                 $(".d-flex").toggleClass('open');
             });
         });
-    
+
         function Enter() {
             console.log(123)
             $(this).find("~ div").eq(0).removeClass("collapse")
             $(this).find("~ div").eq(0).addClass("collapse show")
-    
+
         };
+
         function Leave() {
             $(this).children("div").removeClass("collapse show")
             $(this).children("div").addClass("collapse")
-    
+
         };
-        function change_title(language){
-            if(language == "en"){
+
+        function change_title(language) {
+            if (language == "en") {
                 $("#language").text("中文");
                 $("#product").text("Product");
-                $("#product").attr("href","#");
+                $("#product").attr("href", "#");
                 $("#arduino").text("Arduino API");
-                $("#arduino").attr("href","#/en/api");
+                $("#arduino").attr("href", "#/en/api");
                 $("#cases").text("M5Stack Cases");
-                $("#cases").attr("href","#/en/case");
+                $("#cases").attr("href", "#/en/case");
                 $("#related").text("Related Documents");
-                $("#related").attr("href","#/en/related_documents");
+                $("#related").attr("href", "#/en/related_documents");
                 $("#faq").text("FAQ");
-                $("#faq").attr("href","#/en/faq");
-            }
-            else{
+                $("#faq").attr("href", "#/en/faq");
+            } else {
                 $("#language").text("EN");
                 $("#product").text("产品列表");
-                $("#product").attr("href","#/zh_CN/");
+                $("#product").attr("href", "#/zh_CN/");
                 $("#arduino").text("Arduino API");
-                $("#arduino").attr("href","#/zh_CN/api");
+                $("#arduino").attr("href", "#/zh_CN/api");
                 $("#cases").text("用户案例");
-                $("#cases").attr("href","#/zh_CN/case");
+                $("#cases").attr("href", "#/zh_CN/case");
                 $("#related").text("相关文档");
-                $("#related").attr("href","#/zh_CN/related_documents");
+                $("#related").attr("href", "#/zh_CN/related_documents");
                 $("#faq").text("常见问题");
-                $("#faq").attr("href","#/zh_CN/faq");
+                $("#faq").attr("href", "#/zh_CN/faq");
             }
         }
-        function language(){
+
+        function language() {
             var test = window.location.href;
-            if ((test.indexOf(/en/) == -1) && (test.indexOf(/zh_CN/) == -1)){
-                var test2 = test.concat("","zh_CN/");
+            if ((test.indexOf(/en/) == -1) && (test.indexOf(/zh_CN/) == -1)) {
+                var test2 = test.concat("", "zh_CN/");
                 window.location.href = test2;
                 change_title('zh_CN');
 
-            }else if (test.indexOf(/en/) == -1){
+            } else if (test.indexOf(/en/) == -1) {
                 var test2 = test.replace(/zh_CN/, "en");
                 window.location.href = test2;
                 change_title('en');
 
-            }
-            else{
+            } else {
                 var test2 = test.replace(/en/, "zh_CN");
                 window.location.href = test2;
                 change_title('zh_CN');
 
-            } 
+            }
         }
-        function page_loading(){
+
+        function page_loading() {
             var test = window.location.href;
-            if ((test.indexOf(/en/) == -1) && (test.indexOf(/zh_CN/) == -1)){
+            if ((test.indexOf(/en/) == -1) && (test.indexOf(/zh_CN/) == -1)) {
                 change_title('en');
 
-            }else if (test.indexOf(/en/) == -1){
+            } else if (test.indexOf(/en/) == -1) {
                 var test2 = test.replace(/zh_CN/, "en");
                 change_title('zh_CN');
 
-            }
-            else{
+            } else {
                 var test2 = test.replace(/en/, "zh_CN");
                 change_title('en');
 
-            } 
+            }
         }
-        function page_move(divId){
-            var t = $("#"+divId).offset().top;
-            $('html, body').animate({scrollTop: t}, 500);
+
+        function page_move(divId) {
+            var t = $("#" + divId).offset().top;
+            $('html, body').animate({
+                scrollTop: t
+            }, 500);
         }
         page_loading();
     </script>
@@ -225,4 +227,4 @@
 
 <!-- <script>setTimeout(function(){(function(){var xhr=new XMLHttpRequest();xhr.open("GET","https://web-admin.m5stack.com/api/statistic/platform");xhr.send();xhr.onerror=function(err){console.log(err)}})()});</script> -->
 
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/index.md b/docs/index.md
index 9dd92e44..62b71768 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -934,7 +934,7 @@
 
 <div class="item">
   <a href="/#/en/unit/hex">
-    <img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/m5-docs_homepage/unit/unit_hex_01.png">
+    <img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/m5-docs_homepage/unit/unit_hex_01.jpg">
   <p class="item-title">HEX</p>
   </a>
 </div>
diff --git a/docs/zh_CN/README.md b/docs/zh_CN/README.md
index a8c91e25..ff44002a 100644
--- a/docs/zh_CN/README.md
+++ b/docs/zh_CN/README.md
@@ -846,7 +846,7 @@
 
 <div class="item">
   <a href="/#/zh_CN/unit/hex">
-    <img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/m5-docs_homepage/unit/unit_hex_01.png">
+    <img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/m5-docs_homepage/unit/unit_hex_01.jpg">
   <p class="item-title"  >HEX</p>
   </a>
 </div>
diff --git a/docs/zh_CN/accessory/485t.md b/docs/zh_CN/accessory/485t.md
index 8b52736f..0082aa68 100644
--- a/docs/zh_CN/accessory/485t.md
+++ b/docs/zh_CN/accessory/485t.md
@@ -2,9 +2,7 @@
 
 <img src="assets\img\product_pics\accessory\485t\485t_01.jpg" width="30%" height="30%"> <img src="assets\img\product_pics\accessory\485t\485t_02.jpg" width="30%" height="30%">
 
-:memo:**[描述](#描述)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-
-<!-- 🛒**[购买链接](https://m5stack.com/collections/m5-accessory/products/frame-panel-extended-install-components)** -->
+:memo:**[描述](#描述)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;🛒**[购买链接](https://m5stack.com/collections/m5-accessory/products/m5stack-rs485t)**
 
 ## 描述
 
diff --git a/docs/zh_CN/module/lte.md b/docs/zh_CN/module/lte.md
index b561b467..9c5aa469 100644
--- a/docs/zh_CN/module/lte.md
+++ b/docs/zh_CN/module/lte.md
@@ -8,7 +8,7 @@
 
 ## 描述
 
-**LTE** 是M5Stack堆叠模块系列中的一款，LTE通信模块.内部集成**M8321** LTE工业级通信模组. 提供 TD-LTE/FDD-LTE/WCDMA/TDSCDMA/GSM/GPRS/EDGE 的频段.丰富的 Internet 协议、行业标准接口和功能,支持多种操作系统的USB驱动程序，能够给用户带来快速且稳定的通信体验.
+**LTE** 是M5Stack堆叠模块系列中的一款，LTE通信模块.内部集成**M8321** LTE全网通工业级通信模组. 提供 TD-LTE/FDD-LTE/WCDMA/TDSCDMA/GSM/GPRS/EDGE 的频段.丰富的 Internet 协议、行业标准接口和功能,支持多种操作系统的USB驱动程序，能够给用户带来快速且稳定的通信体验.
 
 
 
diff --git a/docs/zh_CN/module/nb-iot.md b/docs/zh_CN/module/nb-iot.md
index 6fec2e7c..35f56a1b 100644
--- a/docs/zh_CN/module/nb-iot.md
+++ b/docs/zh_CN/module/nb-iot.md
@@ -8,7 +8,7 @@
 
 ## 描述
 
-**NB-IoT** 是M5Stack堆叠模块系列中的一款，NB-IoT通信模块.内部集成高性能 NB-IoT 无线通信模组**M5311**.低功耗设计可以帮助客户获得更长的终端使用寿命.M5311 提供丰富的外部接口和协议栈，支持外接传感器设备，为用户的产品开发提供了极大的便利.同时支持 OneNET 云平台协议，真正实现无缝对接，快速开发.
+**NB-IoT** 是M5Stack堆叠模块系列中的一款，NB-IoT通信模块.内部集成高性能 NB-IoT 全网通无线通信模组**M5311**.低功耗设计可以帮助客户获得更长的终端使用寿命.M5311 提供丰富的外部接口和协议栈，支持外接传感器设备，为用户的产品开发提供了极大的便利.同时支持 OneNET 云平台协议，真正实现无缝对接，快速开发.
 
 该模块特别适用于以超低功耗、超小尺寸为核心需求的智能表计、智能穿戴、智能停车、市政管理等loT行业
 
diff --git a/docs/zh_CN/unit/butterfly.md b/docs/zh_CN/unit/butterfly.md
index cd0f496d..f09df34c 100644
--- a/docs/zh_CN/unit/butterfly.md
+++ b/docs/zh_CN/unit/butterfly.md
@@ -4,16 +4,15 @@
 
 ***
 
-:memo:**[描述](#描述)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:bulb:**[步骤](#步骤)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;🛒**[购买链接](https://m5stack.com/collections/m5-unit/products/m5stack-butterfly-magic-prop-toy)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+:memo:**[描述](#描述)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:bulb:**[步骤](#步骤)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;🛒**[购买链接](https://m5stack.com/collections/m5-application/products/butterfly-launcher)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 
 ## 描述
 
 **Butterfly Launcher** 是一个酷炫的蝴蝶模型发射器，相比旧版本的发射器，新版配备了MEGA328微处理器、锂电池组件、18个彩色LED灯，以及提供了两个拓展端口（分别用于电源，串口通信）. 实际使用时能够同时串联多个设备，并独立控制它们.
-
+<br>
 串行通信机制：将多个设备进行串联，为了准确的向某个设备发送指令，我们在代码中附加"id"变量，当指令通过控制器串行传输到设备时，每经过一个设备，变量都将进行减一操作，读取到变量为0的设备则执行命令.
-
+<br>
 因此，1，我们能够独立控制串行设备中的任意一个，并单独设置它们的LED颜色，闪烁模式，亮度和伺服状态.
-
 2,如同下方视频所示，在LED灯演示时，存在着一定的延迟，假设每个设备有100ms的延迟，并且我们总共有10个，则最后一个设备将有1s的延迟时间.为了优化这种延迟，我们可以对第一个设备进行编程以等待最后一个设备（由于协议的特性，延迟的产生是无法避免的）
 
 ## 产品特性
@@ -43,6 +42,45 @@
 
 <img src="assets\img\product_pics\app\butterfly\butterfly_05.jpg" width="30%" height="30%">
 
+
+## 装配步骤
+
+### 按钮功能（正面）
+ - 右：单击打开电源，双击打开电源。
+ - 左：长按直到led cricle变为另一种颜色，松开按钮。然后短按它将调整伺服臂。重复上述过程以获得正确的位置。
+
+### 装配蝴蝶模型
+
+<video width="500" height="500" controls>
+    <source src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/video/Product_example_video/App/Butterfly/butterfly_assembly_steps.mp4" type="video/mp4" >
+</video>
+
+
+### 外接电源（在设备连接超过10个的情况下，会需要外接电源使其稳定）
+
+<br><br>
+<img src="assets/img/product_pics/app/butterfly/6.jpg" width="30%" height="30%">
+
+注意：
+1）在线路末端添加电源，或者使用（GROVE-usbA连接线+充电宝）或（GROVE-usbA连接线 + 5V充电头）
+2）grove 2 usbA连接线
+3）带GROVE公端口的墙上插头
+
+
+## 推荐步骤
+
+1）使用m5go连接设备，在末端连接额外的电源。
+2）使用uiflow测试代码测试线路，确保每个设备正常工作。
+3）使用设备上的按钮加载蝴蝶.
+4）编程M5GO上的按钮启动发射蝴蝶
+ 
+<img src="assets/img/product_pics/app/butterfly/1.jpg" width="30%" height="30%">
+<img src="assets/img/product_pics/app/butterfly/2.jpg" width="30%" height="30%">
+<img src="assets/img/product_pics/app/butterfly/3.jpg" width="30%" height="30%">
+<img src="assets/img/product_pics/app/butterfly/4.jpg" width="30%" height="30%">
+
+## 程序部分
+
 关于控制程序，我们在UIFLow上封装了一个特别的程序块, 这使得您能够简单地编写控制程序.下面将向您展示如何在UIFlow上添加程序块.
 
 >1，导航到"自定义"，单击"打开"* m5d
@@ -56,3 +94,13 @@
 >3，展开Custom选项，选择蝴蝶程序块.
 
 <img src="assets\img\product_pics\app\butterfly\3.jpg">
+
+<img src="assets/img/product_pics/app/butterfly/4.jpg" width="30%" height="30%">
+
+
+## Video
+
+<video width="500" height="500" controls>
+    <source src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/video/Product_example_video/App/Butterfly/butterfly.mp4" type="video/mp4" >
+</video>
+