diff --git a/resources/public/images/svg/play.svg b/resources/public/images/svg/play.svg
new file mode 100644
index 0000000000..4d3a3b5ea2
--- /dev/null
+++ b/resources/public/images/svg/play.svg
@@ -0,0 +1,54 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 500 500.00001"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="play.svg">
+  <metadata
+     id="metadata10">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs8" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1056"
+     id="namedview6"
+     showgrid="false"
+     inkscape:zoom="0.472"
+     inkscape:cx="250"
+     inkscape:cy="250"
+     inkscape:window-x="0"
+     inkscape:window-y="24"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg2" />
+  <path
+     d="m 121.67073,70.753329 0,359.389241 c 0,12.19281 8.74009,22.00921 23.46146,21.00294 14.72137,-1.00628 22.01162,-5.33889 27.30623,-10.32034 71.43412,-52.70054 141.82816,-106.26647 212.71245,-159.42587 7.89079,-6.55446 17.48742,-12.31195 23.29965,-20.13673 5.24872,-9.68035 -1.12541,-20.67448 -11.37732,-26.63162 C 320.53204,173.95026 244.16396,113.11502 166.1641,53.583899 c -4.02348,-2.658979 -9.04841,-4.760077 -22.40044,-4.800328 -13.35284,-0.04025 -22.09293,9.776148 -22.09293,21.968958 z m 44.01841,39.302621 c 32.61935,25.56497 124.45828,97.72763 175.71703,139.98708 3.07839,5.93701 -5.40168,9.45575 -9.37686,13.25704 -54.54483,42.67403 -111.22136,83.65914 -166.34097,125.8727 z"
+     id="path4"
+     inkscape:connector-curvature="0" />
+</svg>
diff --git a/resources/styles/dependencies/helpers.scss b/resources/styles/dependencies/helpers.scss
index 26a81fc4fe..d5f9001784 100644
--- a/resources/styles/dependencies/helpers.scss
+++ b/resources/styles/dependencies/helpers.scss
@@ -44,6 +44,10 @@ $br-big: 8px;
   width: 50%;
 }
 
+.column-half {
+  margin-right: $small;
+}
+
 // Display
 .hidden {
     display: none;
diff --git a/resources/styles/partials/sidebar-element-options.scss b/resources/styles/partials/sidebar-element-options.scss
index cf09de28f1..8d583d82c7 100644
--- a/resources/styles/partials/sidebar-element-options.scss
+++ b/resources/styles/partials/sidebar-element-options.scss
@@ -75,6 +75,107 @@
 
   }
 
+  .element-list {
+    margin-bottom: $small;
+
+    li {
+      align-items: center;
+      border-bottom: 1px solid $soft-ui-border;
+      display: flex;
+      flex-direction: row;
+      padding: $small;
+      width: 100%;
+
+      .list-icon {
+
+        svg {
+          fill: $medium-ui-icons;
+          height: 15px;
+          margin-right: $x-small;
+          width: 15px;
+        }
+
+      }
+
+      span {
+        color: $medium-ui-text;
+        font-size: $fs14;
+        max-width: 75%;
+        overflow-x: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .list-actions {
+        align-items: center;
+        cursor: pointer;
+        display: none;
+        margin-left: auto;
+
+        a {
+
+          svg {
+            fill: $soft-ui-icons;
+            height: 15px;
+            margin-left: $x-small;
+            width: 15px;
+
+            &:hover {
+              fill: $intense-ui-icons;
+            }
+
+          }
+
+        }
+
+      }
+
+      &:hover {
+
+        .list-icon {
+
+          svg {
+            fill: $main-ui-color;
+          }
+
+        }
+
+        span {
+          color: $main-ui-color;
+        }
+
+      }
+
+      &.selected {
+
+        .list-icon {
+
+          svg {
+            fill: $main-ui-color;
+          }
+
+        }
+
+        span {
+          color: $main-ui-color;
+          font-weight: bold;
+        }
+
+      }
+
+    }
+
+    &:hover {
+
+      .list-actions {
+        display: flex;
+        @include animation(0s,.3s,fadeIn);
+      }
+
+    }
+
+  }
+
 }
 
 .element-set-content {
@@ -137,6 +238,16 @@
 
   }
 
+  .save-btn {
+    width: 100%;
+  }
+
+  .cancel-btn {
+    color: $color-danger;
+    text-align: center;
+    width: 100%;
+  }
+
 }
 
 .color-th {
@@ -195,6 +306,7 @@
 
   }
 
