diff --git a/plasmoid/contents/ui/CustomIndicator.qml b/plasmoid/contents/ui/CustomIndicator.qml
--- a/plasmoid/contents/ui/CustomIndicator.qml
+++ b/plasmoid/contents/ui/CustomIndicator.qml
@@ -22,130 +22,284 @@
 import QtQuick.Layouts 1.3
 import QtGraphicalEffects 1.0
 
+Rectangle {
+    id: bgrectA
+    anchors.fill: parent
+    color: theme.linkColor
+    
+    function aniRunWorking(){
+        animtimer.start()
+        topCircle.inneranimtopworking.start()
+        maskItem.inneranimworking.start()
+    }
+
+    function aniRunTransition(){
+        animtimer.start()
+        topCircle.inneranimtoptransition.start()
+        maskItem.inneranimtransition.start()
+    }
+
+
+    function aniRunHappy (){
+       animtimer.start()
+       topCircle.inneranimtophappy.start()
+       maskItem.inneranimhappy.start()
+    }
+
+    function aniRunError(){
+        animtimer.start()
+        topCircle.inneranimtopsad.start()
+        maskItem.inneranimsad.start()
+    }
+
 Item{
     id: customIndicatorBusy
-    anchors.centerIn: parent
-    property alias cstanim: customIndicatorBusy
-    property bool running: false
-    visible: false
+    anchors.fill: parent
+    visible: true
 
-    Item {
-            implicitWidth: units.gridUnit * 3
-            implicitHeight: units.gridUnit * 3
-            
-            Rectangle {
-                 id: antiinnerCircleOutVert
-                 anchors.centerIn: parent
-                 color: "skyblue"
-                 radius: 8
-                 implicitWidth: units.gridUnit * 1.2
-                 implicitHeight: units.gridUnit * 1.2                
-            }
+    RotationAnimator {
+        target:topCircle
+        id: antoWorking
+        from: 0;
+        to: 360;
+        duration: 500
+        running: false
+        alwaysRunToEnd: true
+    }
 
-            Rectangle {
-                 id: innerCircleOutHoriz
-                 anchors.centerIn: parent
-                 color: "steelblue"
-                 radius: 5
-                 implicitWidth: units.gridUnit * 2.2
-                 implicitHeight: units.gridUnit * 1.2
-                }
-                  
-            Rectangle {
-                 id: innerCircleOutVert
-                 anchors.centerIn: parent
-                 color: "steelblue"
-                 radius: 5
-                 implicitWidth: units.gridUnit * 1.2
-                 implicitHeight: units.gridUnit * 2.2
-                }
-                
-            Rectangle {
-                 id: innerCircleIn
-                 anchors.centerIn: parent
-                 color: "lightblue"
-                 border.color: "steelblue"
-                 border.width: units.gridUnit * 0.2
-                 radius: 100
-                 implicitWidth: units.gridUnit * 1.7
-                 implicitHeight: units.gridUnit * 1.7
-
-                 Image {
-                     id: innerPulser
-                     source: "../images/midanim.png"
-                     anchors.centerIn: parent
-                     height: units.gridUnit * 3.0
-                     width: units.gridUnit * 3.0
+    RotationAnimator {
+        target:topCircle
+        id: antoTransition
+        from: 0;
+        to: 0;
+        duration: 500
+        running: false
+        alwaysRunToEnd: true
+    }
+
+    RotationAnimator {
+        target:topCircle
+        id: antoSad
+        from: 0;
+        to: 180;
+        duration: 500
+        direction: RotationAnimator.Counterclockwise
+        running: false
+        alwaysRunToEnd: true;
+
+    }
+
+    RotationAnimator {
+        target:topCircle
+        id: antoHappy
+        from: 0;
+        to: 360;
+        duration: 500
+        running: false
+        alwaysRunToEnd: true;
+    }
+
+    SequentialAnimation {
+        id: seqmaskanimworking
+        running: false
+        loops: Animation.Infinite
+        PropertyAction { target: myRot; property: "origin.x"; value: units.gridUnit * 1.185 }
+        PropertyAction { target: myRot; property: "origin.y"; value: units.gridUnit * 1.185 }
+       NumberAnimation { target: myRot; property: "angle"; from:0; to: -360; duration: 500}
+
+       onStopped: {
+           myRot.angle = 0
+       }
+    }
+
+    SequentialAnimation {
+        id: seqmaskanimtransition
+        running: false
+        loops: Animation.Infinite
+        PropertyAction { target: myRot; property: "origin.x"; value: units.gridUnit * 1.185 }
+        PropertyAction { target: myRot; property: "origin.y"; value: units.gridUnit * 1.185 }
+        NumberAnimation { target: myRot; property: "angle"; from: 0; to: 0; duration: 500}
+    }
+
+    SequentialAnimation {
+        id: colrmeonAnsHappy
+        ParallelAnimation {
+        PropertyAnimation { target: innerCircleSurround; property: "color"; from: "#ffffff"; to: "lightgreen"; duration: 500; }
+        PropertyAnimation { target: circ; property: "color"; from: "#ffffff"; to: "lightgreen"; duration: 500; }
+        PropertyAnimation { target: topCircle.circle; property: "color"; from: "#ffffff"; to: "lightgreen"; duration: 500; }
+        }
+        ParallelAnimation {
+        PropertyAnimation { target: innerCircleSurround; property: "color"; from: "lightgreen"; to: "#fff"; duration: 500; }
+        PropertyAnimation { target: circ; property: "color"; from: "lightgreen"; to: "#fff"; duration: 500; }
+        PropertyAnimation { target: topCircle.circle; property: "color"; from: "lightgreen"; to: "#fff"; duration: 500; }
+        }
+    }
+
+    SequentialAnimation {
+        id: colrmeonAnsSad
+        ParallelAnimation {
+        PropertyAnimation { target: innerCircleSurround; property: "color"; from: "#ffffff"; to: "red"; duration: 500; }
+        PropertyAnimation { target: circ; property: "color"; from: "#ffffff"; to: "red"; duration: 1000; }
+        PropertyAnimation { target: topCircle.circle; property: "color"; from: "#ffffff"; to: "red"; duration: 500; }
+        }
+        ParallelAnimation {
+        PropertyAnimation { target: innerCircleSurround; property: "color"; from: "red"; to: "#fff"; duration: 500; }
+        PropertyAnimation { target: circ; property: "color"; from: "red"; to: "#fff"; duration: 1000; }
+        PropertyAnimation { target: topCircle.circle; property: "color"; from: "red"; to: "#fff"; duration: 500; }
+        }
+    }
+
+    SequentialAnimation {
+        id: seqmaskanimhappy
+        running: false
+        loops: Animation.Infinite
+        PropertyAction { target: myRot; property: "origin.x"; value: units.gridUnit * 1.185 }
+        PropertyAction { target: myRot; property: "origin.y"; value: units.gridUnit * 1.185 }
+       NumberAnimation { target: myRot; property: "angle"; from:0; to: -360; duration: 500}
+
+       onStopped: {
+           myRot.angle = -90
+           transtimer.start()
+       }
+
+       onStarted: {
+           colrmeonAnsHappy.running = true
+       }
+    }
+
+    SequentialAnimation {
+        id: seqmaskanimsad
+        running: false
+        loops: Animation.Infinite
+        PropertyAction { target: myRot; property: "origin.x"; value: units.gridUnit * 1.185 }
+        PropertyAction { target: myRot; property: "origin.y"; value: units.gridUnit * 1.185 }
+        NumberAnimation { target: myRot; property: "angle"; from:0; to: 360; duration: 500}
+
+       onStopped: {
+           myRot.angle = 90
+           transtimer.start()
+       }
+
+       onStarted: {
+           colrmeonAnsSad.running = true
+       }
+    }
+
+    Rectangle{
+        anchors.fill: parent
+        color: theme.linkColor
+
+    Rectangle {
+             id: topCircle
+             anchors.horizontalCenter: parent.horizontalCenter
+             anchors.verticalCenter: parent.verticalCenter
+             color: "#00000000"
+             radius: 1
+             opacity: 1
+             implicitWidth: units.gridUnit * 4.5
+             implicitHeight: units.gridUnit * 4.5
+             property alias inneranimtopworking: antoWorking
+             property alias inneranimtophappy: antoHappy
+             property alias inneranimtopsad: antoSad
+             property alias inneranimtoptransition: antoTransition
+             property alias circle: innerSqr
+
+             Rectangle{
+                id: innerSqr
+                anchors.top: parent.top
+                anchors.horizontalCenter: parent.horizontalCenter
+                color: "#fff"
+                radius: 100
+                width: units.gridUnit * 0.45
+                height: units.gridUnit * 0.45
+             }
+                    }
+
+    Rectangle {
+         id: innerCircleSurround
+         anchors.centerIn: parent
+         color: "#ffffff"
+         radius: 100
+         implicitWidth: units.gridUnit * 3
+         implicitHeight: units.gridUnit * 3
+         opacity: 1
+        }
+
+    Rectangle {
+         id: innerCircleSurroundOutterRing
+         anchors.centerIn: parent
+         color: theme.linkColor
+         radius: 100
+         implicitWidth: units.gridUnit * 2.75
+         implicitHeight: units.gridUnit * 2.75
+         opacity: 1
+        }
+
+    Rectangle {
+        id: maskItem
+         anchors.verticalCenter: parent.verticalCenter
+         anchors.left: innerCircleSurroundOutterRing.left
+         anchors.leftMargin: units.gridUnit * 0.2
+         color: "#00000000"
+         radius: 1000
+         implicitWidth: units.gridUnit * 1.25
+         implicitHeight: units.gridUnit * 2.4
+         clip: true
+         property alias cc: semicirc
+         property alias inneranimworking: seqmaskanimworking
+         property alias inneranimtransition: seqmaskanimtransition
+         property alias inneranimhappy: seqmaskanimhappy
+         property alias inneranimsad: seqmaskanimsad
+         opacity: 1
+
+         transform: Rotation {
+                     id: myRot
                  }
-                 
-                 ColorOverlay {
-                     anchors.fill: innerPulser
-                     source: innerPulser
-                     color: "steelblue"
-                  }
-                }
 
-            RotationAnimator {
-                   target: innerCircleOutHoriz
-                   running: customIndicatorBusy.running
-                   from: 0
-                   to: 360
-                   loops: Animation.Infinite
-                   duration: 6000
-            }
-            
-            ScaleAnimator {
-                target: innerCircleOutHoriz
-                running: customIndicatorBusy.running
-                from: 1.1
-                to: 0.5
-                duration: 1200
-                loops: Animation.Infinite
-            }
+    Item {
+           id: semicirc
+           anchors.left: parent.left
+           anchors.top: parent.top
+           anchors.bottom: parent.bottom
+           width: units.gridUnit * 4.7
+           clip:true
+           opacity: 1
 
-            RotationAnimator {
-                   target: innerCircleOutVert
-                   running: customIndicatorBusy.running
-                   from: 0
-                   to: 360
-                   loops: Animation.Infinite
-                   duration: 6000
-            }
-            
-            RotationAnimator {
-                   target: antiinnerCircleOutVert
-                   running: customIndicatorBusy.running
-                   from: 360
-                   to: 0
-                   loops: Animation.Infinite
-                   duration: 6000
-                }
-        
-            ScaleAnimator {
-                target: innerCircleOutVert
-                running: customIndicatorBusy.running
-                from: 1.1
-                to: 0.5
-                duration: 1200
-                loops: Animation.Infinite
-            }
-            
-            ScaleAnimator {
-                target: antiinnerCircleOutVert
-                running: customIndicatorBusy.running
-                from: 0.5
-                to: 1.3
-                duration: 1200
-                loops: Animation.Infinite
+           Rectangle{
+               id: circ
+               width: parent.width
+               height: parent.height
+               radius:100
+               color: "white"
+         }
+       }
+      }
+
+    Timer {
+        id: animtimer
+        interval: 500;
+        repeat: false
+        onTriggered: {
+            maskItem.inneranimworking.stop()
+            maskItem.inneranimtransition.stop()
+            maskItem.inneranimhappy.stop()
+            maskItem.inneranimsad.stop()
+            topCircle.inneranimtopworking.stop()
+            topCircle.inneranimtoptransition.stop()
+            topCircle.inneranimtophappy.stop()
+            topCircle.inneranimtopsad.stop()
             }
+        }
 
-            ScaleAnimator {
-                target: innerCircleIn
-                running: customIndicatorBusy.running
-                from: 1
-                to: 0.7
-                duration: 1200
-                loops: Animation.Infinite
+    Timer {
+        id: transtimer
+        interval: 500;
+        repeat: false
+        onTriggered: {
+            myRot.angle = 0
+            antoTransition.running = true
+                    }
+                }
             }
-          }
         }
+      }
diff --git a/plasmoid/contents/ui/main.qml b/plasmoid/contents/ui/main.qml
--- a/plasmoid/contents/ui/main.qml
+++ b/plasmoid/contents/ui/main.qml
@@ -64,6 +64,7 @@
     property alias autoCompModel: completionItems
     property alias textInput: qinput
     property alias plcLmodel: placesListModel
+    property bool intentfailure: false
     
     Connections {
         target: main2
@@ -254,20 +255,39 @@
     }
     
        function playwaitanim(recoginit){
-       switch(recoginit){ //"mycroft.skill.handler.start":
+       switch(recoginit){
        case "recognizer_loop:record_begin":
                drawer.open()
-               waitanimoutter.cstanim.visible = true
-               waitanimoutter.cstanim.running = true
+               waitanimoutter.aniRunWorking()
                break
+           case "recognizer_loop:wakeword":
+                waitanimoutter.aniRunHappy()
+                break
+           case "intent_failure":
+                waitanimoutter.aniRunError()
+                intentfailure = true
+                break
            case "recognizer_loop:audio_output_start":
-               drawer.close()
-               waitanimoutter.cstanim.visible = false
-               waitanimoutter.cstanim.running = false
+               if (intentfailure === false){
+                   drawer.close()
+               }
+               else {
+                delay(1500, function() {
+                        drawer.close()
+                        intentfailure = false;
+                    }) 
+                }
                break
            case "mycroft.skill.handler.complete":
-               drawer.close()
-               waitanimoutter.cstanim.running = false
+               if (intentfailure === false){
+                   drawer.close()
+               }
+               else {
+                delay(1500, function() {
+                        drawer.close()
+                        intentfailure = false;
+                    }) 
+                }
                break
        }
    }
@@ -571,14 +591,24 @@
                                 statusId.text = "Connection Error"
                                 statusId.color = "red"
                                 mycroftstartservicebutton.circolour = "red"
-                                retryConn()
                                 midbarAnim.showstatsId()
+                                drawer.open()
+                                waitanimoutter.aniRunError()
+                                delay(1250, function() {
+                                    drawer.close()
+                                })
+
                          } else if (socket.status == WebSocket.Open) {
                                 statusId.text = "Mycroft is Ready"
                                 statusId.color = "green"
                                 mycroftstartservicebutton.circolour = "green"
                                 mycroftStatusCheckSocket.active = false;
                                 midbarAnim.showstatsId()
+                                drawer.open()
+                                waitanimoutter.aniRunHappy()
+                                delay(1250, function() {
+                                    drawer.close()
+                                })
                          } else if (socket.status == WebSocket.Closed) {
                                 statusId.text = "Mycroft is Disabled"
                                 statusId.color = "#f4bf42"
@@ -1165,7 +1195,7 @@
     Drawer {
          id: drawer
           width: parent.width
-          height: units.gridUnit * 4
+          height: units.gridUnit * 5.5
           edge: Qt.BottomEdge
  
           Rectangle {