diff --git a/app/index.html b/app/index.html
index dc0da36..a9676a3 100644
--- a/app/index.html
+++ b/app/index.html
@@ -81,6 +81,25 @@
             <input type="number" id="seq_proj_count_2" class="count" value="00000" onchange="gui.counterFormat(this, mcopy.state.projector.pos);" onblur="gui.updateProj(this);" />
           </div>
         </div>
+        <div id="buttons">
+          <div>
+            <button id="cmd_cam_forward" onclick="cmd.cam_forward(light.color);" class="cmd"><i class="fa fa-step-forward"></i>CAM FORWARD</button>
+          </div>
+          <div>
+            <button id="cmd_cam_backward" onclick="cmd.cam_backward(light.color);" class="cmd"><i class="fa fa-step-backward"></i>CAM BACKWARD</button>
+          <div>
+            <button id="cmd_black_forward" onclick="cmd.black_forward();" class="cmd"><i class="fa fa-step-forward"></i>BLACK FORWARD</button>
+          </div>
+          <div>
+            <button id="cmd_black_backward" onclick="cmd.black_backward();" class="cmd"><i class="fa fa-step-backward"></i>BLACK BACKWARD</button>
+          </div>
+        </div>
+        <div>
+          <button id="proj_forward" onclick="cmd.proj_forward();" class="cmd"><i class="fa fa-step-forward"></i>PROJ FORWARD</button>
+        </div>
+        <div>
+          <button id="proj_backward" onclick="cmd.proj_backward();" class="cmd"><i class="fa fa-step-backward"></i>PROJ BACKWARD</button>
+        </div>
         <footer>
           <div id="log"></div>
         </footer>
@@ -101,7 +120,7 @@
                 </div>
             </div>
           </div>
-          <div id="cmy-page" class="colors-page">
+          <!--<div id="cmy-page" class="colors-page">
             <div id="dial-c" class="dial-wrapper">
               <div class="dial-container dial-container1">
                 <div class="dial-wedge"></div>
@@ -150,7 +169,7 @@
             <div id="cmy-preview">
               rgb(0, 0, 0)
             </div>
-          </div>
+          </div>-->
           <div id="rgb-page" class="colors-page">
             <input id="rgb" value="rgb(0, 0, 0)" />
           </div>
@@ -176,6 +195,26 @@
           </div>
         </footer>
       </div>
+      <div id="settings" class="screen">
+        <h4>Devices</h4>
+        <select>
+          
+        </select>
+        <button title="Refresh devices"><i class="fa fa-refresh"></i></button>
+        <h4>Projector</h4>
+        <select>
+          
+        </select>
+        <h4>Camera</h4>
+        <select>
+          
+        </select>
+        <input type="text" id="intval" name="intval" placeholder="INTVAL3 URL"/>
+        <h4>Light</h4>
+        <select>
+          
+        </select>
+      </div>
     </div>
     <div id="overlay" onclick="gui.overlay(false);gui.spinner(false);"></div>
     <div id="spinner"></div>
diff --git a/app/lib/nav-ui.js b/app/lib/nav-ui.js
index c87e177..3f9aa96 100644
--- a/app/lib/nav-ui.js
+++ b/app/lib/nav-ui.js
@@ -8,11 +8,11 @@ nav.init = function () {
 		name: 'toolbar',
 		items: [
 			{ type: 'radio',  id: 'sequencer',  group: '1', caption: 'Sequencer', icon: 'fa fa-th', checked: true },
-			{ type: 'radio',  id: 'script',  group: '1', caption: 'Script', icon: 'fa fa-code' },
 			{ type: 'radio',  id: 'controls',  group: '1', caption: 'Controls', icon: 'fa fa-tasks' },
 			{ type: 'radio',  id: 'light',  group: '1', caption: 'Light', icon: 'mcopy-light' },
+			{ type: 'radio',  id: 'script',  group: '1', caption: 'Script', icon: 'fa fa-code' },
 			{ type: 'spacer' },
-			{ type: 'button',  id: 'settings',  group: '1', caption: 'Settings', icon: 'fa fa-cogs' }
+			{ type: 'radio',  id: 'settings',  group: '1', caption: 'Settings', icon: 'fa fa-cogs' }
 		],
 		onClick : function (event) {
 			nav.change(event.target);