+
 }
 
 .element-color-picker {
diff --git a/resources/styles/partials/sidebar-interactions.scss b/resources/styles/partials/sidebar-interactions.scss
new file mode 100644
index 0000000000..05ce217bd6
--- /dev/null
+++ b/resources/styles/partials/sidebar-interactions.scss
@@ -0,0 +1,6 @@
+// This Source Code Form is subject to the terms of the Mozilla Public
+// License, v. 2.0. If a copy of the MPL was not distributed with this
+// file, You can obtain one at http://mozilla.org/MPL/2.0/.
+//
+// Copyright (c) 2015-2016 Andrey Antukh <niwi@niwi.nz>
+// Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
diff --git a/src/uxbox/main/ui/workspace/sidebar/interactions.cljs b/src/uxbox/main/ui/workspace/sidebar/interactions.cljs
new file mode 100644
index 0000000000..13f6ddf615
--- /dev/null
+++ b/src/uxbox/main/ui/workspace/sidebar/interactions.cljs
@@ -0,0 +1,87 @@
+;; This Source Code Form is subject to the terms of the Mozilla Public
+;; License, v. 2.0. If a copy of the MPL was not distributed with this
+;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
+;;
+;; Copyright (c) 2015-2016 Andrey Antukh <niwi@niwi.nz>
+;; Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
+
+(ns uxbox.main.ui.workspace.sidebar.options.interactions
+  (:require [sablono.core :as html :refer-macros [html]]
+            [rum.core :as rum]
+            [lentes.core :as l]
+            [uxbox.locales :refer (tr)]
+            [uxbox.router :as r]
+            [uxbox.rstore :as rs]
+            [uxbox.state :as st]
+            [uxbox.library :as library]
+            [uxbox.data.shapes :as uds]
+            [uxbox.data.lightbox :as udl]
+            [uxbox.ui.icons :as i]
+            [uxbox.ui.mixins :as mx]
+            [uxbox.util.dom :as dom]
+            [uxbox.util.data :refer (parse-int parse-float read-string)]))
+
+(defn- interactions-menu-render
+  [own menu shape]
+    (html
+     [:div.element-set {:key (str (:id menu))}
+      [:div.element-set-title (:name menu)]
+
+      [:div.element-set-content
+
+       [:span "Trigger"]
+       [:div.row-flex
+        [:select#style.input-select {:placeholder "Choose a trigger"
+                                     :value ""}
+         [:option {:value ":click"} "Click"]
+         [:option {:value ":doubleclick"} "Double-click"]
+         [:option {:value ":rightclick"} "Right-click"]
+         [:option {:value ":hover"} "Hover"]
+         [:option {:value ":mousein"} "Mouse in"]]]
+
+       [:span "Action"]
+       [:div.row-flex
+        [:select#style.input-select {:placeholder "Choose an action"
+                                     :value ""}
+         [:option {:value ":show"} "Show"]
+         [:option {:value ":hide"} "Hide"]
+         [:option {:value ":toggle"} "Toggle"]
+         [:option {:value ":moveto"} "Move to"]
+         [:option {:value ":moveby"} "Move by"]]]
+
+       [:span "Element"]
+       [:div.row-flex
+        [:select#style.input-select {:placeholder "Choose an element"
+                                     :value ""}
+         [:option {:value ":1"} "Box 1"]
+         [:option {:value ":2"} "Circle 1"]
+         [:option {:value ":3"} "Circle 2"]
+         [:option {:value ":4"} "Icon 1"]
+         [:option {:value ":5"} "Icon 2"]]]
+
+       [:span "Page"]
+       [:div.row-flex
+        [:select#style.input-select {:placeholder "Choose a page"
+                                     :value ""}
+         [:option {:value ":1"} "page 1"]
+         [:option {:value ":2"} "page 2"]
+         [:option {:value ":3"} "page 3"]
+         [:option {:value ":4"} "page 4"]
+         [:option {:value ":5"} "page 5"]]]
+
+       [:span "Key"]
+       [:div.row-flex
+        [:select#style.input-select {:placeholder "Choose a key"
+                                     :value ""}
+         [:option {:value ":1"} "key 1"]
+         [:option {:value ":2"} "key 2"]
+         [:option {:value ":3"} "key 3"]
+         [:option {:value ":4"} "key 4"]
+         [:option {:value ":5"} "key 5"]]]]
+         ]))
+
+(def interactions-menu
+  (mx/component
+   {:render interactions-menu-render
+    :name "interactions-menu"
+    :mixed [mx/static]}))
diff --git a/src/uxbox/main/ui/workspace/sidebar/options.cljs b/src/uxbox/main/ui/workspace/sidebar/options.cljs
index a738933e40..e77cc96cf7 100644
--- a/src/uxbox/main/ui/workspace/sidebar/options.cljs
+++ b/src/uxbox/main/ui/workspace/sidebar/options.cljs
@@ -28,6 +28,7 @@
             [uxbox.main.ui.workspace.sidebar.options.fill :as options-fill]
             [uxbox.main.ui.workspace.sidebar.options.text :as options-text]
             [uxbox.main.ui.workspace.sidebar.options.stroke :as options-stroke]
+            [uxbox.main.ui.workspace.sidebar.options.interactions :as options-interactions]
             [uxbox.common.geom :as geom]
             [uxbox.util.dom :as dom]
             [uxbox.util.data :refer (parse-int parse-float read-string)]))
@@ -35,11 +36,11 @@
 ;; --- Constants
 
 (def ^:private +menus-map+
-  {:icon [:menu/icon-measures :menu/fill :menu/stroke]
-   :rect [:menu/rect-measures :menu/fill :menu/stroke]
-   :line [:menu/line-measures :menu/stroke]
-   :circle [:menu/circle-measures :menu/fill :menu/stroke]
-   :text [:menu/fill :menu/text]
+  {:icon [:menu/icon-measures :menu/fill :menu/stroke :menu/interactions]
+   :rect [:menu/rect-measures :menu/fill :menu/stroke :menu/interactions]
+   :line [:menu/line-measures :menu/stroke :menu/interactions]
+   :circle [:menu/circle-measures :menu/fill :menu/stroke :menu/interactions]
+   :text [:menu/fill :menu/text :menu/interactions]
    :group []})
 
 (def ^:private +menus+
@@ -70,7 +71,11 @@
    {:name "Text"
     :id :menu/text
     :icon i/text
-    :comp options-text/text-menu}])
+    :comp options-text/text-menu}
+   {:name "Interactions"
+    :id :menu/interactions
+    :icon i/action
+    :comp options-interactions/interactions-menu}])
 
 (def ^:private +menus-by-id+
   (into {} (map #(vector (:id %) %)) +menus+))